CaiJingLong

XCode16 构建 Flutter iOS时出错的结果

Fri, 14 Mar 2025 13:29:44 +0800

Unable to find a target named `RunnerTests` in project `Runner.xcodeproj`

https://stackoverflow.com/questions/76247185/unable-to-find-a-target-named-runnertests-in-project-runner-xcodeproj

删掉 Podfile 中和 RunnerTests 相关的配置

unable to rename temporary

1Error (Xcode): unable to rename temporary
2'/Users/cai/Library/Developer/Xcode/DerivedData/ModuleCache.noindex/9LDJVJOXFOAC/MobileCoreServices-DDUM1B0YO78K-cda47703.pcm.tmp'
3to output file
4'/Users/cai/Library/Developer/Xcode/DerivedData/ModuleCache.noindex/9LDJVJOXFOAC/MobileCoreServices-DDUM1B0YO78K.pcm': 'No such
5file or directory'

https://stackoverflow.com/questions/79118572/xcode-16-and-ios-18-project-not-compiling

配置 Xcode 的 DerivedData 路径，修改为相对路径，即相对 <flutter_project_path>/ios 的路径

使用 Amper 管理 KMP 应用

Thu, 16 Jan 2025 09:34:41 +0800

我假设你已经阅读了环境配置与运行并完成了相关环境变量的配置。本文将深入探讨如何打包 KMP 应用。

根据官方文档介绍，JetBrains 推出了一个全新的构建工具 Amper ，可以统一处理构建、打包和发布的全流程：

它是一个以 Gradle 为后端，以 YAML 配置文件为前端的强大工具。它能大大简化应用的配置流程，提高开发效率。

可以查看 Amper 的文档：来了解更多细节。

新建项目

由于 Amper 目前仍处于活跃开发阶段，文档和功能都在不断更新。对于新项目来说，使用最新的工具链会更加便捷。

因此，我建议使用 KMP Wizard 来创建新项目：

在模板库（Template Gallery）中选择 "Shared UI Mutilplatform App"

下载并解压项目文件后，使用 Android Studio 打开它。首先需要同步 Gradle 项目：

项目结构解析

这是一个标准的 Gradle 项目结构，主要包含以下核心文件夹：

目前项目包含了 Android 和 iOS 两个平台的支持，我们接下来将添加桌面端支持。

让我们先了解一下几个关键文件夹的作用：

module.yaml：子项目的模块配置文件
src 目录：存放源代码，其中每个子模块都包含 Kotlin 文件。值得注意的是，Kotlin 代码可以与平台原生代码（如 Swift）实现互操作

扩展项目：添加桌面端支持

让我们先明确一点：Amper 的设计目标是简化配置流程，统一桌面端和移动端的配置项，从而降低项目管理的复杂度。它的强大之处在于不仅支持 KMP 项目，还完整支持纯 JVM 应用开发。

安装 Kotlin Multiplatform 环境并运行在 macOS 上

Tue, 14 Jan 2025 16:33:43 +0800

新的系列

Kotlin-Compose 系列，我3年前使用的时候，深感这东西发展还不够，写了一些东西，但没有继续深究旧东西

听说，这个东西在最近两年飞速发展下，已经初具人形了？所以我打算再探一下 kmp。

安装 Kotlin Multiplatform 环境

我这里因为只运行到桌面端，所以只安装桌面端环境。如果你需要移动端，请参阅官方文档

Android Studio
Xcode
JDK
Kotlin Multiplatform plugin

其中需要注意的是，Plugin 不支持 K2 模式，所以你得去设置中关闭 K2 模式。

有一个问题，如果你根据文档安装了 kdoctor，因为 plugin 改了名字，所以会一直提示未安装 Kotlin Multiplatform Mobile Plugin: not installed 插件，别理它！

创建项目

打开 KMP Wizard 来创建一个项目

可以看到，有两个标签，一个是 New Project，一个是 Template Gallery，顾名思义:

New Project 是新建项目
Template Gallery 是模板库，可以从中选择一个模板，然后创建项目

我这里只选择了 New + Kotlin Multiplatform 桌面端

下载后，解压缩，并用配置好插件的 Android Studio 打开即可

设置一些东西以更好的使用

gradle_wrapper

国内，强烈建议修改的东西，如果你有全局 tun 模式，那当我没说

Gradle wrapper 使用国内镜像的那点事

Tue, 12 Dec 2023 14:45:00 +0800

Gradle wrapper 这东西不知道什么时候，下载被迁移到了 Github 的 release 里，下载速度骤降，曾几何时 Gradle 团队还高调宣布国内 CDN，现在看来 Gradle 团队也降本增效了。

解决方案有如下几种，具体使用什么方式，要看你自己的情况。

直接替换 url

这种情况适用于项目是内部项目或者都是国内人员参与的项目。

替换方式为直接替换 gradle/wrapper/gradle-wrapper.properties 下的 url 到国内镜像即可，比如 https://mirrors.cloud.tencent.com/gradle/gradle-8.5-all.zip。

使用代理

自备

不能替换的情况

比如某个项目是开源项目，你需要上传到 github，那你就不应该这么做了，你不能假定使用者都是国内的人。这种情况下可能就需要研究下正常情况下是放在哪里的了。

主要方式就是自行下载并复制到对应文件夹下。

默认情况下，每个版本的 Gradle wrapper 会在 $GRADLE_HOME/wrapper/dists/{version}/{hash} 下这个 version 是包含类型的，例如 gradle-7.4-all ，是包含 -all 后缀的。然后 hash 则是 md5 后的 base36，生成方法在这里

 1
 2    /**
 3     * This method computes a hash of the provided {@code string}.
 4     * <p>
 5     * The algorithm in use by this method is as follows:
 6     * <ol>
 7     *    <li>Compute the MD5 value of {@code string}.</li>
 8     *    <li>Truncate leading zeros (i.e., treat the MD5 value as a number).</li>
 9     *    <li>Convert to base 36 (the characters {@code 0-9a-z}).</li>
10     * </ol>
11     */
12    private String getHash(String string) {
13        try {
14            MessageDigest messageDigest = MessageDigest.getInstance("MD5");
15            byte[] bytes = string.getBytes();
16            messageDigest.update(bytes);
17            return new BigInteger(1, messageDigest.digest()).toString(36);
18        } catch (Exception e) {
19            throw new RuntimeException("Could not hash input string.", e);
20        }
21    }

其实这样，我们只需要根据 url 替换，并帮它完成下载步骤即可，写个工具即可。

c/c++ 项目基础

Mon, 24 Apr 2023 08:23:52 +0800

c/c++ 可以说是现代软件的基石，类库繁多，构建工具也很多。

在介绍构建工具前，我打算梳理一下 c/c++ 体系的一些基本概念。

1. 编译器

编译器的目的是编译源代码，生成可执行文件或类库文件。

典型的编译器组成部分如下：

前端
优化器
后端

嗯？什么，前端不是写 js 的吗？怎么编译器也有前端了？请听我娓娓道来

1.1 前端

编译器的前端不同于软件开发中的前端，它的主要任务是词法分析、语法分析和语义分析。

词法分析的任务是将源代码分割成一个个的词法单元，比如 int、main、(、)、{、}、;、return、0、;。

语法分析的任务是将词法单元组合成语法单元，比如 int main() { return 0; }。

语义分析的任务是检查语法单元是否符合语法规则，比如 int main() { return 0; } 是合法的，而 int main() { return 0 } 是不合法的。

一般来说，编译器的前端会生成一棵语法树（AST），AST 这个词就很眼熟了，经常在各种演讲炫耀中听到，全称是抽象语法树（Abstract Syntax Tree）。咱们听到 react/flutter 中的摇树优化（tree shaking）就是摇这个玩意。

1.2 优化器

优化器在分类时其实属于后端，但是现在通常会单独提出来作为一部分。

优化器的任务是对语法树进行优化。因为编译的本质是将源码转为二进制，所以优化器的优化目标是二进制代码，而不是源码。

它可以做一些显而易见的事，比如将 int a = 1 + 2; 优化成 int a = 3;。这样可以减少运行时的执行步骤。当然，现代的 ide 会提示你合并，但是那和本文无关。

Gradle 编写Plugin

Fri, 20 Jan 2023 20:45:00 +0800

首先，是官方文档 Gradle的插件支持任意的JVM语言来编写，当前最常见的是Java或Kotlin

插件的类型

通常来说，插件的编写有3个位置

直接在项目里写脚本，比如kts或者groovy的，好处是简单清晰，但这样的插件问题是无法运行在别的项目，并且不太适合复杂逻辑
在 buildSrc 目录里写，好处是可以使用多个文件，并且相对工程化一些，缺点同上
单独的工程，对，插件本身也可以是一个gradle项目，通常一个Gradle plugin会包含多个Task。当然，实际引用时只需要一个jar包即可，无论你项目的类型，并且，可以公开发布到mavenCentral或自己的私服，方便引用，一般来说强烈推荐这种方式

项目脚本的方式

创建一个项目 gradle init --type=basic，然后一路回车默认下来即可首先，编写一个Plugin，并且引入插件

 1import org.gradle.api.*
 2
 3class ScriptPlugin implements Plugin<Project>{
 4   @Override
 5    public void apply(Project project) {
 6        println("Apply the script plugin")
 7    }
 8}
 9
10apply plugin: ScriptPlugin // 引入插件

这个插件只会做一个事，输出一行文本然后，因为这个文件目前还在其他的文件里，我们将这个文件引入项目

1apply from: './s.groovy'

在引入前后分别执行 gradle tasks可以得到不同的日志

这里，可以看到这行日志，是执行在 configure project阶段通常来说，引入插件不是目的，目的是在于添加task，并在后续中使用，我们修改一下插件的源码

 1import org.gradle.api.*
 2
 3class ScriptPlugin implements Plugin<Project>{
 4   @Override
 5    public void apply(Project project) {
 6        println("Apply the script plugin")
 7        // 形参project是当前项目的引用，可以通过task方法添加任务
 8        project.task('say') {
 9            doLast {
10                println('Say hello')
11            }
12            description = 'Say hello task' // 这个任务的描述，可以通过 gradle tasks --all 查看
13        }
14    }
15}
16
17apply plugin: ScriptPlugin // 引入插件

在修改后，我们使用groovy tasks --all查看一下任务列表

Gradle buildSrc

Wed, 18 Jan 2023 20:45:00 +0800

使用方法

这个东西的使用方法很简单，在项目下创建一个buildSrc文件夹，然后刷新gradle项目即可 Gradle会自动将这个文件夹识别为一个Gradle项目，并支持在项目的build.gradle中引用

我在项目中创建如下的一个文件夹 buildSrc

1plugins {
2    id 'java'
3}

 1package top.kikt;
 2
 3import org.gradle.api.Plugin;
 4import org.gradle.api.Project;
 5
 6public class MyPlugin implements Plugin<Project> {
 7
 8    @Override
 9    public void apply(Project project) {
10        System.out.println("Apply MyPlugin from project: " + project.getName());
11    }
12}

 1import top.kikt.MyPlugin
 2
 3plugins {
 4    id 'java'
 5}
 6
 7group 'org.example'
 8version '1.0-SNAPSHOT'
 9
10repositories {
11    mavenCentral()
12}
13
14dependencies {
15    testImplementation 'org.junit.jupiter:junit-jupiter-api:5.8.1'
16    testRuntimeOnly 'org.junit.jupiter:junit-jupiter-engine:5.8.1'
17}
18
19test {
20    useJUnitPlatform()
21}
22
23apply plugin: MyPlugin

Gradle Wrapper

Mon, 16 Jan 2023 15:20:00 +0800

Gradle 推荐使用 Wrapper 的方式来构建工程 Wrapper 根据我的理解，是帮助不同的所有开发同一个项目的人使用相同的 Gradle 版本，从而避免Gradle版本差异带来的问题，而“副作用”就是不同的项目使用相同的 Gradle Wrapper 版本不需要重新下载。

给项目添加 wrapper

一般来说，如果使用的是 IDE（例如Jetbrains IDEA)或 Spring boot 创建的项目都会包含Wrapper，不需要自行添加。但如果你的项目是命令创建的，或因为其他原因不包含 wrapper 目录，则需要自行添加通过如下的代码给项目添加 wrapper，一般来说这取决于你的 gradle 版本，使用 gradle -v 或 gradle --version来查看版本

1gradle wrapper

使用后，会根据你当前的Gradle版本创建wrapper

关于版本控制

在版本控制工具上提交项目代码的时候，一定要把wrapper文件夹包含在内。 通常来说，一个带有wrapper的项目根目录会包含 gradlew 和 gradle.bat 文件，前者是给 linux/macOS 使用的，后者是 windows，使用方式是

1./gradlew xxxx # mac/linux
2gradle.bat xxxx # windows

如果你 clone 的 gradle 项目代码不包含 wrapper 目录，那这个项目的管理者可能不太懂 gradle，很多时候你能跑起他的项目是需要靠运气的，因为不同版本的gradle差异还是存在的。

版本号

一个典型的包含wrapper的项目结构如下

其中gradle-wrapper.properties文件内会指定了gradle的版本号等信息，一般建议使用对应的all版本，并且，如无特殊情况，新项目建议永远使用当前的最新版

1distributionBase=GRADLE_USER_HOME
2distributionPath=wrapper/dists
3distributionUrl=https\://services.gradle.org/distributions/gradle-7.4-bin.zip
4zipStoreBase=GRADLE_USER_HOME
5zipStorePath=wrapper/dists

1distributionUrl=https\://services.gradle.org/distributions/gradle-7.4-bin.zip
2distributionUrl=https\://services.gradle.org/distributions/gradle-7.5.1-all.zip

Gradle 的约定式概念

Mon, 16 Jan 2023 10:45:00 +0800

Gradle 中存在很多约定式的东西，也就是理论上不支持配置，或者哪怕可以配置，也不建议修改的东西

build.gradle

Gradle 构建系统的入口，一般一个gradle项目应该首先看这里，这里会指定项目的几乎所有配置对于Java项目来说，包含但不仅限于指定项目是java app还是java library，依赖的三方库，源文件包含什么，打包时应该包含的文件，签名方式，上传maven的配置等等

settings.gradle

如果是子项目，可能不包含这个文件，但主项目一般都应该包含这个文件，一般情况下，这个文件指定了项目名称和整个工程包含的项目

buildSrc

这个文件夹很神奇，这里可以定义你在构建系统中需要用到的源码，计划中，我会单独开一篇文章来聊聊怎么使用和有什么用。 Gradle buildSrc

Gradle Plugin

Sun, 15 Jan 2023 20:45:00 +0800

在 Gradle 中使用 Plugin 大概有如下两种方式

使用 Gradle 第一方提供的内置插件，或第三方的插件
自己编写的，放在 buildSrc 的

在本篇中插件和 Plugin 为同义 本篇只写如何使用Plugin，关于编写Plugin单独开一篇来写编写 Plugin

内置插件

有2种常见的引入模式

1plugins {
2    id 'java'
3}
4
5apply plugin: 'java'
6apply plugin: JavaPlugin // 注意这里没有引号，这个 JavaPlugin 是一个 Groovy 对象

这几种是相同的作用需要注意的一点是，如果是使用 plugins 闭包来引入插件，则要注意顺序，否则会报如下的错，而apply plugin则没有这样的要求

1only buildscript {}, pluginManagement {} and other plugins {} script blocks are allowed before plugins {} blocks, 
2no other statements are allowed

按 Gradle 定义，只有buildscript``pluginManagement两种闭包可以放在这个前面，另外就是其他的 plugins 闭包可以在前面

三方插件

1plugins {
2    id 'com.jfrog.bintray' version '1.8.5' 
3    id 'com.jfrog.bintray' version '1.8.5' apply false
4}

使用 version 来指定版本号，如果 apply 为false，则表示在子项目中使用，不立即加载

Gradle Task的创建和使用

Sun, 15 Jan 2023 20:45:00 +0800

创建栈

1tasks.register("Hello") {
2    doLast {
3        println("Run the method do last")
4    }
5}

使用 gradle -q Hello会得到输出

任务的生命周期

 1
 2tasks.register("World") {
 3    println("Config the world task")
 4    dependsOn("Hello")
 5    doFirst {
 6        println("World first")
 7    }
 8    doLast {
 9        println("World do last")
10    }
11}
12
13tasks.register("Hello") {
14    println("Config the hello task")
15    doLast {
16        println("Hello do last")
17    }
18    doFirst {
19        println("Hello do first")
20    }
21}
22
23tasks.register("Other") {
24    println("Config the other task")
25}

通过register来注册task，然后通过doLast和doFirst来确定顺序，通过dependsOn来指定是否要依赖其他的Task。有一个叫Other的任务因为没有被依赖，所以干脆就没有被调用，而本身的闭包内的内容是直接调用的，并没有遵循 Task 的依赖顺序，所以闭包内不能做其他任务做过的事。如果需要依赖其他的内容，还是需要在 doLast/doFirst里来做。

Gradle 基础

Sun, 15 Jan 2023 20:45:00 +0800

在我看来，Gradle 中有几项很基础的概念必须提前说明

概念

Gradle 的约定式概念

Gradle 命令行工具的使用

Sun, 15 Jan 2023 10:33:00 +0800

Gradle 本身包含一个命令行工具，正常情况下，Gradle的使用离不开命令行工具一个正常的Gradle项目应该包含 gradle/wrapper 文件夹，这里会指明你项目使用的Gradle版本，以保证所有项目参与者在不同的系统都使用相同的Gradle版本

最典型的使用

Gradle中最基本的概念之一，任务（Task），你需要执行哪个任务，就使用gradle [taskName]即可，典型的比如java项目包含的jar，安卓项目包含的assembleRelease，可以使用gradle tasks来查看当前项目包含的所有任务和对应的功能

参数的设置方式，可以在task前也可以在后，有两种参数，一种是有值的，一种是无值的(可以理解为true/false) 有值: --console=plain 无值: --build-cache --no-build-cache，就是在前面加--no-表示false 长参数，短参数的问题，简单来说，短参数有且只有一个字母，长参数就是完整单词，比如：--help``-h，是一个意思

调用 Task

gradle :jar 和 gradle jar 是一个意思但是当你有子项目的时候，比如你的子项目叫sub1，而根项目和子项目有jartask，那如果想要单独调用子项目的jar task，需要使用 gradle :sub1:jar或gradle sub1:jar

运行多个 task

当想要调用多个项目时，可以直接把task连续输入，使用空格分割即可，例如 gradle build jar就是同时调用两个task 同时运行多个项目时，gradle 的官方文档说明有如下2点

尽量快，比如提供并行编译等等
安全，比如 gradle clean build就是先清除再构建，而不会边清除边构建

不执行某特定的 task

按照官网介绍，dist 任务依赖test和compile，同时compile也依赖test，可以使用gradle dist --exclude-task test来跳过test任务，同时也会忽略掉compileTest这种任务

强制执行所有任务

gradle的任务有缓存机制（ up-to-date checks )，有的任务在某些时间内只会执行一次，可以强制指定这种任务每次都运行 gradle test --rerun-tasks

失败，但继续

gradle test --continue Gradle在任何任务发生错误时，会停止所有的任务，通过上面的命令可以在发生错误时完成所有不相干的命令（只要没有依赖关系）。

Task 名称的简写

这个很有意思，支持驼峰式的简写，比如你有一个任务叫myCompileSource，当然，也支持my-compile-src这种类型的简写你只需要gradle mCS就可以调用myCompileSource任务

约定式的任务

build check run clean 所有插件都应该包含的任务

Gradle 开始

Sat, 14 Jan 2023 20:45:00 +0800

官方的文档链接，针对的是 7.5.1 版本本文章对应的所有代码托管在 Git 仓库中

关于文档

项目可能会混杂 groovy、kotlin、java 的代码 groovy 是因为这是 gradle 默认使用的语言，.gradle 文件都是使用的 groovy 的语法 kotlin则是因为gradle将kt也作为一级语言来使用，扩展名大部分是kts java则是因为偶尔会有buildSrc文件夹内会使用，包括groovy中也会有java语法，因为几乎是完全兼容

为什么需要 Gradle

Gradle 在我的理解就是把复杂的过程简单化的过程，可以使用 Gradle 来构建自己的项目，如果有一个很复杂的项目或者项目是java、kotlin、android这样被gradle支持的类型，也应该使用gradle来完成它。

Groovy 语法

Fri, 13 Jan 2023 13:45:00 +0800

本文不是从零教 groovy，而是一些基础的 groovy 语法，够用就行另外，目前Gradle原生支持kts，简单来说就是用kt的语法来配置Gradle，新入门的话足够用后续的文章会加大kts的使用比例，来替代 groovy

基础类型

更多的是使用别人提供的插件，我们在使用的时候主要就是配置而已 gradle 脚本中包含了三种使用方式

闭包
方法
.的调用

其中我们最常见的其实是闭包，其次是方法，最后才是.的调用

方法

常见的apply其实就是调用 PluginAware.apply方法，from:则属于groovy的语法糖, from是方法的参数，冒号后跟的是参数

1apply from: 'xxx.groovy' // 这里的 apply 是一个自带的方法，使用的参数
2
3// 如果是 Java语法，则是如下写法：
4HashMap<String, ?> applies = new HashMap<String, ?>();
5applies.put("plugin", MyPlugin)
6apply(applies)

然后 java中的方法调用方法是 println("xxx");groovy 中可以使用 println ""; 所以，常见的设置maven仓库的方式 maven { url '' }其实是先调用了 maven 方法，然后在闭包中调用 setUrl 方法，参考文档

闭包

groovy 的闭包很有意思大量的闭包的签名是这样的

1MavenArtifactRepository maven(Action<? super MavenArtifactRepository> action)

然后结合语法糖，形成了如下这种闭包

1maven {
2    url 'xxxx'
3}

其实，这里的maven调用的是方法maven，同时，如果有需要，还可以使用变量来接收返回结果，并修改结果

. 的方式

1def m = maven {
2    url 'xxxx'
3}
4m.url = 'yyyy'

这样，会修改 url 的值

Gradle API

Thu, 12 Jan 2023 20:45:00 +0800

Project

目录 for content/post/gradle

Tue, 10 Jan 2023 20:45:00 +0800

Kotlin Compose 05 鼠标事件

Mon, 24 Oct 2022 12:00:35 +0800

文章摘要

Kotlin Compose 04 控件 Image

Thu, 20 Oct 2022 11:18:07 +0800

文档地址

简单说明

首先，代码部分，我会以 LazyColumn 作为 App 的根容器，这个容器可以简单理解为 ScrollView 和 ListView 的混合体，后面会详细说

然后每一个子元素会被包裹在一个 item {}闭包内，但每一个都包的话，很不oop，所以，我会略微封装一下，变成下面这样，这样我就可以直接在 MyColumn闭包内写每一个item了

 1@Composable
 2fun App() {
 3    var text by remember { mutableStateOf("Hello, World!") }
 4    val platformName = getPlatformName()
 5
 6    MyColumn {
 7        Button(onClick = {
 8            text = "Hello, $platformName"
 9        }) {
10            Text(text)
11        }
12    }
13
14}
15
16@Composable
17fun MyColumn(content: @Composable LazyItemScope.() -> Unit) {
18    LazyColumn {
19        item {
20            content()
21        }
22    }
23}

加载资源图片

compose 的图片是依托于 androidx.compose.foundation.Image控件来显示的一个入门级的示例

 1package top.kikt.common.image
 2
 3import androidx.compose.foundation.Image
 4import androidx.compose.foundation.layout.width
 5import androidx.compose.runtime.Composable
 6import androidx.compose.ui.Modifier
 7import androidx.compose.ui.graphics.ImageBitmap
 8import androidx.compose.ui.graphics.painter.Painter
 9import androidx.compose.ui.graphics.vector.ImageVector
10import androidx.compose.ui.res.loadImageBitmap
11import androidx.compose.ui.res.loadSvgPainter
12import androidx.compose.ui.res.loadXmlImageVector
13import androidx.compose.ui.res.painterResource
14import androidx.compose.ui.unit.Density
15import androidx.compose.ui.unit.dp
16import org.xml.sax.InputSource
17import java.io.File
18import java.net.URL
19
20@Composable
21actual fun ImageExample() {
22    Image(
23        painter = painterResource("header.svg"), // 支持格式：(BMP, GIF, HEIF, ICO, JPEG, PNG, WBMP, WebP) and vector formats (SVG, XML vector drawable).
24        contentDescription = "Sample", // 用于无障碍
25        modifier = Modifier.size(200.dp, 200.dp), // 设置约束
26        contentScale = ContentScale.FillBounds, // 设置缩放模式
27    )
28}

Kotlin Compose Kotlin Compose 03 Window

Tue, 18 Oct 2022 15:11:25 +0800

在 Compose 中，有几个基本的概念

概念

Application

Application 是一个 Compose 的应用，它通常是一个顶层的 Composable 函数，它的参数是一个 @Composable 的函数，这个函数就是我们的应用的主体。

Tray

Tray 是一个托盘（状态栏的图标），它通常是一个顶层的 Composable 函数，它的参数是一个 @Composable 的函数，这个函数就是我们的托盘的主体。

Window

Window 是一个窗口，对应了 windows/macOS/Linux 的窗口，它通常是一个顶层的 Composable 函数，它的参数是一个 @Composable 的函数，这个函数就是我们的窗口的主体。

Widget 是一个组件，也可以包含多个 Widget，包括 Text，Button，Image 等，都是 Widget，通常是一个 @Composable 函数。

架构

学会管理 Window 在 Kotlin Compose 中是非常重要的。

Compose 的结构如下，单Appliction，多 Window，多 Widget

每个窗口都有独立的Menu

Tray则由Application管理

graph TD APP[Appliction]-->W1[Window] W1-->V1[Widget] W1-->V2[Widget] W1-->V3[Widget] APP-->Tray[Tray] APP-->W2[Window] W2-->V11[Widget] W2-->V12[Widget] W2-->V13[Widget]

代码的组织

WindowManager

首先，需要配置一个顶层状态来使窗口和窗口状态可以对应上

  1package top.kikt.examples.window
  2
  3import androidx.compose.runtime.Composable
  4import androidx.compose.runtime.mutableStateListOf
  5import androidx.compose.ui.window.ApplicationScope
  6import androidx.compose.ui.window.MenuBar
  7import androidx.compose.ui.window.MenuBarScope
  8import androidx.compose.ui.window.Window
  9import top.kikt.examples.app.Content
 10import top.kikt.examples.example.image.ImageIconPainter
 11import top.kikt.examples.menubar.DefaultMenu
 12
 13/**
 14 * 定义一个了一个窗口管理器，用于管理窗口
 15 */
 16class WindowManager(private val applicationScope: ApplicationScope) {
 17
 18    /**
 19     * 所有窗口对应的状态
 20     */
 21    val windows = mutableStateListOf<WindowState>()
 22
 23    init {
 24        // 打开一个默认的窗口
 25        openDefaultWindow()
 26    }
 27
 28    fun openDefaultWindow() {
 29        windows += DefaultWindowState(this)
 30    }
 31
 32    fun openNewWindow(state: WindowState) {
 33        // 使用新的状态打开一个窗口
 34        windows += state
 35        println("Open the new window, the windows count: ${windows.count()}")
 36    }
 37
 38    // 关闭一个指定的窗口
 39    fun close(windowState: WindowState) {
 40        windows.remove(windowState)
 41    }
 42
 43    // 用于退出应用
 44    @Suppress("unused")
 45    fun exitApplication() {
 46        applicationScope.exitApplication()
 47    }
 48}
 49
 50/** 定义一个默认的窗口状态 */
 51abstract class WindowState(private val windowManager: WindowManager) {
 52
 53    /** 每个状态可以打开新窗口 */
 54    fun openNewWindow(
 55        menu: @Composable ((windowState: WindowState, menuBarScope: MenuBarScope) -> Unit)? = { state, scope ->
 56            scope.defaultMenu(state)
 57        },
 58        content: @Composable (windowState: WindowState) -> Unit,
 59    ) {
 60        windowManager.openNewWindow(WidgetWindowState(windowManager, content, menu))
 61    }
 62
 63    /** 默认的菜单栏 */
 64    @Composable
 65    protected fun MenuBarScope.defaultMenu(windowState: WindowState) {
 66        // 定义一个菜单项
 67        DefaultMenu(windowState)
 68    }
 69
 70    /** 关闭窗口 */
 71    fun close() {
 72        windowManager.close(this)
 73    }
 74
 75    /** 窗口的内容，抽象化，由子类实现 */
 76    @Composable
 77    abstract fun createContent(applicationScope: ApplicationScope)
 78}
 79
 80/** 默认的窗口状态 */
 81private class DefaultWindowState(windowManager: WindowManager) : WindowState(windowManager) {
 82    @Composable
 83    override fun createContent(applicationScope: ApplicationScope) {
 84        Window(
 85            onCloseRequest = this::close,
 86            title = "Compose for Desktop example",
 87            icon = ImageIconPainter(),
 88        ) {
 89            Content(this@DefaultWindowState)  // 一个默认的窗口内容
 90            MenuBar { defaultMenu(this@DefaultWindowState) } // 一个默认的菜单栏
 91        }
 92    }
 93}
 94
 95/** 用于创建一个窗口，所有内容外部传入 */
 96class WidgetWindowState(
 97    windowManager: WindowManager,
 98    private val widget: @Composable (windowState: WindowState) -> Unit,
 99    private val menu: @Composable ((windowState: WindowState, menuBarScope: MenuBarScope) -> Unit)? = null,
100) : WindowState(windowManager) {
101
102    @Composable
103    override fun createContent(applicationScope: ApplicationScope) {
104        Window(
105            onCloseRequest = { close() },
106            title = "Compose for Desktop example",
107            icon = ImageIconPainter(),
108        ) {
109            widget(this@WidgetWindowState)
110            MenuBar {
111                menu?.invoke(this@WidgetWindowState, this)
112            }
113        }
114    }
115}

上面是定义了一个窗口管理器，只需要调用对应的方法就可以管理状态，但是状态有了还需要和应用的窗口对应起来

Kotlin Compose Kotlin Compose 02 Create Project

Sun, 16 Oct 2022 08:29:17 +0800

开发环境

macOS
Idea 2022.2.1
jdk 17

开发环境这里，compose 打包时要求jdk版本大于15，而 java 的 lts 版本是8，11，17，我个人建议直接用17而不是15，开发时运行反而可以使用11，不过我个人觉得直接用17就好了

创建项目

新建项目，选择 Compose Mutilplatform类型

这里左边可以单独选择支持的类型，右边是多类型（桌面端+安卓）然后，等待依赖更新完成，我创建的是多类型的项目

看看配置文件

项目的配置文件是 kts 文件，这是 Gradle 项目 groovy 以外的另一种一级语言，使用 kotlin 语法，相比 groovy 来说，语法更加的“严谨”

settings.kts

 1// Copyright 2000-2022 JetBrains s.r.o. and contributors. Use of this source code is governed by the Apache 2.0 license.
 2pluginManagement { // 这个闭包是用于配置项目中用到的 plugin 的一些配置，以便做到不同的 module 使用相同的配置
 3    repositories { // 配置仓库
 4        google()  // 因为引入了安卓项目， google 仓库就是必须了的
 5        gradlePluginPortal()  // 这个是 gradle 的插件目录，一般很少用到
 6        mavenCentral()
 7        maven("https://maven.pkg.jetbrains.space/public/p/compose/dev") // kotlin compose 目前很多文件还是使用的这个仓库
 8    }
 9
10    plugins { // 这个闭包内指定了所有 plugin 的版本号，如果这里不指定，则子module中需要单独引入
11    // extra[key] 是读取了 gradle.properties 中定义的版本号
12        
13        kotlin("multiplatform").version(extra["kotlin.version"] as String)
14        kotlin("android").version(extra["kotlin.version"] as String)
15        id("com.android.application").version(extra["agp.version"] as String)
16        id("com.android.library").version(extra["agp.version"] as String)
17        id("org.jetbrains.compose").version(extra["compose.version"] as String)
18    }
19}
20
21rootProject.name = "KotlinComposeExample2"
22
23include(":android", ":desktop", ":common")

`<root>/build.gradle.kts`

 1group "top.kikt"
 2version "1.0-SNAPSHOT"
 3
 4allprojects { // 给所有子项目做配置
 5    repositories { // 给所有子项目指定仓库
 6        google()
 7        mavenCentral()
 8        maven("https://maven.pkg.jetbrains.space/public/p/compose/dev")
 9    }
10}
11
12plugins { // 配置插件， apply false 是懒加载
13    kotlin("multiplatform") apply false
14    kotlin("android") apply false
15    id("com.android.application") apply false
16    id("com.android.library") apply false
17    id("org.jetbrains.compose") apply false
18}

android/build.gradle.kts

安卓子项目的配置文件

Kotlin Compose Kotlin Compose 01 Start

Sat, 15 Oct 2022 10:00:05 +0800

Kotlin compose 是啥玩意

用 kotlin 开发桌面应用的东西，Jetbrains 出品

优势

Kotlin compose 在我看来，是一个很“巧妙”的东西，虽然这东西是 Jetbrains 开发的，但是使用了 Google 安卓的 Jetpack compose 的 api，这就造成了如下的优势

可以在满足一定条件的前提下，将业务逻辑由安卓端快速迁移到桌面端，共用部分代码，求同存异
利用 jvm 体系强大的三方库来快速开发
帮助不熟悉桌面开发的小伙伴使用更加“移动端”的思想来看待桌面端

文档

基于 2022-10-18 的情况，有很多的文档

使用javassist,修改jar包方法实现

Sat, 03 Oct 2020 20:13:47 +0800

本篇仅用于记录本人学习javassist的过程, 其中任何步骤或思想被用于非法用途与本人无关

环境介绍

macOS
Jdk8, 因为我是安卓开发, 事实上理论上也支持 14(未实测)
Intellij Idea 社区版
javassist 3.27.0-GA

javassist 简介

javassist 是什么东西

首先, 放上官网 , 简而言之, 这东西是一个库, 可以用来修改 java 的字节码

同时, 这东西不需要你了解太多的 class 在储存为.class 文件时的储存方式, 但需要你对于 java 反射有一定的了解, 因为这东西是以 jar 包的方式引入到 java 应用中, 然后可以通过封装的方式来修改 class 内方法实现

包含但不限于如下功能

添加,删除字段, 方法, 类. 包
修改方法, 类可见性
修改方法的实现体

应用范围

那么, 这东西有啥用呢?

比如, 有一个库是上古时期的人提供的, 没有源码, 没有文档, 开发者早联系不上了, 但我们可能需要修改其中的一个实现

你可能会想: 反编译啊, 重打包啊

但事实上很难行得通, 因为你重新编译时可能需要找到它当时依赖的所有 jar 包, 然后循环依赖引入, 或者可能你的 jar 包是一个安卓 jar 包, 所以需要安卓环境, 而把 android.jar 包引入 java 工程, 想想就很带感

Github action 的开发到发布

Mon, 07 Sep 2020 16:49:35 +0800

Github action 这东西是好东西, 但我看了一下, 很多朋友都是停留在用的阶段, 其实偶尔也要换换口味, 自己开发一个 action, 而不是仅仅是用

简介

github actions 是 github 推出的一个工作流的工具, 目的是为了帮助我们在某些情况下主动触发仓库的动作, 从而完成单元测试/CI/CD, 甚至包括 release,发布包管理工具等等

官方关于 actions 有关的一些仓库都在这里: https://github.com/actions , 文档在这里

github 的主语言是 js, 当然也肯定也支持 ts

另外如果对于速度需求并不高的朋友, 也可以使用 docker, 但因为 docker 安装的过程会根据镜像大小有一定的耗时, 所以不一定适用于所有朋友

如果，你对于本文章不是很感兴趣，可以参考创建 action 的文档

新建

因为我对于 js 比较不喜欢, 所以使用 ts(虽然也不是很感冒, 但是会好一点)

进入这个仓库 , 然后使用

按钮, 完成初始化的过程.

这里我们创建一个仓库, 这个仓库的目的是自动给 issue 打上 label

初始化后的仓库

简单介绍一下这个仓库, 有一些文件和注意事项

action.yml 是 action 本身的配置文件(别的项目实际就是读取这个东西来确定入口在哪里), 包括参数的配置都是这东西
一个标准的 npm 项目, 指定了入口
src 内是主要的 ts 代码
ts 代码需要被编译为 js 才能使用
dist 内就是编译产物, git 的版本控制需要包含 dist 下的所有文件, 不然运行的时候会是老代码
项目本身自带 action, 主要是 CI 这个项目的

入门

开发环境

vscode, 我这里是使用 vscode 进行编辑, 你请根据自己的情况
npm(node), 我是使用 nvm 管理的

如果你的 node 大于 12.0, 理论上不用动

flutter Jenkins+fastlane 自动化打测试包, 并上传蒲公英

Wed, 19 Aug 2020 09:10:29 +0800

自动化打包上传是一个释放双手的过程, 本文就简单重复一下打包的过程

本文包括 iOS 和 android 篇.

如果有需要, macOS 和 web 也可以加进来, 步骤并不复杂, 但本篇暂时不讲

开发环境

macOS, 如果你不是 macOS, 那你只能打包安卓部分
Xcode, 因为 Xcode 会自动安装包含 git 在内的一些其他环境, 所以理论上有这个就够了
brew
android sdk
flutter sdk
jenkins
fastlane

到 flutter sdk 为止就不讲了, 我相信看这篇文章的人, 起码 flutter 程序已经开发完了, 只是因为修改个文案就要打包的事被搞的不胜其扰, 才决定自动化的

而开发 flutter 基本上可以理解为包含如下工具/SDK

ruby
git
Xcode
brew
Android SDK
Flutter SDK

Jenkins

有几点要写在前面, 这东西建议使用 brew 安装, 当然你要是坚持, 也可以用 jendins 的 war/jar 包自己部署,见仁见智

但不要使用 docker 的方式, 因为 docker 不包含 xcode 的环境, 执行起来比较麻烦

编译 go 源码为 android 动态库(so)

Fri, 14 Aug 2020 20:45:00 +0800

golang跨平台, 性能强, 周边也算丰富

一直有一个想法, 把这东西写的代码编译成各个平台的库, 未来在 flutter 里用

开发环境和工具

MacOS(其他的暂时不考虑)
Go
- Go 1.14.6, 版本太低可能不能编译成 android 的
- Goland , 咱现在是正版用户, 用开源项目申请的All products License , 你也可以根据自己的情况选择别的 IDE 或使用文本编辑器(vscode 也不错)
Android
- Android Studio
- Cmake
- Android SDK
- Android NDK

Go 部分

go 源码

add_library.go

 1package main
 2
 3import "C"
 4
 5//export add
 6func add(x, y int) int {
 7	return x + y
 8}
 9
10//export remove_int
11func remove_int(x, y int) int {
12	return x - y
13}
14
15func main() {
16}

这里有几点要注意

package 一定要是 main(强制规定)
一定要包含 main 函数(强制规定)
import "C", 不能少, 因为要编译出 c(c++)的头文件
每个方法前要加//export 方法名, 这里要注意
1. // 和 export间不能有空格
2. 方法名和 go 的方法名必须完全一样
3. 方法名不能是 c 内置的方法名, 比如remove就不行

编译

我在项目里内置了两个脚本, 一个是编译 android 的, 一个是编译 macOS 的, 因为篇幅和主题的原因, macOS 的就不单独拿出来了

Flutter FocusNode 焦点那点事-(二)

Wed, 22 Jul 2020 09:29:11 +0800

上一章, 简单的使用了一下 FocusNode 和周边的一些东西, 今天来扒一扒 FocusNode 整体的附着(attach)和分离(detach)
flutter 环境还是针对 1.17.5

Focus 家族的源码分析

附着

首先第一, 平时是以 FocusNode 为主要对象的, 那么这东西是怎么附着到整体的呢

构造方法

debugLabel, 这东西看名字就是 debug 用的, 先不管
onKey, 一看就是接受事件用的RawKeyEvent
canRequestFocus, 就是能不能接受焦点
skipTraversal, 是否接受遍历

我们再找找方法

有几个可能用到的关键字段, 我们一个个看, 但是不一定会用的到, 但是有所了解也是好

context, 这个是和控件结合的, 单纯看这里还看不出来
_manager, 我们知道这个在 flutter 环境中其实是全局单例的, 但是这里为了解耦所以可能是哪里传进来的, 我们理论上可以忽略
_ancestors, 嗯.. 没有注释, 那就只能看看源码了

所以, 这个东西是把所有的父节点都装到了这个里. 嗯, 个人经验,应用层的话大概率用不上.
_descendants,这东西也是个三无, 没事

都在源码里了, 这东西是深度为 1 的子 node 的 descendants 和子node, 然后里面递归了... 换句话说, 其实, 这东西是所有的子 node

Flutter FocusNode 焦点那点事-(一)

Tue, 21 Jul 2020 11:22:10 +0800

很多时候, flutter 中需要处理输入的焦点, 咱们今天就来看看控件怎么用

本篇可以视为简单使用, 而不会深入源码去探讨怎么附着, 主要是 Focus 系列控件的使用, 和怎么在多输入框之间反复横跳

环境说明

本篇基本基于 flutter sdk 的 1.17.5 版本来看, 其他版本应该大同小异, 但很多东西可能会随时间变化, 未来是否有效请继续验证
本篇基本是针对移动端来说的
写本文时, flutter web 的焦点比较迷, 似乎和移动版不太一样, 所以暂时略过不表
desktop 版只尝试了 macOS, 其他的桌面引擎请自行校验对错

用 Caddy 解决 web 开发中本地跨域的问题

Sat, 06 Jun 2020 14:01:14 +0800

最近在尝试 flutter web, 会遇到一个问题, app 没问题, 然而同样的代码在 web 里就不好使了, 主要就是跨域的问题

搜了一下各种方案都是 nginx 的, 但是我抄过来发现不好使..

所以自己摸索一下解决方案

这个方案只适合于本地开发调试, 真实部署时只有两种方案

让服务器 api 允许跨域
部署到和服务器同一个域名,同一个端口下

另: 目前个人还是觉得 flutter web 不适合商用, 比较适合的场景是, 没有 android/ios 插件的项目中做远端展示使用,比如内部就不用分发 apk/ipa 了, 那两个东西打包太慢了, 这时候直接用 flutter web 就比较靠谱了

下载 Caddy

官网: https://caddyserver.com/ 找最新版本下载

因为这货是 GO 语言开发的, 所以只有单文件就可以部署了

我是 mac os, 我用的是 brew 安装的, brew install caddy

安装好了以后查看一下版本, 一定要是 2.0+ 版本的

1$ caddy version
2v2.0.0 h1:pQSaIJGFluFvu8KDGDODV8u4/QRED/OPyIR+MWYYse8=

注意: 因为这东西 2.0 版本有大更改, 配置文件和 1.x 并不通用, 我这里使用的是 2.0 语法, 1.x 版本的不要对号入座

Navigator Helper2

Thu, 30 Apr 2020 17:23:14 +0800

因为随着开发时间越来越长, 对于很多东西又有了新的理解, 是时候回头对于某些东西进行查漏补缺了

本篇就来补一补路由的东西

GlobalKey

这东西要单独说一说, 设置一下这东西, 你的 WidgetsApp 会把它设置给 Navigator, 这东西一旦设置成功, 后续就可以不用 Navigator.of, 拿到 NavigatorState 的实例了

然后这东西设置成全局的, 就可以在今后跳转的时候不用 context 了, 并且可以利用这个东西里的 context 来拿到全局的 Provider 类(这个不在本篇预计范围内)

设置:

1MaterialApp(
2    navigatorKey: navigatorKey,
3);

使用:

1NavigatorState get navigator => navigatorKey.currentState;

RouteHelper

全文如下, 但是有一个问题, 这个 navigatorKey 的 context 不能用于 showDialog, 所以需要自定义 dialog 的 route,才可以无 context 调用, 所以加了新的方法

同样的, 以前的 helper 中 push 才需要 context,pop 不需要考虑太多,所以没有 pop 方法, 现在因为有了全局 navigatorKey 来做路由, 所以添加了 pop 相关的方法

  1import 'package:flutter/material.dart';
  2
  3import 'dialog_route.dart';
  4
  5class RouteHelper {
  6  GlobalKey<NavigatorState> stateKey;
  7
  8  RouteHelper(this.stateKey);
  9
 10  NavigatorState get navigator => stateKey.currentState;
 11
 12  AnimUtils anim = AnimUtils();
 13
 14  Future<T> pushWidget<T>(
 15    Widget widget, {
 16    bool replaceRoot = false,
 17    bool replaceCurrent = false,
 18    dynamic replaceResult,
 19  }) {
 20    final materialRoute = MaterialPageRoute<T>(builder: (BuildContext context) {
 21      return widget;
 22    });
 23    return pushRoute<T>(
 24      materialRoute,
 25      replaceRoot: replaceRoot,
 26      replaceCurrent: replaceCurrent,
 27      replaceResult: replaceResult,
 28    );
 29  }
 30
 31  Future<T> pushRoute<T>(
 32    Route<T> newRoute, {
 33    bool replaceRoot = false,
 34    bool replaceCurrent = false,
 35    dynamic replaceResult,
 36  }) async {
 37    assert(!(replaceCurrent && replaceRoot), "这两货只有一个可以为true");
 38    if (replaceRoot) {
 39      while (true) {
 40        if (!(await navigator.maybePop())) {
 41          break;
 42        }
 43      }
 44      return navigator.pushReplacement<T, dynamic>(
 45        newRoute,
 46        result: replaceResult,
 47      );
 48    }
 49    if (replaceCurrent) {
 50      return navigator.pushReplacement<T, dynamic>(
 51        newRoute,
 52        result: replaceResult,
 53      );
 54    }
 55    return navigator.push<T>(newRoute);
 56  }
 57
 58  Future<T> showDialog<T>(
 59    Widget dialog, {
 60    TransitionsWidgetBuilder transitionsWidgetBuilder,
 61    TransitionsWidgetBuilder pageBuilder,
 62    Duration transitionsDuration = const Duration(milliseconds: 300),
 63  }) {
 64    // pageBuilder ??= anim.opacity;
 65    pageBuilder ??= anim.empty;
 66    transitionsWidgetBuilder ??= anim.opacity;
 67    return pushRoute<T>(
 68      DialogRoute<T>(
 69        child: dialog,
 70        pageBuilder: pageBuilder,
 71        transitionsWidgetBuilder: transitionsWidgetBuilder,
 72        transitionDuration: transitionsDuration,
 73      ),
 74    );
 75  }
 76
 77  bool pop<T>([T result]) {
 78    return navigator.pop(result);
 79  }
 80
 81  Future<bool> maybePop<T>([T result]) async {
 82    return navigator.maybePop(result);
 83  }
 84}
 85
 86class AnimUtils {
 87  Widget opacity(BuildContext context, Animation<double> animation,
 88      Animation<double> secondaryAnimation, Widget child) {
 89    return AnimatedBuilder(
 90      builder: (BuildContext context, Widget child) {
 91        return Opacity(
 92          opacity: animation.value,
 93          child: child,
 94        );
 95      },
 96      animation: animation,
 97      child: child,
 98    );
 99  }
100
101  Widget empty(BuildContext context, Animation<double> animation,
102      Animation<double> secondaryAnimation, Widget child) {
103    return AnimatedBuilder(
104      builder: (BuildContext context, Widget child) {
105        return child;
106      },
107      animation: animation,
108      child: child,
109    );
110  }
111}

对应的一个关联类, 内部是 dialog 的 route 动画等东西,dialog_route.dart

flutter 怎么实现app整体灰度

Sat, 04 Apr 2020 09:01:56 +0800

今天举国哀悼, 进入各种大厂的 app 也可以看到主色都变成灰色的了

作为程序员我们肯定会想怎么可以实现的, 我简单研究了 10 分钟, flutter 中只要在整体外面套一个 ShaderMask, 然后修改 blendMode 即可

核心代码:

 1class MyApp extends StatelessWidget {
 2  // This widget is the root of your application.
 3  @override
 4  Widget build(BuildContext context) {
 5    return ShaderMask(
 6      child: OKToast(
 7        child: MaterialApp(
 8          title: 'Pick Image Demo',
 9          theme: ThemeData(
10            primarySwatch: Colors.lime,
11          ),
12          home: MyHomePage(title: 'Pick Image Demo'),
13        ),
14      ),
15      shaderCallback: (Rect bounds) {
16        return ui.Gradient.linear(Offset.zero,
17            Offset(bounds.width, bounds.height), [Colors.grey, Colors.grey]);
18      },
19      // blendMode: BlendMode.dst,
20      blendMode: BlendMode.saturation,
21    );
22  }
23}

在最外层套一个ShaderMask, 然后返回一个 shader 就可以了, 这里我用的是渐变的Gradient ,还有别的方式可以用

效果: 之前: [文件]

Flutter 插件开发之引入aar到安卓部分并使用本地maven

Mon, 30 Mar 2020 14:14:39 +0800

本篇主题: 在 flutter 插件中引入 aar

本篇只包含 android 部分, iOS 的 framework 直接在 podspec 中引入就可以了,所以本篇略过不表

做过安卓开发的朋友可能知道, aar 文件如果作为本地文件直接引入 library, 然后 app 引用 library 是会报找不到aar的, 需要在 app 中使用 flatDir 进行引入, 这种方式的缺点在于, 你必须在每个项目去配置, 很有侵入性

熟悉 flutter 插件开发的朋友都知道,在我们开发 flutter 插件时, 插件是以 library module 的形式引入到项目中的

这时如果 sdk 方对于安卓只提供了 aar, 在这种大前提下,我们有如下几种方法:

使用 maven 公开服, 比如 jcenter, 或其他的 maven 仓库
使用本地 maven 仓库

本篇就使用这种本地 maven 仓库的方案来做

完成本地 maven 的步骤

创建插件项目

第一步肯定是创建一个 flutter 插件

1flutter create -t plugin example_for_flutter_plugin_local_maven

置入 aar

我这里用蒲公英的的 aar 举例:

hello

Sun, 29 Mar 2020 14:41:48 +0800

我是标题

1void main(){
2    print('Hello');
3}

1document.getElementById("");

1int main(){
2    printf("Hello world");
3    return 0;
4}

1- (NSString*) log {
2    NSLog(@"Hi objc");
3}

1fun main(){
2    println("Hello kotlin")
3}

1class Project {
2    func foo(str: String){
3        print("Hello :\(str)")
4    }
5}

使用 jsdelivr 加速 cocoapod 库

Wed, 18 Mar 2020 13:17:37 +0800

iOS 开发时, cocoapods(后简称 pod) 是很常用的工具

我们偶尔也会自己开发 pod 库并上传到 pod 上

pod 的源码支持多种来源, 本地 path git http 等

一般来说, 如果是纯开源库, 我们直接把源码上传到 github , 然后使用 git 依赖即可

但是这有一个问题, github 的速度在中国大陆并不快, 我们有没有办法加速它呢?

这时候经过搜索, jsdelivr 出现在了搜索引擎里, 号称国内外都可用的 cdn, 我用 wget 测试了一下, 国内外都可以保证 10M+/s 的速度

jsdelivr 介绍

这东西本身最初目的是为了加速 js/css 的访问

但是, 上面也说了, 支持"任何"在 github 上的仓库, 很好, 我就喜欢这样的东西

版本号的坑

文档上说支持所有 ref 作为版本号, 然而不是, 我这里测试只支持 tag/release

包体大小限制

我的目的是为了给 flutter_ijkplayer 的 iOS 仓库找一个下载地址, ijkplayer 的 iOS 部分很大, 我打包完有 150M, 用了 xz 压缩方案让包变成了 35M

flutter中的过场动画 PageTransitionsTheme

Mon, 24 Feb 2020 17:55:49 +0800

过场动画

过场动画也就是切换路由时的动画

这个东西有几种方案可以做

继承 PageRoute来做, 复写 5 个抽象方法, 并抽象buildTransitions
继承已有的系统类, 比如 MaterialPageRoute 或者 CupertinoPageRoute
一劳永逸的方案, 使用PageTransitionsTheme类结合 MaterialApp 的 theme 的pageTransitionsTheme属性

前两种目前网络上也有一些人做了分享, 但第三种好像很少有人使用, 我这里就来说一下PageTransitionsTheme的用法

这东西有如下的好处:

设置一次, 你所有的MaterialPageRoute都可以生效
对于命名路由, 也就是pushNamed体系的也有效

先分析下源码

为啥分析源码? 因为如果上来就用显得不高端

先找一个大家都知道的切入点, 一般的过场动画都是用的 Navigator.push 方法来实现的

看看方法里的实现, 会发现很多常见的东西, 比如, 每一个 Route 都有自己的 OverlayEntry

然后会有一个 install 方法

而实际调用中, 这个 Overlay 会被插入到 Overlay 栈内, 从而在界面上显示

经过这一串的调用, 就把 Navigator push 和 Route 关联到了一起, 那么 theme 是怎么和 Route 关联起来的呢, 我们进入 MaterialPageRoute 看一下

Flutter 1.12后上传aar至maven私服

Tue, 04 Feb 2020 18:23:24 +0800

前言

本篇写一个将 flutter 打包为 aar 置入已有项目的方案

与前篇不同的是: 本篇使用新版本的 flutter 环境, 使用 build aar 命令构建 aar,并上传至 maven 私服

开发环境

1$ flutter doctor -v
2[✓] Flutter (Channel stable, v1.12.13+hotfix.7, on Mac OS X 10.15 19A602, locale zh-Hans-CN)
3    • Flutter version 1.12.13+hotfix.7 at /Users/caijinglong/Library/Flutter/flutter_dev
4    • Framework revision 9f5ff2306b (9 天前), 2020-01-26 22:38:26 -0800
5    • Engine revision a67792536c
6    • Dart version 2.7.0

准备步骤

创建宿主工程

这个是模拟你本来的项目

作为原生开发者自行使用 Android Studio 创建即可

上传图片到Azure

Fri, 31 Jan 2020 14:08:04 +0800

前言

最近刚刚把图床迁移到 Azure, 因为 github 的图片不太好用,国内经常看不见

然而吧, 那是正则批量扫描 markdown 文件, 然后下载文件, 直接使用 git 管理的, 几百张的时候倒是还可以接受

但今后如果单张图片也需要这么做, 就很麻烦了, 以前是用 picGo 上传的图片

虽然现在 picGO 支持自己写插件, 但是 js 不是我的强项, 所以想自己写一个试试看

Api 分析

azure 有 Rest api 可以完成上传的步骤, 文档

然而这个 api 需要一个 commitId, 不像 github 的 api 比较智能, 直接上传就行.

但没关系, 我们可以通过两次接口访问得到它.

使用 postman 来测试下

访问 https://dev.azure.com/{{organization}}/{{project}}/_apis/git/repositories/{{repositoryId}}/pushes?api-version=5.0 得到一个结果

然后访问这个 url 参数的接口可以获取 commitId

也就是 git 的 commit hash 值

这里把 oldObjectId 替换成刚刚拿到的 commitId, 其他的根据自己的情况替换, 比如 comment 是注释, path 是你要放到哪个目录和名字, content 是图片的 base64 值

Android 记录在macOS上使用 NDK20 编译ffmpeg4.2.2的过程

Tue, 07 Jan 2020 11:50:07 +0800

前言

ijkplayer 的 ffmpeg 是旧版本的, ndk 也是旧的, 程序员爱折腾, 所以想用最新的 ndk 编译最新的 ffmpeg, 当前就是 ndk20+ffmpeg4.2.2 了

第一步自然是搜索有没有现成的, 运气不错, 找到了大佬的示例

本篇参考了 https://juejin.im/post/5d831333f265da03c61e8a28 的内容, 但因为我是 macOS, 所以进行了一些修改包括有的东西设置后发现没生效, 在实际打包的时候会报类似下面的这种错误

1ld: warning: building for macOS, but linking in object file (libswresample/libswresample.a(resample.o)) built for free standing

所以我根据实际的报错内容进行了修改

编译脚本

这里只需要修改你的 NDK 为你本地的 NDK 目录即可

最新的代码在这里: https://gist.github.com/CaiJingLong/feefa3b63e5b94f5ad1807825861e0e0 gist.github.com 需要自备梯子

 1#!/bin/bash
 2
 3NDK=/Volumes/Evo512/sdk/android-ndk-r20
 4TOOLCHAIN=$NDK/toolchains/llvm/prebuilt/darwin-x86_64
 5API=21
 6
 7function build_android
 8{
 9echo "Compiling FFmpeg for $CPU"
10./configure \
11    --prefix=$PREFIX \
12    --libdir=$LIB_DIR \
13    --enable-shared \
14    --disable-static \
15    --enable-jni \
16    --disable-doc \
17    --disable-symver \
18    --disable-programs \
19    --target-os=android \
20    --arch=$ARCH \
21    --cpu=$CPU \
22    --cc=$CC \
23    --cxx=$CXX \
24    --enable-cross-compile \
25    --sysroot=$SYSROOT \
26    --extra-cflags="-Os -fpic $OPTIMIZE_CFLAGS" \
27    --extra-ldflags="$ADDI_LDFLAGS" \
28    --disable-asm \
29    $COMMON_FF_CFG_FLAGS
30make clean
31make -j8
32make install
33echo "The Compilation of FFmpeg for $CPU is completed"
34}
35
36# # armv8-a
37# source "config-env.sh"
38# OUTPUT_FOLDER="arm64-v8a"
39# ARCH=arm64
40# CPU="armv8-a"
41# TOOL_CPU_NAME=aarch64
42# TOOL_PREFIX="$TOOLCHAIN/bin/$TOOL_CPU_NAME-linux-android"
43
44# CC="$TOOL_PREFIX$API-clang"
45# CXX="$TOOL_PREFIX$API-clang++"
46# SYSROOT="$NDK/toolchains/llvm/prebuilt/darwin-x86_64/sysroot"
47# PREFIX="${PWD}/android/$OUTPUT_FOLDER"
48# LIB_DIR="${PWD}/android/libs/$OUTPUT_FOLDER"
49# OPTIMIZE_CFLAGS="-march=$CPU"
50# build_android
51
52# # armv7-a
53# source "config-env.sh"
54# OUTPUT_FOLDER="armeabi-v7a"
55# ARCH="arm"
56# CPU="armv7-a"
57# TOOL_CPU_NAME=armv7a
58# TOOL_PREFIX="$TOOLCHAIN/bin/arm-linux-androideabi"
59
60# CC="$TOOLCHAIN/bin/armv7a-linux-androideabi$API-clang"
61# CXX="$TOOLCHAIN/bin/armv7a-linux-androideabi$API-clang++"
62# SYSROOT="$NDK/toolchains/llvm/prebuilt/darwin-x86_64/sysroot"
63# PREFIX="${PWD}/android/$OUTPUT_FOLDER"
64# LIB_DIR="${PWD}/android/libs/$OUTPUT_FOLDER"
65# OPTIMIZE_CFLAGS="-march=$CPU"
66# build_android
67
68# x86
69source "config-env.sh"
70OUTPUT_FOLDER="x86"
71ARCH="x86"
72CPU="x86"
73TOOL_CPU_NAME="i686"
74TOOL_PREFIX="$TOOLCHAIN/bin/${TOOL_CPU_NAME}-linux-android"
75
76CC="$TOOL_PREFIX$API-clang"
77CXX="$TOOL_PREFIX$API-clang++"
78SYSROOT="$NDK/toolchains/llvm/prebuilt/darwin-x86_64/sysroot"
79PREFIX="${PWD}/android/$OUTPUT_FOLDER"
80LIB_DIR="${PWD}/android/libs/$OUTPUT_FOLDER"
81OPTIMIZE_CFLAGS="-march=i686 -mtune=intel -mssse3 -mfpmath=sse -m32"
82build_android
83
84# x86_64
85# source "config-env.sh"
86# OUTPUT_FOLDER="x86_64"
87# ARCH="x86_64"
88# CPU="x86-64"
89# TOOL_CPU_NAME="x86_64"
90# TOOL_PREFIX="$TOOLCHAIN/bin/${TOOL_CPU_NAME}-linux-android"
91
92# CC="$TOOL_PREFIX$API-clang"
93# CXX="$TOOL_PREFIX$API-clang++"
94# SYSROOT="$NDK/toolchains/llvm/prebuilt/darwin-x86_64/sysroot"
95# PREFIX="${PWD}/android/$OUTPUT_FOLDER"
96# LIB_DIR="${PWD}/android/libs/$OUTPUT_FOLDER"
97# OPTIMIZE_CFLAGS="-march=$CPU"
98# build_android

根据自己需要的 cpu, 放开对应的注释即可

2019 总结

Sat, 04 Jan 2020 15:43:37 +0800

2019 年结束了, 本年做了什么呢?

1940 次 github 提交

公司工作

今年公司的工作并不繁重, 让我有了更多的时间来提升自己的专业技能

在工作中使用 flutter 作为基础开发 app, 从而实现了更轻松的跨平台

年中开发了一个新的商城 app, 当然也是 flutter

年底用了三周时间优化了蓝牙体系

个人开源工作

年初开源了 flutter_ijkplayer 项目

年中零零散散开源了一些库

Q3 重构了 photo_manager 底层

年底开源了两个蓝牙库(spp/ble), 一个图片处理库

编程技能

没有太多时间来对于 golang 提升, web 方面基本没学习, java 也没太碰

但在 dart/flutter 这条路上越走越远了

业余时间最多的是在音视频处理方面, ffmpeg 和 SDL 目前也算初步入坑了

2020 年小目标

c/c++ 语言有更深入的学习, 结合 golang/cgo 完成跨语言调用, 以便于未来开发 go-flutter-desktop 的插件
音视频处理方面, 结合 flutter 继续深入
入坑 opencv, 结合 ffmpeg 进一步处理视频
初步完成对于 flutter framework/flutter engine/sky 的了解, 以便于未来对 flutter engine/flutter framework 提有效的建议
进一步完善已开源的项目
好好学英语
挣点小钱

dart 2.6(一) 生成可执行二进制

Mon, 18 Nov 2019 16:09:31 +0800

什么叫可执行二进制

以前虽然看似也可以生成二进制执行文件, 类似 pub/flutter 命令, 但是那实际也是调用 dart 命令来完成的, 也就是说, 你必须具备 dart 环境才可以

比如以前的 c,后来的 go, 都可以编译成一个可执行文件, 比如./hello-world就可以运行, 然后在控制台输出结果

而在 dart 2.6 版本中, 这个东西变成了现实

如何做

1main(List<String> arguments) {
2  print("hello dart!");
3}

使用$ dart2native bin/main.dart来完成编译过程, 然后会生成一个main.exe, 虽然看着是 exe, 但这个东西是一个当前系统下的可执行二进制文件

1./bin/main.exe
2hello dart!

嗯, 这东西目前还不支持交叉编译, 也就是 mac 只能生成 mac 的, windows 只能生成 windows 的, 但是应该有很多人请愿, 未来一定会有相关的支持

目前可以使用 github actions, 或者 docker 之类的东西来跨平台编译

好处

单文件的部署方便, 未来写工具也会很方便

劣势

不支持交叉编译

文件较大, 一个简单的 helloworld 就有 6.7mb 之大, 相对应的, c 可能只有几 k, go 默认情况下也不到 1m,经过优化也能接近 c 的大小

在 Mac 上编译 OpenCV4 + Idea 使用Java调用

Tue, 12 Nov 2019 10:17:47 +0800

写在前面, 最近因为某些原因要用到 OpenCV, 加上这东西既然有 android 的库, 那说明 java 也有, 作为老本行我还是挺喜欢 Java 这个语言的

打算在 mac 上使用, 但是发现没有编译好的 dylib 库, 所以只能自己动手了

使用 MacPorts 的失败之路

这条路实测不通

这个 port 我通过 pkg 安装不上, 没有报错原因, 还给我残留了垃圾
通过编译 port 源码的方式安装完毕后, 安装 opencv 的过程需要安装一个 db48, 结果失败了, 猜测是 port 需要使用 db48 作为数据库来管理自己的库或者别的什么原因, 总之失败了

查看日志是 Xcode 的问题, 说已知 11.1 有问题, 请更新到 11.2 巴拉巴拉的..., 问题是开发人员知道 11.2 的问题更大... 用这版本 Xcode 的人不能上传 appstore...

11.1 有问题请修复 11.1 的问题.. 而不是简单让人升级, 升级 xcode 需要升级系统, 然后需要经历数个小时的折磨, 这只会让人放弃这个东西

在 flutter 上使用 c 代码 - (二) 无源码的项目

Mon, 04 Nov 2019 17:15:11 +0800

写在前面, 对于无源码的项目, 理论上必须有头文件,不然你不知道里面都定义了什么鬼东西.

本篇虽然是写无源码的项目, 但实际上还是会有源码部分, 只是通过 cmake,clang,xcodebuild,ndk 等工具编译成 so/framework 以供 android/ios 引入

生成动态库

整体的目录结构是这样的, 如果你只是要引入库, 可以跳过这步, 这步的主要做源码生成库的步骤

 1$ tree -L 3 cpp-source
 2tree -L 3 cpp-source
 3cpp-source
 4├── android
 5│   ├── CMakeLists.txt
 6│   ├── build_android.sh
 7│   └── cmd
 8│       └── android.sh
 9├── ios
10│   ├── CMakeLists.txt
11│   ├── build_ios.sh
12│   ├── cmd
13│   │   └── ios_abi_build.sh
14│   └── ios.toolchain.cmake
15└── src
16    ├── some.cpp
17    └── some.h

src 为源码

在 flutter 上使用 c 代码 - (一) 有源码的项目

Mon, 04 Nov 2019 11:35:42 +0800

在 flutter 的 1.10.x 后的分支, dart:ffi 被并入 flutter, 现在 flutter 中也可以使用 ffi 了。
这东西是啥玩意呢, 就是让 dart 可以直接调用 c/c++ 代码等东西的库, FFI(foreign function interface)，官方文档在这里。

但是在当前版本中, 这东西在官方说明中依然处于技术预览版, 就是可用, 但后续不保证 api 不变更。

开发环境

首先我是 mac 系统, windows 系统不保证脚本的可用和工具的可用, linux 的话可能一些必要工具需要使用自己平台的包管理工具, 并且涉及到 ios 部分, 必须使用 mac。

所有需要的工具包

Xcode(或 XcodeBuild 命令行工具)
brew
clang
cmake
Android 工具链
- Android SDK
- NDK
- Android Studio(可选)
- Gradle
Flutter 工具链
- SDK 1.10.x+
vscode(可选, 这东西看你的情况,作为示例的话只要是文本编辑器即可, 我本人使用这个作为主要的文本编辑器)

这里说的是包含后续所有用到的东西, 并不仅仅是本文。其中对于 flutter 开发者可能需要单独安装的应该只有 NDK 和 Cmake, 这两个东西是包含在 android sdk 下的, 可以使用 android studio 下载, 也可以单独下载

dart 大文件读取

Fri, 20 Sep 2019 15:15:51 +0800

好久没水文章了, 强行水一篇

dart 中不可避免会出现文件读取的情况, 甚至是很大的文件, 比如 200M 的文件

如果一次性读入内存,虽然也行得通, 但是如果在 flutter 中开启个 200M 大小的字节数组, 一不小心可能就 crash 了, 这时候就需要使用大文件读取的方案

异步读取

核心方法:

1file.openRead();

这个方法可以指定开始和结束的坐标, 并开启一个 stream

stream 回调信息是 List<int>,单次最大读取 65536 个字节

示例

 1class FileUtils {
 2  File file;
 3
 4  FileUtils(this.file);
 5
 6  // 读取文件的某个范围返回
 7  Future<List<int>> getRange(int start, int end) async {
 8    if (file == null || !file.existsSync()) {
 9      throw FileNotExistsError();
10    }
11    if (start < 0) {
12      throw RangeError.range(start, 0, file.lengthSync());
13    }
14    if (end > file.lengthSync()) {
15      throw RangeError.range(end, 0, file.lengthSync());
16    }
17
18    final c = MyCompleter<List<int>>();
19
20    List<int> result = [];
21    file.openRead(start, end).listen((data) {
22      result.addAll(data);
23    }).onDone(() {
24      c.reply(result);
25    });
26
27    return c.future;
28  }
29}

用到的 completer 在这里

Live Template groovy脚本的使用

Tue, 30 Jul 2019 21:43:25 +0800

Jetbrains 全家桶,包括 android studio, 支持一个东西叫 Live Template

这个东西可以预先储存一个模板, 帮助我们快速开发, 这个功能很多朋友应该都知道,也在用

本篇使用dart作为主要示例语言, dart 语言语法比较简单, 有 java/js 等常用语言基础的都应该能看懂

简单使用

虽然想要重点介绍 groovyScript 的脚本使用, 但是也应该简单介绍下 Live Template

比如我可以存一个 stful, 然后会自动生成一段代码, 当然这个模板是 flutter 开发自带的

进阶

自己搞一个小模板

这个模板就生成一个我们自己的类库调用, 比如我自己封装了一个 http 访问

1final response = await HttpHelper.fetchString(url);

以这段代码为例, 我们一个小 app 可能有 100 个接口, 这时候 LiveTemplate 就派上用场了

我这里为了图省事, 直接指定只要是 dart 语言都生效

flutter Form 表单组件的初步解析

Mon, 22 Jul 2019 15:16:45 +0800

在一个正常的应用程序中, 表单是用户交互的很重要的一部分

flutter 中你可以自己"绑定"用户的输入数据和 state 中的字段

当然, 还有另一个选择, Flutter 内置了 Form 组件给我们使用, 这个组件是 flutter 框架提供出来帮助我们操作表单的一个组件, 应该是官方较为推荐的方案

不过 Form 的相关中文文章不太多, 基本都是介绍一下 TextFormField 的使用, 更多的 api 云里雾里的, 可能有些朋友不太好理解
我粗略的解析下源码和自定义, 帮助看过的朋友理解下 Form 体系

Form 体系的简单使用

自动校验

官方提供给了我们一些组件来结合 Form 使用, 最常见的就是 TextFormField

 1import 'package:flutter/material.dart';
 2
 3class SimpleUseComponent extends StatefulWidget {
 4  @override
 5  _SimpleUseComponentState createState() => _SimpleUseComponentState();
 6}
 7
 8class _SimpleUseComponentState extends State<SimpleUseComponent> {
 9  @override
10  Widget build(BuildContext context) {
11    return Form(
12      onChanged: () {
13        print("form change");
14      },
15      child: Column(
16        children: <Widget>[
17          TextFormField(
18            initialValue: "你好",
19            validator: (value) {
20              if (value.isEmpty) return "不能为空";
21              return null;
22            },
23            autovalidate: true,
24          ),
25        ],
26      ),
27    );
28  }
29}

当我输入/删除时, 会出现日志: 'form change'

Go Flutter Desktop (二) go 二进制程序打包为 mac app(dmg)

Mon, 08 Jul 2019 14:16:54 +0800

前篇对于 go-flutter 引擎进行了初步的探索, 打包终产物是一个二进制文件配合一些资源文件

本篇研究如何将终产物变成一个 app, 进一步变成 dmg, 就和你网上下载的工具一样

本篇默认你拥有全套的工具, git xcode flutter go hover

打包出 go 终产物

这里以法空大佬的 JsonToDart 为例

1cd /tmp
2git clone https://github.com/fluttercandies/JsonToDart.git
3cd JsonToDart/Flutter/desktop

打包

1hover build

这里可能很快也可能很慢, 根据你的工程大小和网络速度而言, 网络速度是因为要下载 flutter 依赖和 go-flutter 引擎相关的东西, 工程大小影响编译速度

然后可以看到当前的目录结构

 1tree -L 2 desktop/build/outputs/darwin
 2desktop/build/outputs/darwin
 3├── FlutterEmbedder.framework
 4│   ├── FlutterEmbedder -> Versions/Current/FlutterEmbedder
 5│   ├── Headers -> Versions/Current/Headers
 6│   ├── Modules -> Versions/Current/Modules
 7│   ├── Resources -> Versions/Current/Resources
 8│   └── Versions
 9├── assets
10│   └── icon.png
11├── flutter_assets
12│   ├── AssetManifest.json
13│   ├── FontManifest.json
14│   ├── LICENSE
15│   ├── fonts
16│   ├── isolate_snapshot_data
17│   ├── kernel_blob.bin
18│   ├── packages
19│   └── vm_snapshot_data
20├── icudtl.dat
21└── json_to_dart

其中这个 json_to_dart 就是可运行的二进制文件我们可以直接通过$ desktop/build/outputs/darwin/json_to_dart来运行

Go Flutter Desktop (一) 初探

Thu, 04 Jul 2019 16:07:17 +0800

Flutter 在去年的时候就有一个第三方的桌面引擎, 是用 golang 开发的

Github 地址是:https://github.com/go-flutter-desktop/go-flutter

目前在 mac,linux,windows 均可用, 作为一个 mac 用户, 除了 retina 下字显得有点小, 感觉没有单独适配外, 总体感觉是优于官方的 desktop 引擎的

另外我是真实的 golang 脑残粉, 我觉得 golang 这东西真的太好了, 用 golang, 准不会错

开发环境

需要的开发环境, 因为我是 MacOS, 我以 macOS 为例,其他的请参考对应的系统

Xcode 命令行体系, 这个东西包含很多开发套件(Git), 无论你是否用 XCode 开发,都建议装一个...
Flutter 环境和配套工具, 这个跑不掉,作为 flutter 开发者...
go 语言环境(使用 brew 安装), 1.12+, IDE 用 Jetbrains 家的 goland (你用 VSCode 的话看你自己的情况)

环境安装

对 flutter 桌面版本感兴趣的一定接触过 flutter 开发, 我就默认你有 flutter 全套开发环境

把flutter作为framework添加到已存在的iOS中

Sun, 16 Jun 2019 11:17:43 +0800

之前写了一篇关于如何将 flutter 直接打包成 android aar 的文章, 本篇写一写如何将 flutter 打包成 framework 以便于直接让没有 flutter 环境的 iOS 开发者使用, 因为国内很多项目都有这样的要求

本篇并不会做完全的工程集成化, 只是做一下如何将 flutter 的 framework 打出来, 并且置入到 iOS 原生工程中, 因为各项目一定户会有自己的特殊性, 不可能完全一样

本篇打包脚本部分参考了 https://www.jianshu.com/p/700bd7d2122b 的内容,但是又有一些针对 flutter 版本的变化和 flutter type 不同的情况进行的修改, 不观看连接中的内容并不会影响观看

开发环境

MacOS
XCode 10
git
flutter 及 flutter 的相关工具链
cocoapods

把flutter项目作为aar添加到已有的Android工程上

Fri, 14 Jun 2019 09:06:24 +0800

对于已有工程想要尝鲜 Flutter, 很多公司给出了最佳实践方案, android 中是使用 aar 加入项目中, 这样原生开发对于 flutter 环境就没有要求了, 只要 flutter 打包后上传 maven 即可, 但是这部分的过程坑很多, 后面我会再补充这种方案

我也摸索了一个实践方案, 将所有项目的 aar 由 flutter 方打包 aar 后将 aar 置入某一个固定位置 ,并置入一个 git 库管理, 然后 android 原生方直接 pull 后引入项目即可

高能预警: 本篇会结合 flutter, android, aar, gradle, maven, docker 的知识来完成所有的步骤

并不是每一个都会详细说明, 如果有不明白的可以在 https://www.kikt.top 的本文下面留言, 我会更新文章或给予解答, 其他渠道的可能不会有时间看

开发环境

本人设备环境

MacOS 10.13.6 (17G65)
flutter: Flutter 1.5.4-hotfix.2 • channel stable

Flutter Desktop Mac版(二) 插件初探

Wed, 12 Jun 2019 16:47:14 +0800

上篇粗略的查看了一下 desktop 的基本使用, 本篇探索一下插件的使用

环境变量的配置请查看上篇,本篇不再赘述

更新

继上一篇文章过去了几天, 这个桌面引擎有了一点点的更改: 现在完全用 swift 了,不用 oc 了,无论是 example 还是 plugin 模板都是如此

所以, 为了省事,我重新 clone 了一个仓库, 然后准备用 swift 来创建插件

$ git clone https://github.com/google/flutter-desktop-embedding.git flutter-desktop-embedding-2

然后分别打开工程和插件 $ code flutter-desktop-embedding-2/example/ and $ code flutter-desktop-embedding-2/plugins/example_plugin

这个 example_plugin 是给的模板, 最好是复制一份出来

复制插件目录

1cd flutter-desktop-embedding-2/plugins
2cp -r example_plugin math_desktop
3code math_desktop

查看一下目录结构

 1tree math_desktop
 2
 3math_desktop
 4├── LICENSE
 5├── lib
 6│   └── example_plugin.dart
 7├── linux
 8│   ├── Makefile
 9│   ├── example_plugin.cc
10│   └── example_plugin.h
11├── macos
12│   ├── Classes
13│   │   └── ExamplePlugin.swift
14│   └── example_plugin.podspec
15├── pubspec.yaml
16└── windows
17    ├── ExamplePlugin.vcxproj
18    ├── ExamplePlugin.vcxproj.filters
19    ├── example_plugin.cpp
20    ├── example_plugin.h
21    └── scripts
22        └── cache_flutter.bat

基本是约定式的,和移动版的很类似

Flutter Desktop Mac版(一) 初探

Mon, 10 Jun 2019 14:40:17 +0800

随着时间的逐渐推移, Flutter 开始了扩张之路

flutter 已经不满足于移动端了,桌面端也有着自己的野心

但无论如何,目前 flutter desktop 还仅仅处于 demo 玩一玩的阶段, 如果谁敢生产项目来一套, 我佩服你是个勇士

官方说明

https://github.com/flutter/flutter/wiki/Desktop-shells

目前完成度最高的是 macOS 的版本,可用度很高, 而且由于同样使用 cocoapod,所以相对来说官方制作 engine 难度应该是最低的

创建项目

现在建议使用官方本身提供的脚手架, 自己创建的话比较麻烦

https://github.com/google/flutter-desktop-embedding 这个库目前托管在 google 下,还没有转给 flutter,也就是说暂时还不能称之为 flutter sdk 的一部分

git clone https://github.com/google/flutter-desktop-embedding

我根据文档创建了一个 sh 脚本,专门用于输出我如果想尝鲜 desktop 版需要的东西, 也就是环境变量了

1export FLUTTER_ROOT=$PWD/flutter
2echo "使用前复制如下命令\n"
3
4echo "export FLUTTER_ROOT=$FLUTTER_ROOT"
5echo "export FLUTTER_HOME=$FLUTTER_ROOT"
6echo "export PATH=$FLUTTER_ROOT/bin:$PATH"
7echo "export ENABLE_FLUTTER_DESKTOP=true"
8
9echo "\n以上"

这里我单独的 clone 了一份 sdk, 跑在了 flutter 的 master 分支上

然后把 flutter 设置环境变量到这个 flutter sdk 上

flutter 在OC工程中添加swift库报错的问题

Fri, 31 May 2019 14:43:33 +0800

下午看见群里有人问 swift 插件导入 oc 项目报错的问题, 我之前解决过, 但是忘了解决过程是怎么样的了, 这里记录下方便以后备查

没兴趣追踪原因的直接查看总结下

复现错误

创建一个主工程(oc)

1flutter create oc_project

创建一个插件工程(swift)

1cd oc_project
2flutter create -i swift -t plugin swift_plugin

关联工程

1  swift_plugin:
2    path: ./swift_plugin
3    ```

运行 iOS 项目得到错误信息

 1Launching lib/main.dart on iPhone XS Max in debug mode...
 2
 3CocoaPods' output:
 4
 5↳
 6
 7      Preparing
 8
 9    Analyzing dependencies
10
11    Inspecting targets to integrate
12
13      Using `ARCHS` setting to build architectures of target `Pods-Runner`: (``)
14
15    Fetching external sources
16
17    -> Fetching podspec for `Flutter` from `.symlinks/flutter/ios`
18
19    -> Fetching podspec for `swift_plugin` from `.symlinks/plugins/swift_plugin/ios`
20
21    Resolving dependencies of `Podfile`
22
23    Comparing resolved specification to the sandbox manifest
24
25      A Flutter
26
27      A swift_plugin
28
29    Downloading dependencies
30
31    -> Installing Flutter (1.0.0)
32
33    -> Installing swift_plugin (0.0.1)
34
35      - Running pre install hooks
36
37    [!] Unable to determine Swift version for the following pods:
38
39    - `swift_plugin` does not specify a Swift version and none of the targets (`Runner`) integrating it have the `SWIFT_VERSION` attribute set. Please contact the author or set the `SWIFT_VERSION` attribute in at least one of the targets that integrate this pod.
40
41    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/lib/cocoapods/installer/xcode/target_validator.rb:115:in `verify_swift_pods_swift_version'
42
43    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/lib/cocoapods/installer/xcode/target_validator.rb:37:in `validate!'
44
45    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/lib/cocoapods/installer.rb:459:in `validate_targets'
46
47    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/lib/cocoapods/installer.rb:138:in `install!'
48
49    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/lib/cocoapods/command/install.rb:48:in `run'
50
51    /Library/Ruby/Gems/2.3.0/gems/claide-1.0.2/lib/claide/command.rb:334:in `run'
52
53    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/lib/cocoapods/command.rb:52:in `run'
54
55    /Library/Ruby/Gems/2.3.0/gems/cocoapods-1.6.1/bin/pod:55:in `<top (required)>'
56
57    /usr/local/bin/pod:22:in `load'
58
59    /usr/local/bin/pod:22:in `<main>'
60
61Error output from CocoaPods:
62
63↳
64
65    [!] `<PBXGroup UUID=`97C146E51CF9000F007C117D`>` attempted to initialize an object with an unknown UUID. `CF3B75C9A7D2FA2A4C99F110` for attribute: `children`. This can be the result of a merge and  the unknown UUID is being discarded.
66
67    [!] Automatically assigning platform `ios` with version `8.0` on target `Runner` because no platform was specified. Please specify a platform for this target in your Podfile. See `https://guides.cocoapods.org/syntax/podfile.html#platform`.
68
69Error running pod install
70
71Error launching application on iPhone XS Max.
72
73Exited (sigterm)

错误信息大概是这样的

Android Q 隐私篇(5) - 相机/网络

Fri, 24 May 2019 15:00:09 +0800

如下几个改动:

相机

这个修改会影响所有的安装在 androidQ 上的应用, 不论你的 targetVersion 是多少

从前,即使没有 Camera 的权限, 也可以访问相机设备的元数据, 现在不行了

wifi

应用不能动 wifi 开关了, 现在只有通过设置来更改

wifi 配置

现在必须有设备管理器的权限才能修改 wifi 配置

ACCESS_FINE_LOCATION 带来的影响

如果没有ACCESS_FINE_LOCATION这个权限, 则 wifi,蓝牙会有一堆不能访问的 api

原文链接

或者看下面

Telephony
- TelephonyManager
  - getCellLocation()
  - getAllCellInfo()
  - requestNetworkScan()
  - requestCellInfoUpdate()
  - getAvailableNetworks()
  - getServiceStateForSubscriber
  - getServiceState()
- TelephonyScanManager
  - requestNetworkScan()
- TelephonyScanManager.NetworkScanCallback
  - onResults()
- PhoneStateListener
  - onCellLocationChanged()
  - onCellInfoChanged()
  - onServiceStateChanged()
Wi-Fi
- WifiManager
  - startScan()
  - getScanResults()
  - getConnectionInfo()
  - getConfiguredNetworks()
- WifiAwareManager
- WifiP2pManager
- WifiRttManager
Bluetooth
- BluetoothAdapter
  - startDiscovery()
  - startLeScan()
- LeScanCallback()

后记

以上

Android Q 隐私篇(4) - 唯一标识符, 剪切板数据

Fri, 24 May 2019 11:49:11 +0800

第四篇,

唯一识别码的前世

在开发中, 总有人会提出各种设备"唯一标识符"的概念,以便于定位用户的唯一性, 或对于用户行为进行分析

很遗憾, 通过多年的探索, 目前没有任何一种特别准确, 一定能保证唯一的方案

包括但不仅限于以下方案

设备序列号 IMEI imsi mac 地址(wifi 模块)

如以下代码:

 1package top.kikit.uniqueidprivacy
 2
 3import android.Manifest
 4import android.annotation.SuppressLint
 5import android.content.Context
 6import android.os.Bundle
 7import android.telephony.TelephonyManager
 8import android.util.Log
 9import androidx.appcompat.app.AppCompatActivity
10import com.tbruyelle.rxpermissions2.RxPermissions
11
12class MainActivity : AppCompatActivity() {
13    private val TAG = "MainActivity";
14
15    private val rxPermissions = RxPermissions(this)
16
17    @SuppressLint("CheckResult")
18    override fun onCreate(savedInstanceState: Bundle?) {
19        super.onCreate(savedInstanceState)
20        setContentView(R.layout.activity_main)
21
22
23        val mTelephonyMgr = getSystemService(Context.TELEPHONY_SERVICE) as TelephonyManager
24
25        rxPermissions.request(Manifest.permission.READ_PHONE_STATE)
26            .subscribe {
27                if (it) {
28                    val subscriberId = mTelephonyMgr.subscriberId // imsi
29                    val imei = mTelephonyMgr.imei // imei
30
31                    Log.i(TAG, "subscriberId : $subscriberId")
32                    Log.i(TAG, "imei : $imei")
33                }
34            }
35    }
36}

唯一识别码的今生(androidQ 的更新)

唯一识别符

mac 地址

随机 mac 地址

现在默认传输随机 mac 地址

Android Q 隐私篇(3) - 限制后台活动

Tue, 21 May 2019 09:49:25 +0800

官方链接: https://developer.android.com/preview/privacy/background-activity-starts

后台开启界面

这个限制主要限制的是: 当你的应用没有 Activity 在前台时, 后台应用无法主动开启界面

流氓应用是可以这么干的, 只是大部分应用还算有节操, 没有这么做而已

我自己遇到的除了我写的 Demo 以外,只有微信发生过这样的情况,还有一些其他应用是代码疏漏造成的

作用范围

只要你的 app 运行在 androidQ 的设备上, 就不行,哪怕你的 targetVersion 是 28 也一样

微信

微信也仅仅是在你登录以前登录过的电脑端时, 在你点击电脑端的确认后,才会在手机端弹出手动确认的弹框, 这一步原则上来讲也是客户自己的行为, 所以没有太大问题, 当然以后理论上就做不到了

代码疏漏

一些应用的启动页, 比如设定了一个 Handler 的倒计时, 在 3 秒后关闭启动页,然后开启主页面

然后,用户在启动页点了 home 键/back 键,过 3 秒后主页面依然出来了

很遗憾,以后不行了 😁

迁移需要修改的代码

无

一个简单的示例代码

 1class MainActivity : AppCompatActivity() {
 2
 3    override fun onCreate(savedInstanceState: Bundle?) {
 4        super.onCreate(savedInstanceState)
 5        setContentView(R.layout.activity_main)
 6
 7        Handler().postDelayed({
 8            startActivity(Intent(this, this.javaClass))
 9            finish()
10        }, 3000)
11    }
12}

这就完成了一个"流氓"式启动

Android Q 隐私篇(2) - 后台定位权限

Tue, 21 May 2019 09:14:28 +0800

本篇是系列第二篇, 主要分析下 android Q 下的后台定位权限官方链接 , 有能力的朋友可以自己阅读,并不难

定位权限

在从前的 android 中,定位权限不分前后台,只有两个

1<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
2<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

分别代表大致位置和精确位置, 一般来说在使用时定位权限都是一起要或者都不要的, 而且这两个作为同一个组,一般都是一起申请,一次授权

一般来说大部分人都是使用高德/百度地图作为定位 sdk 使用, 很显然这两个货申请一般也是都一起申请的

androidQ 的权限

androidQ 中会添加一个新的权限

1  <uses-permission android:name="android.permission.ACCESS_BACKGROUND_LOCATION" />

这个就是对应的后台权限, 和以前的分类方式不同,以前是精确度,这个是前后台

按照官方说明:

targetVersion: androidQ 或以上
1. 如果 targetVersion 是 androidQ+, 则这个权限不会自动添加, 使用者需要自己添加,有就是有,没有就没有
如果 targetVersion 是 api 28(android 9.0)以下
1. 如果你有以前版本的定位权限,则系统会在安装时帮你添加后台的权限(升级 androidOS 版本时不明)
2. 在动态权限申请时,如果你申请的权限有以前的定位权限之一, 则会自动帮你在申请的权限里加上这个后台的

请求后台权限

上来是一段废话...

简单解释, 你需要后台权限吗?

不需要
需要

这个不是我们自己能定的, 以国内来看, 接 sdk (推送,定位,分享...)就要, 不接也要

如果不需要

请参考官方示例

Service 中声明一个前台定位的 type 类型

1<service
2    android:name="MyNavigationService"
3    android:foregroundServiceType="location" ... >
4    ...
5</service>

如果需要

需要的情况下, 如果是在 service 里面做请求定位的逻辑, 请保证每一次都要运行时权限检查, 因为用户随时可以关闭应用的后台权限

Android Q 隐私篇(1) - 外部储存

Mon, 20 May 2019 09:43:48 +0800

一年一度的 googleIO 开完以后,不出意外的 Android10.0 系统(AndroidQ)出来了

隐私配置又㕛叒叕更新了..

连接地址: https://developer.android.com/preview/privacy 这个地址可能在来年就变成 android 11 的了, 所以仅保证在2019 年 05 月 20 日以及之后的一段时间内有效

主要包含以下五大项目

对于大部分应用来说,储存方式的更新会有所影响, 其他的可能都是 SDK 要做的事情,和普通开发者关系不大

在适配新的系统前就和从前一样,暂时不升级 targetVersion,把 targetVersion 设置为 28 以下就不会影响旧程序了,就如同以前运行时权限真的是坑到爆炸,但是暂时不适配也是可以的

但是未来无论如何都需要适配新系统,所以先来看看

本篇只说储存的方式和权限问题,其他暂时略过不表

检查迁移情况

https://developer.android.com/preview/privacy/checklist 有一个表格提供了如何检查和迁移的方案

开发环境

说一下开发环境

MacOS
Android Studio 3.4.0
android 9.0 设备一台
androidQ 虚拟机一台(官方的 Emulator)

更新 sdk

更新 sdk, 下载 androidQ 相关的 sdk/sdktools/模拟器

androidQ build.gradle

当前想尝试 androidQ 的话, 编译版本和目标版本号需要按如下方式设置, 今后的话可能是 29/30 之类的数字

1targetSdkVersion = 'Q'
2compileSdkVersion = 'android-Q'

外部储存

androidQ 下读写文件

权限和以前一样

CameraX的使用

Tue, 14 May 2019 13:44:59 +0800

我在 googleIO 前查看演讲主题,看到了有一篇标题是关于 cameraX ,当时在 android 官网没有搜索到教程

在 flutter web 基本体验完毕后, 再去搜索果然从官网查看到了 cameraX 的相关介绍

官网链接官方使用说明

介绍

CameraX 是 Jetpack 的一部分, 旨在帮助更好更简单的使用照相机

最低支持的 API 等级是 API 21(5.0)

开发环境

我当前的开发环境是

MacOS 10.13.6
Android Studio 3.4 小米 8 MIUI 10.3 稳定版 10.3.2.0(android 9.0)

最低支持官方说明为 AndroidStudio 3.3 API 21+的设备

编码准备

新建项目

修改这两项

最低 21, 使用 androidX

添加依赖

在 app 级别的 build.gradle 中添加如下依赖

这个版本当前还是 alpha 版本,后续可能会升级为正式版, 可以查看 mvn 仓库中的版本号

1dependencies {
2    def camerax_version = "1.0.0-alpha01"
3    implementation "androidx.camera:camera-core:${camerax_version}"
4    implementation "androidx.camera:camera-camera2:${camerax_version}"
5}

尝试运行项目

运行项目,我这里可以成功跑起来,说明依赖添加是成功的

Flutter Web 评测第二篇

Mon, 13 May 2019 14:15:07 +0800

本篇只是上篇的补充

介绍一些当前的 flutter_web 版和 flutter 的移动版的差别

dart:io 包无法使用造成的影响

dart:io是一个在 flutter 中常用的包,但是在 web 版中是使用不了的

dio 不能用

dio包用不了,因为 dio 包是依托于 dart:io 包中的 HttpClient 进行的封装

并且因为国内很多初学者朋友人云亦云的选择了 dio 作为 http 的请求框架,所以今后如果有打算想要做 flutter_web 版的朋友可能现在就要考虑一下 dio 的使用问题了

当然 dio 包今后也可以迁移底层访问库为 http ,再进行二次封装形成 dio_with_http 那就是另一个故事了

另外 web 中的 http 请求可以使用 dart:html 中的 HttpRequest

使用 http 库的访问如下:

 1import 'package:http/http.dart' as http;
 2Widget fromHttp() {
 3    return FutureBuilder<http.Response>(
 4      future: http.get("https://api.github.com/"),
 5      builder: (BuildContext context, snapshot) {
 6        if (!snapshot.hasData) {
 7          return Container();
 8        }
 9        var body = snapshot.data.body;
10        return Text(body);
11      },
12    );
13  }

以上的代码反馈回来是这样的

dart 2.3的新东西

Thu, 09 May 2019 16:04:45 +0800

在最近两天 dart 更新到了 2.3 的稳定版

增加了一些语法糖,对于开发 flutter 来说会更加的友好

可以查看 medium

当然,本篇不是翻译,只是对于新语法做一个简单的尝试

...语法

这个语法很眼熟,在 js 中有类似的语法,其他语言可能也有

什么意思呢

看下面的代码

 1main(List<String> arguments) {
 2  list3Point();
 3}
 4
 5void list3Point() {
 6  var list1 = <int>[1, 2, 3, 4];
 7
 8  var list2 = <int>[
 9    0,
10    ...list1,
11    6,
12  ];
13
14  print(list2); // [0, 1, 2, 3, 4, 6]
15}

这里可能会提示需要更新 sdk 约束,可能这个特性是 2.2.2 加入的,更新约束后 yaml 文件被修改

1environment:
2  sdk: '>=2.2.2 <3.0.0'

旧版本的实现需要以下几个步骤

1void list3PointOld() {
2  var list1 = <int>[1, 2, 3, 4];
3  var list2 = <int>[0];
4  list2.addAll(list1);
5  list2.add(6);
6}

个人觉得代码量不是关键,而是更加直观的看到 list 的顺序

在 flutter 则是这样的:

Flutter Web 评测第一篇

Wed, 08 May 2019 10:15:07 +0800

最近 2019 的 google io 大会开始了,之前的"蜂鸟"引擎也在 flutter 官网中出现了, 不过这次改了个名字叫 flutter-web

具体的使用步骤参考项目 readme 中的方式来使用

构建项目

建议: 配置dart,pub,~/.pub-cache/bin到环境变量

配置 webdev

1git clone https://github.com/flutter/flutter_web.git
2cd flutter_web/examples/hello_world/
3flutter packages upgrade
4flutter packages pub global activate webdev

运行项目

简单运行

运行

1webdev serve

提示我们,在本地 8080 端口, 在浏览器打开 http://localhost:8080

默认的 main.dart 比较简单,只有一个 Text 控件

flutter toast插件 OKToast的介绍

Thu, 18 Apr 2019 09:12:48 +0800

OKToast 是一款在 flutter 上使用的 toast 插件

使用简单, 可定制性强, 纯 flutter, 调用不用 context

安装

查看文档: https://pub.dartlang.org/packages/oktoast#-installing-tab-

在 pubspec 引入

1dependencies:
2  oktoast: ^2.2.0 # 这一步请查询pub的最新版本

获取包: $ flutter packages get

引入: import 'package:oktoast/oktoast.dart';

使用

在代码中定义 OKToast 组件

包裹你的 MaterialApp,不是包裹你的 Scaffold
包裹你的 MaterialApp,不是包裹你的 Scaffold
包裹你的 MaterialApp,不是包裹你的 Scaffold

Flutter 版本更新内容查看

Wed, 10 Apr 2019 13:47:25 +0800

分支

与很多项目不同, flutter 使用 master 作为开发分支而不是发布分支

flutter 有几个主要的 branch:

master: 主分支,开发分支
dev: 发布第二快的分支, 每次的版本更新会优先发布到这个频道来, 主要给 flutter 尝鲜开发者使用
beta: 测试分支, 这个分支更新相对缓慢
stable: 可以在生产环境使用的, 相对问题最少,发布次数最少

对比

flutter 更新速度很快,几乎每天都有 commit, 间隔几天就会有一个新版本释出

flutter 以 v 开头,数字部分使用标准的三段版本号 vx.x.x

那么如果我目前是 v1.4.10 但是我想看看新版本相对我使用中的版本都更新了什么东西怎么办?

现在 dev 分支最新版是 v1.4.14,那么我可以通过

可以通过类似下面的连接把版本号替换为你需要对比的即可,前小后大,然后在浏览器中打开即可
https://github.com/flutter/flutter/compare/v1.4.10...v1.4.14

这其中有 53 次提交,后面有对应的提交记录日志,这个顺序是由早到晚

源码的话,则点击 Files Changes,就可以看到修改内容

点击下路蓝框的位置可以切换视图模式,列表还是详情

然后左边绿色是添加的内容,红色是删除的内容,白色是不变的内容,蓝色是折叠起来的不变内容

rss 订阅

github 的 release 支持 rss 订阅

https://github.com/flutter/flutter/releases.atom

我使用了这个 Chrome 插件来订阅 flutter sdk 的更新

Flutter flutter.gradle分析

Mon, 01 Apr 2019 11:43:50 +0800

所有的分析基于当前的 1.4.7 版本,flutter sdk 的版本更新可能会修改这个文件

1Flutter 1.4.7 • channel dev • https://github.com/flutter/flutter.git
2Framework • revision 1bfa2f2311 (3 days ago) • 2019-03-29 10:05:18 -0700
3Engine • revision c4d14a0071
4Tools • Dart 2.2.1 (build 2.2.1-dev.2.0 None)

这个文件是 sdk 中的 android 部分的配置文件文件,简单分析一下流程,以便于魔改或在项目中可以配置项目

gradle 使用的是 groovy 的语法,是一个 jvm 语言,在语法层级上兼容 Java 语法

换句话说 System.out.println("hello world"); 这样的方法是可用的

分析 flutter 项目

项目 android/app/build.gradle 文件中都有定义

 1def localProperties = new Properties()
 2def localPropertiesFile = rootProject.file('local.properties')
 3if (localPropertiesFile.exists()) {
 4    localPropertiesFile.withReader('UTF-8') { reader ->
 5        localProperties.load(reader)
 6    }
 7}
 8
 9def flutterRoot = localProperties.getProperty('flutter.sdk')
10if (flutterRoot == null) {
11    throw new GradleException("Flutter SDK not found. Define location with flutter.sdk in the local.properties file.")
12}
13
14def flutterVersionCode = localProperties.getProperty('flutter.versionCode')
15if (flutterVersionCode == null) {
16    flutterVersionCode = '1'
17}
18
19def flutterVersionName = localProperties.getProperty('flutter.versionName')
20if (flutterVersionName == null) {
21    flutterVersionName = '1.0'
22}
23
24apply plugin: 'com.android.application'
25apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle" // 这句代表了引入flutter.gradle到项目中,路径是

build.gradle 是 gradle 项目的主文件,关于 gradle 和相关说明可以自行搜索,这个体系很庞大,展开介绍不太现实

Flutter dialog (2) - showGeneralDialog的使用

Fri, 29 Mar 2019 10:50:38 +0800

上篇文章说了 showDialog 方法的使用

但是这个方法有很多东西是固定的

比如背景颜色,转换的时长和样式等等,很多东西你很难去自定义

本篇我使用另一个方法showGeneralDialog来做一些自定义

准备工作

同上一章一样,定义一个通用方法

 1Widget buildButton(
 2  String text,
 3  Function onPressed, {
 4  Color color = Colors.white,
 5}) {
 6  return FlatButton(
 7    color: color,
 8    child: Text(text),
 9    onPressed: onPressed,
10  );
11}

简单使用

这里有几个参数,虽然方法签名上只有 2 个@required注解的参数

但事实上,在我当前的版本环境下,如下代码中所有的参数都是必填项,不填会报错我的运行环境是这样的

1flutter --version
2Flutter 1.3.14 • channel dev • https://github.com/flutter/flutter.git
3Framework • revision 8e7e435706 (6 days ago) • 2019-03-21 15:31:46 -0700
4Engine • revision d4d4883216
5Tools • Dart 2.2.1 (build 2.2.1-dev.2.0 None)

代码在这里

 1showGeneralDialog(
 2    context: context,
 3    barrierLabel: "你好",
 4    barrierDismissible: true,
 5    transitionDuration: Duration(milliseconds: 300),
 6    pageBuilder: (BuildContext context, Animation animation,
 7        Animation secondaryAnimation) {
 8      return Center(
 9        child: Material(
10          child: Container(
11            color: Colors.black.withOpacity(animation.value),
12            child: Text("我是一个可变的"),
13          ),
14        ),
15      );
16    },
17  );
18};

Flutter dialog (1) - showDialog的讲解

Wed, 27 Mar 2019 10:50:38 +0800

在应用开发中,或多或少都会遇到需要弹框的问题, 比如:需要用户确认,需要输入一些信息等等的问题,这就要用到 dialog 相关的概念了

而在 flutter 中,所有可以看见的都是 Widget,dialog 也不例外

不过和 android 或 iOS 中不同的一点是,Flutter 中 dialog 不是一个单独的类,而是一个可以由你自定义的 Widget

写在前面

首先为了方便,我定义了一个简单的方法用于构建按钮

 1  Widget buildButton(
 2    String text,
 3    Function onPressed, {
 4    Color color = Colors.white,
 5  }) {
 6    return FlatButton(
 7      color: color,
 8      child: Text(text),
 9      onPressed: onPressed,
10    );
11  }

showDialog

dialog 的方法签名是这样的

其中 context 和 builder 是必传项

builder 需要返回一个 Widget,这个 Widget 会被作为 dialog 展示在页面上

比如我简单的写了一个这个方法

 1    showDialog(
 2      context: context,
 3      builder: (ctx) {
 4        return Center(
 5          child: Column(
 6            mainAxisSize: MainAxisSize.min,
 7            children: <Widget>[
 8              buildButton("返回1", () {}),
 9              buildButton("返回2", () {}),
10            ],
11          ),
12        );
13      },
14    );

当我调用这个方法时,会得到这样的样式

flutter取消动态字体大小

Tue, 12 Mar 2019 15:18:07 +0800

如果接触过原生开发的朋友可能知道

最初几年官方推荐使用 sp 作为字体大小的单位，但是事实上经过长时间实践的情况下，大家都开始逐渐使用 dp 作为单位

这样使用者调整系统字体大小，app 中的文字大小就不会受到影响，出现错误等情况

flutter 中修改

iOS 中叫动态字体大小,对应辅助功能中的字体大小

android 中叫字体大小

当你开发完成，又遇到用户修改系统字体大小导致某些地方错位，甚至按钮被挤出屏幕看不见了就是个问题了

而 flutter 中没有单位的概念，我们应该如何实现这个功能呢

在 flutter 中，是由 MediaQuery 来实现对应功能的

1var data = MediaQuery.of(context);
2data.textScaleFactor; //这个就是对应的动态字体大小，我们只需要『修改』这个值就可以了

修改自然是不可能的，这东西都是 final 的，我们要做的就是 flutter 中的通用做法

 1class NoScaleTextWidget extends StatelessWidget {
 2  final Widget child;
 3
 4  const NoScaleTextWidget({
 5    Key key,
 6    @required this.child,
 7  }) : super(key: key);
 8
 9  @override
10  Widget build(BuildContext context) {
11    return MaxScaleTextWidget(
12      max: 1.0,
13      child: child,
14    );
15  }
16}
17
18class MaxScaleTextWidget extends StatelessWidget {
19  final double max;
20  final Widget child;
21
22  const MaxScaleTextWidget({
23    Key key,
24    this.max = 1.2,
25    @required this.child,
26  }) : super(key: key);
27
28  @override
29  Widget build(BuildContext context) {
30    var data = MediaQuery.of(context);
31    var scale = math.min(max, data.textScaleFactor);
32    return MediaQuery(
33      data: data.copyWith(textScaleFactor: scale),
34      child: child,
35    );
36  }
37}

我这里的做法就是这样,创建一个组件，在内部修改这个值，然后把你的控件『包』起来

Migrating to AndroidX

Wed, 06 Mar 2019 10:26:03 +0800

无论在 android 开发中还是 flutter 开发中,都会面临迁移 AndroidX 的问题

官方有一个说明,可以参考链接

下面是我总结的修改方式

迁移到 androidX

修改 andorid 目录下的 app/build.gradle

1android{
2  compileSdkVersion 28
3}

使用了 gradle wrapper

如果 andorid 根目录下有这个文件夹/文件,则需要修改

根据官网说明,最好修改到 4.10.1 以上

gradle-wrapper.properties 文件

修改版本号位置,我使用的是当前的最新版 5.2.1,你可以根据你的情况修改

1distributionUrl=https\://services.gradle.org/distributions/gradle-5.2.1-all.zip

如果没有用这个,那么你需要修改的环境变量中的 gradle 版本,这个请自行百度/Google

修改 android 目录下的 build.gradle

根目录下的 build.gradle ,这个是目前的最新版

这个不是 gradle 的版本,你可以理解为与插件匹配,一般等于你的 android studio 的版本

1buildscript{
2  dependencies {
3    classpath 'com.android.tools.build:gradle:3.3.1'
4  }
5}

修改 android 目录下的 gradle.properties

如果没有,就添加这两行

1android.enableJetifier=true
2android.useAndroidX=true

最后

做完上面的应该就可以了,运行下项目,如果有别的问题欢迎留言

flutter log4d 日志包的使用

Mon, 04 Mar 2019 08:48:51 +0800

最近闲来无事,撸了一个日志插件,功能很简单

在开发机上开启一个服务端

然后客户端(不仅是 flutter,而是只要可以使用dart:io就可以)开启远程连接,然后就可以发送日志到服务端了

好处

这样的好处是,开发机可以实时接收到日志,并且保存到文件中

因为我们很多时候会发生日志超出一个长度(好像是 1000 个),然后在 console 中不能完整显示的问题,比如网络网文请求,如果响应的报文不完整就不能复制出完整的 json,有的错误不太好定位

使用这个插件后,就可以在开发机简单的通过命令保存日志,方便后续定位

只要你的客户端可以访问到服务端,这就能实现

开发过程

使用WebSocket连接,这个类在 dart 中依托于dart:io包,所以如果你是dart web,可能就用不了这个了,flutter和dart vm中是没问题的

这个库支持使用 pub global, 配置 dart 和 pub 到环境变量后可以直接通过log4d在命令行中开启

安装

1. 安装

参考 pub 上的 install 标签

pub global activate log4d

这一步完成后可以通过log4d,log4d_client 来使用插件

2.客户端安装

作为一个库来使用, 首先在 pubspec.yaml 中加入依赖

1dependencies:
2  log4d: ^1.0.3 # 这一步参考最新版

3.获取库

pub get 或 flutter packages get

4. 导入

import 'package:log4d/log4d.dart';

使用

简单的使用方式就是服务端在命令行中开启

1. 开启服务端

log4d -o build/test.log 这样就成功开启了,并且会在接受到日志后将日志保存到指定的目录下

Pub Global 创建命令行应用程序

Mon, 25 Feb 2019 13:53:52 +0800

前言

如果你接触过npm/yarn 应该知道,有一些包可以全局使用,就是安装后可以直接用,比如vue-cli这样的应用,应该是用node开发的

在dart中也可以实现类似的功能, 使用 pub global 就可以了,在连接中有完整的说明也有 stagehand 这样的应用程序可以直接使用

我在这里简单的实战一下,实现一个简单的cli应用程序

这个程序没什么多余的功能,就简单的实现输入敲击unix获取时间戳

建立工程前的准备

将dart,pub加入PATH环境变量

需要在环境变量中添加几个东西,添加环境变量的方式自己搜索一下

一个是dart/bin的目录,你需要在命令行中让dart命令可用

1➜  ~ dart --version
2Dart VM version: 2.1.0 (Tue Nov 13 18:22:02 2018 +0100) on "macos_x64"

相对应的dart/bin目录下还会有其他的一些工具,包含了pub,这个工具也是会用到的

1➜  bin pub --version
2Pub 2.1.0

安装dart工程脚手架

pub连接

$ pub global activate stagehand

将pub-cache/bin目录加入PATH环境变量

这个目录通常是~/.pub-cache/bin目录

验证`stagehand`可用

 1➜  bin stagehand
 2Stagehand will generate the given application type into the current directory.
 3
 4usage: stagehand <generator-name>
 5    --[no-]analytics    Opt out of anonymous usage and crash reporting.
 6-h, --help              Help!
 7    --version           Display the version for stagehand.
 8    --author            The author name to use for file headers.
 9                        (defaults to "<your name>")
10
11Available generators:
12  console-full   - A command-line application sample.
13  package-simple - A starting point for Dart libraries or applications.
14  server-shelf   - A web server built using the shelf package.
15  web-angular    - A web app with material design components.
16  web-simple     - A web app that uses only core Dart libraries.
17  web-stagexl    - A starting point for 2D animation and games.

建立工程

这一步默认你所有的环境变量都配置完毕,dart pub stagehand 都可用

flutter 新状态管理方案 Provide 使用

Thu, 21 Feb 2019 10:43:36 +0800

开这篇文章是因为看到这个库被托管在google的仓库下,而且说明是被设计出来替代ScopedModel的,而且更加灵活

支持Builder模式和StreamBuilder模式,全局,局部都可以

内部应该是结合InheritedWidget Notification体系实现的

传统的bloc需要在每一个Repository中创建StreamController和Stream,甚至有的文章中,一个监听的修改需要修改5处,维护起来比较麻烦

相比较而言Provide维护起来会稍微省事一些

入门级仓库地址

添加依赖

查看 pub-install

1dependencies:
2  provide: ^1.0.1 # 这里的版本查看官方

1flutter packages get

1import 'package:provide/provide.dart';

使用方法

这里以简单的Counter为例也就是在flutter的hello world工程的基础上来修改

1. 定义一个Model

这个model需要继承ChangeNotifier

 1
 2class Counter with ChangeNotifier {
 3  int _value;
 4
 5  int get value => _value;
 6
 7  Counter(this._value);
 8
 9  void inc() {
10    _value++;
11    notifyListeners(); //父类的方法,发出通知
12  }
13}

2. 定义一个全局的Provide

这里虽然定义在全局,但事实上也可以定义在页面级

 1void main() {
 2  var providers = Providers()..provide(Provider.function((ctx) => Counter(0)));
 3
 4  runApp(
 5    ProviderNode(
 6      child: MyApp(),
 7      providers: providers,
 8    ),
 9  );
10}

ProviderNode表示的是提供者

Flutter ios 插件开发 appcode 加快索引速度

Tue, 19 Feb 2019 15:41:23 +0800

ios 插件开发可以查看之前的文章本篇就不详细介绍了

众所周知 xcode 这编辑器除了漂亮,其实开发效率来说和 appcode 无法相提并论..

本篇与插件开发本身无关,目的只是为了加快 appcode 的索引速度,解决方案拉到后面查看

使用 appcode 开发插件本身很简单,打开插件下的example/ios就可以了,不过这里有一个坑,因为 flutter 使用 link 的方式,可能有数级的../..之类的连接来指向插件文件夹

这个在 xcode 中可能没问题,但是appcode中有一个索引的概念,这一步会遍历当前关联的所有同级文件, 参考连接

而这一步由于相对的关系甚至关联到了~这一级,也就是说会遍历当前用户全部的文件,这一步的速度太慢了,我们必须着手解决

解决

打开example/ios/Podfile文件

这个文件是cocoapod的配置文件,使用的是Ruby语言,

这个文件一般是自动生成的,我们开发过程中正常情况下不需要关注这个文件

我们需要修改这个文件,查看官方配置说明

我们不使用 symlinks 的方案,而是采用另一种方案,直接用 path 的方式

将这个 Podfile 文件改为这样

1  plugin_pods.map { |p|
2    name = p[:name]
3    path = p[:path]
4    specPath = "#{path}/ios/#{name}.podspec"
5    pod p[:name],:path=>specPath
6  }

然后在命令行运行

1cd example/ios
2pod install

修改完成后是用 app 打开是这样的

1.12.x 版本 [2020-01-17 更新]

某个版本后, 会提示我们原来的 pod 版本过时了

这时候, 我们需要移除 example/ios 下的 Podfile 和 Podfile.lock 文件

dart中的生成器函数

Sun, 03 Feb 2019 17:19:23 +0800

2019 年春节前最后一更了

在 dart 中有生成器函数的语法,在很多其他的语言中也有,比如 js c#

这个语法看上去和 async await 语法很像

使用的关键字是 async* sync* yield yield*

官方对于这个语法的说明可以参考这个连接 generators

其实async await也是一种生成器语法

生成器语法就是你返回的类型通常情况下和 return 的类型可能不一致

比如你return 1,但是返回值上却需要写Future<int>

sync*

在 dart 中可以使用这个便利的生成一个迭代器

如下所示

这两种写法是一样的,但是第一个写法会简洁很多

 1main(List<String> arguments) {
 2  print(genList());
 3  print(genList2());
 4}
 5
 6Iterable<int> genList({int max = 10}) sync* {
 7  var i = 0;
 8  while (i < max) {
 9    yield i;
10    i++;
11  }
12}
13
14Iterable<int> genList2({int max = 10}) {
15  var list = <int>[];
16  var i = 0;
17  while (i < max) {
18    list.add(i);
19    i++;
20  }
21  return list.map((i) => i);
22}

async*

这个返回值是一个 Stream

 1main(List<String> arguments) {
 2  print(genList());
 3  print(genList2());
 4
 5  genStream().listen((data) {
 6    print("stream1 : $data");
 7  });
 8
 9  genStream2().listen((data) {
10    print("stream2 : $data");
11  });
12}
13
14
15Stream<int> genStream({int max = 10}) async* {
16  int i = 0;
17  while (i < max) {
18    yield i;
19    await Future.delayed(Duration(milliseconds: 300));
20    i++;
21  }
22}
23
24Stream<int> genStream2({int max = 10}) {
25  StreamController<int> controller = StreamController();
26
27  Future<void>.delayed(Duration.zero).then((_) async {
28    int i = 0;
29    while (i < max) {
30      controller.add(i);
31      await Future.delayed(Duration(milliseconds: 300));
32      i++;
33    }
34    controller.close();
35  });
36
37  return controller.stream;
38}

两种写法达到了一样的效果,但是生成器函数代码会更加简洁一些

创建 dart flutter 的 doc文档并部署

Thu, 31 Jan 2019 08:50:34 +0800

https://docs.flutter.io/ 是 flutter 的 api 文档页

但是这个文档页有的时候不那么好访问, 也许你有自己的页面,或者你就是想简单的搭建一个 pages 到 gitee/github 上方便你以后的访问

本篇就来教你怎么简单的达成这个目的

gitee 部署完成后是这样的 https://kikt.gitee.io/flutter-doc/

准备工作

一个终端工具
dart sdk
一个 web 服务器(pages)

作为一个 flutter/dart 开发者,sdk 肯定是必备工具了

如果你运行过 flutter doctor 命令,则 flutter 自带的 sdk 就会存在在的系统内 ${FLUTTER_HOME}/bin/cache/dart-sdk 这里替换为自己的 flutter sdk 的文件夹

这里可以看见 dartdoc 这个就是创建文档的工具了

先进入 sdk 下的 packages/flutter 文件夹

然后运行$FLUTTER_HOME/bin/cache/dart-sdk/bin/dartdoc .命令 $FLUTTER_HOME 为你的 flutter sdk 所在目录

等待一段时间

然后可以看到当前文件夹下生成了一个doc目录,里面就是所有的文档了

部署

直接双击 index.html 也可以打开,但是根据官方的说法,如果本地运行可能右上角的搜索不能使用,这就需要部署到服务器上了

如果你有自己的云服务器,那么你估计对于部署应该有自己的理解,就不用继续看了

本地部署

所以我们需要使用一些本地服务来部署

比如 nginx/caddy/tomcat/apache 之类的服务器

flutter pub 发布失败

Tue, 29 Jan 2019 15:44:30 +0800

之前的很多技术文章太严肃了,本篇写一篇插件发布的文章

什么是 pub

偶尔会经常听人说发布包到 pub 了,那什么是 pub 呢

官方描述: Pub is the package manager for Dart. / dart 语言的包管理器

官网

pub 的官方 url: https://pub.dartlang.org/

这个域名有多个小伙伴同时 ping 过, 对应 ip 不相同,所以可知这个网站是有负载均衡的, 但是坑的地方来了, 部分在墙外,所以这就是这个网站偶尔国内访问不通畅的原因

然后有几个国内镜像站点,可以查看官网介绍 Using Flutter in China

flutter-io 上海交大

设置访问镜像

在环境变量中配置,这个根据系统不同设置方法不同

mac 的话可以使用 export 命令临时添加

也可以在vi ~/.bash_profile,在这个文件中添加

其他系统的设置方式请自行查找

1PUB_HOSTED_URL=https://pub.flutter-io.cn
2FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

这样在国内就很快了

如果你需要发布插件的话,到这里就结束了

发布

有的时候我们自己写了开源库,想要发布到 pub 上怎么办呢

dart/flutter 对于插件没有审核的概念,而且发布很简单,你可以任意发布插件到 pub 上,只要不重复就可以了

必备前提

一份代码
一份命令行翻墙工具
一个 google 账号

代码是必须的,不然没意义

命令行翻墙工具是因为国内镜像发布不了,必须要连接到 pub 的官方源

使用python爬取一个省市城市列表

Fri, 25 Jan 2019 13:46:47 +0800

前言

最近打算使用 flutter 做一个省市的级联列表 ,但是目前没有数据来源,就想着搜搜有没有 json 的数据,结果搜了一下只有各种数据库的

然后搜了下有个网站说有很完整的数据的还是收费的

作为一个穷人程序员,如果是公司用,我付费买一个也无所谓,但是本身是想私人使用,甚至开源出去,付费就没必要了

这时候我想着,既然如此,我就爬一份数据,自己造一个吧

说到爬虫,我们就想起了~~明年..两开花~~ python

开发环境

使用的语言是 python3

request_html+基本库

爬取网页

国家统计局-2017 年统计用区划代码和城乡划分代码(截止 2017 年 10 月 31 日)

查看网页

一级页面

使用 chrome dev 工具查看元素

呃. table 体系,最近几年算是比较少见了

分析了一下,整个页面只有备案号和省份名称是 a 标签,这下过滤一下备案号,剩下的不就是我们要的数据了吗

二级页面

点开北京,数据比较少,只有市辖区

内蒙的就比较多一点了

纯数字的是编码,其他的是名称,也是过滤掉 IPC 备案的就好

三级页面

和二级页面基本一致

撸码

city_get.py

  1import json
  2from requests_html import HTMLSession
  3import requests_html
  4
  5session = HTMLSession()
  6
  7
  8class Entity:
  9    name: str
 10    link: str
 11    no: str
 12    baseUrl = "http://www.stats.gov.cn/tjsj/tjbz/tjyqhdmhcxhfdm/2017/"
 13
 14    def __str__(self) -> str:
 15        return "name:%s,link=%s" % (self.name, self.link)
 16
 17    def __eq__(self, o: object) -> bool:
 18        return self.link == o.link
 19
 20    def to_json(self) -> str:
 21        pass
 22
 23
 24class Province(Entity):
 25
 26    def __init__(self) -> None:
 27        super().__init__()
 28        self.cityList = []
 29
 30    def __str__(self) -> str:
 31        return "name:%s,link=%s" % (self.name, self.link)
 32
 33    def fetch_city_list(self):
 34        url = "%s%s" % (Entity.baseUrl, self.link)
 35        r = session.get(url)
 36        r.encoding = "gbk"
 37        h: requests_html.HTML = r.html
 38        li: list[requests_html.Element] = h.find("a")
 39        for a in li:
 40            text = a.text
 41            if text.__contains__("京ICP"):
 42                continue
 43            href_ = a.attrs["href"]
 44            city = City()
 45            city.link = href_
 46            city.province = self
 47            # print(text, href_)
 48
 49            try:
 50                index = self.cityList.index(city)
 51                city = self.cityList[index]
 52            except ValueError:
 53                self.cityList.append(city)
 54
 55            if text.isnumeric():
 56                city.no = text
 57            else:
 58                city.name = text
 59
 60        for city in self.cityList:
 61            city.fetch_county_list()
 62
 63    def to_json(self) -> str:
 64        pass
 65
 66
 67class City(Entity):
 68    province: Province
 69
 70    def __init__(self) -> None:
 71        super().__init__()
 72        self.countyList = []
 73
 74    def fetch_county_list(self):
 75        print("%s 开始" % self.name)
 76        url = "%s%s" % (Entity.baseUrl, self.link)
 77        r = session.get(url)
 78        r.encoding = "gbk"
 79        h: requests_html.HTML = r.html
 80        li: list[requests_html.Element] = h.find("a")
 81        for a in li:
 82            text = a.text
 83            if text.__contains__("京ICP"):
 84                continue
 85            href_ = a.attrs["href"]
 86            county = County()
 87            county.link = href_
 88            county.province = self
 89            # print(text, href_)
 90
 91            try:
 92                index = self.countyList.index(county)
 93                county = self.countyList[index]
 94            except ValueError:
 95                self.countyList.append(county)
 96
 97            if text.isnumeric():
 98                county.no = text
 99            else:
100                county.name = text
101
102        for county in self.countyList:
103            # print(county.__str__())
104            pass
105
106        print("%s 结束" % self.name)
107
108    pass
109
110
111class County(Entity):
112    city: City
113    pass
114
115
116provinceList = []
117
118
119def fetch_province_list():
120    response = session.get("http://www.stats.gov.cn/tjsj/tjbz/tjyqhdmhcxhfdm/2017/index.html")
121    response.encoding = "gbk"
122    html: requests_html.HTML = response.html
123    # s = response.content.decode("gbk")
124    l: list = html.find("a")
125    for a in l:
126        ae: requests_html.Element = a
127        href: str = ae.attrs.get("href")
128        if href.endswith("html"):
129            province = Province()
130            province.name = ae.text.lstrip()
131            province.link = href.lstrip()
132            provinceList.append(province)
133
134
135fetch_province_list()
136
137if __name__ == '__main__':
138    for p in provinceList:
139        if p.name == "黑龙江省":
140            p.fetch_city_list()
141# session.close()

dump_data.py

在Profile下分析android内存占用

Tue, 22 Jan 2019 10:24:16 +0800

最近做了一篇 android 原生中加入 flutter 的尝试,顺便查看下内存占用
在 debug 模式下肯定是不准的,所以随便看看就好了,只是为了满足好奇心,不代表真实项目中的真实表现,也不代表我的观点
在原生刚刚打开后稳定的情况下查看内存占用

可以看到打开 Flutter 后内存会有明显上升

红点处是我点击了按钮后的情况,会有内存抖动

关闭 Flutter 界面后会发现内存回落很明显,说明内存相对比较稳定

过了段时间,其实是我在码字+上传图片,没看手机,发现内存更加平稳了,而且降低到了只有 30m

换句话说其实在 android 上内存的表现还算可以,目测在关闭 flutterview 的界面后简单的界面是可以完全回收的,而且众所周知 release 蜜汁流畅 :-D

本篇是随便写写的,不代表 flutter 在实际项目中的表现,因为实际项目原生,flutter 中都会有更复杂的机制,所以内存 cpu 的消耗会更大, 也可能会发生不可预知的情况

在原 Android 工程的基础上构建一个flutter工程

Tue, 22 Jan 2019 07:50:31 +0800

在 flutter 开发的过程中不可能所有项目都是从零构建

换句话说不是所有项目都是 flutter 为主工程,然后 android/ios 的工程为副工程

大概率会遇到需要将 flutter 作为组件加入到原生项目中, 这种例子典型的就是阿里闲鱼,当然闲鱼团队的实力不是普通的小公司可以比的

所幸的是,flutter 团队提供了一个 wiki 用于帮助我们完成这个过程

创建一个 Android 工程

使用 Android Studio 创建一个新工程来模拟这个过程,会看这里的普遍都应该是 android 程序员出身,Hello World 工程是肯定会的,不会的话还是回炉加强一下吧

如果你已经有现有工程,肯定是有 VCS 管理的,放心大胆的走出第一步,大不了就删除当前分支嘛,然后你可以跳过这一步,直接看 flutter 的过程

创建 Flutter

这一步仅作为官方 wiki Android 部分的参考

我目前使用的是 1.0.0 的发布版

1Flutter 1.0.0 • channel dev • https://github.com/flutter/flutter.git
2Framework • revision 5391447fae (11 days ago) • 2018-11-29 19:41:26 -0800
3Engine • revision 7375a0f414
4Tools • Dart 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)

wiki 后续可能会被修改,请查看最新的文档去解决

android 引入ffmpeg

Mon, 14 Jan 2019 17:14:00 +0800

上篇介绍了如何在 mac 系统下打包 ffmpeg 的 so

这篇介绍如何引入 so 到项目中

开发环境:

1macos
2android studio 3.2.1
3ndk: 15.2.4203891

新建一个工程

新建工程时,勾选 c++支持

将文件复制到项目内

需要复制的文件

.h 头文件
so文件

在 cpp 中新建一个文件夹include/ffmpeg 把 include 中的文件夹复制到 ffmpeg 下

在 main 下新建文件夹jniLibs,把 so 文件复制到其中

修改 CMakeList

完整的CMakeList.txt 如下

  1# For more information about using CMake with Android Studio, read the
  2# documentation: https://d.android.com/studio/projects/add-native-code.html
  3
  4# Sets the minimum version of CMake required to build the native library.
  5
  6cmake_minimum_required(VERSION 3.4.1)
  7
  8# Creates and names a library, sets it as either STATIC
  9# or SHARED, and provides the relative paths to its source code.
 10# You can define multiple libraries, and CMake builds them for you.
 11# Gradle automatically packages shared libraries with your APK.
 12
 13#
 14#
 15set(distribution_DIR ${CMAKE_SOURCE_DIR}/src/main/jniLibs)
 16
 17#
 18
 19
 20#set(FFDIR /Users/cai/code/c/ffmpeg-3.3.6/android/arm/lib)
 21
 22include_directories(
 23        src/main/cpp/include/ffmpeg
 24)
 25
 26# ffmpeg 的library
 27add_library(
 28        avcodec
 29        SHARED
 30        IMPORTED
 31)
 32set_target_properties(
 33        avcodec
 34        PROPERTIES IMPORTED_LOCATION
 35        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libavcodec-57.so
 36)
 37
 38add_library(
 39        avdevice
 40        SHARED
 41        IMPORTED
 42)
 43set_target_properties(
 44        avdevice
 45        PROPERTIES IMPORTED_LOCATION
 46        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libavdevice-57.so
 47)
 48
 49add_library(
 50        avfilter
 51        SHARED
 52        IMPORTED
 53)
 54set_target_properties(
 55        avfilter
 56        PROPERTIES IMPORTED_LOCATION
 57        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libavfilter-6.so
 58)
 59
 60add_library(
 61        avformat
 62        SHARED
 63        IMPORTED
 64)
 65set_target_properties(
 66        avformat
 67        PROPERTIES IMPORTED_LOCATION
 68        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libavformat-57.so
 69)
 70
 71add_library(
 72        avutil
 73        SHARED
 74        IMPORTED
 75)
 76set_target_properties(
 77        avutil
 78        PROPERTIES IMPORTED_LOCATION
 79        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libavutil-55.so
 80)
 81
 82
 83add_library(
 84        swresample
 85        SHARED
 86        IMPORTED
 87)
 88set_target_properties(
 89        swresample
 90        PROPERTIES IMPORTED_LOCATION
 91        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libswresample-2.so
 92)
 93
 94add_library(
 95        swscale
 96        SHARED
 97        IMPORTED
 98)
 99set_target_properties(
100        swscale
101        PROPERTIES IMPORTED_LOCATION
102        ${CMAKE_SOURCE_DIR}/src/main/jniLibs/${ANDROID_ABI}/libswscale-4.so
103)
104
105# ffmpeg 的library end
106
107# Searches for a specified prebuilt library and stores the path as a
108# variable. Because CMake includes system libraries in the search path by
109# default, you only need to specify the name of the public NDK library
110# you want to add. CMake verifies that the library exists before
111# completing its build.
112
113find_library( # Sets the name of the path variable.
114        log-lib
115
116        # Specifies the name of the NDK library that
117        # you want CMake to locate.
118        log)
119
120add_library( # Sets the name of the library.
121        native-lib
122
123        # Sets the library as a shared library.
124        SHARED
125
126        # Provides a relative path to your source file(s).
127        src/main/cpp/native-lib.cpp
128        )
129
130# Specifies libraries CMake should link to your target library. You
131# can link multiple libraries, such as libraries you define in this
132# build script, prebuilt third-party libraries, or system libraries.
133
134target_link_libraries( # Specifies the target library.
135        native-lib
136
137        # ffmpeg 相关库
138        avcodec
139        avdevice
140        avfilter
141        avformat
142        avutil
143        swresample
144        swscale
145        #
146
147        # Links the target library to the log library
148        # included in the NDK.
149        ${log-lib})

简单解释下:

ndk编译ffmpeg

Mon, 14 Jan 2019 14:45:55 +0800

最近在努力学习音视频相关东西,以备未来不时之需

在音视频处理领域有一个绕不过去的著名项目就是FFmpeg,这个项目基于 GPL 开源协议, 官网

最新版本目前我在 mac 上无法编译,会报错

使用的总体环境如下:

1Macos: 10.13.6 (17G65)
2ffmpeg: 3.3.6
3ndk: 15.2.4203891

引用外部源码(尝试失败)

初次尝试的时候,希望可以通过 CMakeLists 中配置头文件和库的方式,直接引用,发现可能需要拷贝所有源代码到项目中,但这样需要 copy 的东西很多,对于真实的项目来说也许可行,但 demo 项目就太复杂了,而且不方便今后的使用

交叉编译 so

这里有一个坑,就是 ndk 版本不能太低,因为之前使用过 ijkplayer,那个项目要求 11d 还是 11e 的 ndk 版本,我这次想直接用这个 ndk 版本,过程中会报很多错误,具体原因没有深究

然后使用我 android sdk 中带的 ndk 版本果断成功

这个是我的 ndk 版本,截至当前最新版本应该是 18.X

版本号在 ndk 中查看 propertis 文件可以看见

另一个叫法是 android-ndk-r15c

1Pkg.Desc = Android NDK
2Pkg.Revision = 15.2.4203891

ffmpeg 版本:我开始是下载的最新版本 4.1 版 ,结果编译不通过,在 udp.c 中报错了,通过网络搜索到一个原因,ffmpeg 版本太高了

通过下载了一个 ffmpeg-3.3.6 解决

另外,亲测最新的 NDKr18 并不能编译 3.3.6 会报一个

flutter cupertino 复制粘贴弹窗报错的问题

Tue, 08 Jan 2019 17:34:10 +0800

1NosuchMethodError: The getter 'pasterButtonLabel' was called on null.
2Receiver: null
3Tried calling: pasteButtonLabel

在最近 app store 提交审核时被拒了,然后得到了一个这样的截图

在 flutter 中可能会会出现各种问题,因为之前遇到过这个问题,但是那是我另一个应用,这个忘了设置了

我快速搞了一下,重新提交了审核

解决方式

  1import 'package:flutter/cupertino.dart';
  2import 'package:flutter/foundation.dart';
  3import 'package:flutter/material.dart';
  4import 'package:flutter_localizations/flutter_localizations.dart';
  5
  6class ChineseCupertinoLocalizations implements CupertinoLocalizations {
  7  final materialDelegate = GlobalMaterialLocalizations.delegate;
  8  final widgetsDelegate = GlobalWidgetsLocalizations.delegate;
  9  final local = const Locale('zh');
 10
 11  MaterialLocalizations ml;
 12
 13  Future init() async {
 14    ml = await materialDelegate.load(local);
 15    print(ml.pasteButtonLabel);
 16  }
 17
 18  @override
 19  String get alertDialogLabel => ml.alertDialogLabel;
 20
 21  @override
 22  String get anteMeridiemAbbreviation => ml.anteMeridiemAbbreviation;
 23
 24  @override
 25  String get copyButtonLabel => ml.copyButtonLabel;
 26
 27  @override
 28  String get cutButtonLabel => ml.cutButtonLabel;
 29
 30  @override
 31  DatePickerDateOrder get datePickerDateOrder => DatePickerDateOrder.mdy;
 32
 33  @override
 34  DatePickerDateTimeOrder get datePickerDateTimeOrder =>
 35      DatePickerDateTimeOrder.date_time_dayPeriod;
 36
 37  @override
 38  String datePickerDayOfMonth(int dayIndex) {
 39    return dayIndex.toString();
 40  }
 41
 42  @override
 43  String datePickerHour(int hour) {
 44    return hour.toString().padLeft(2, "0");
 45  }
 46
 47  @override
 48  String datePickerHourSemanticsLabel(int hour) {
 49    return "$hour" + "时";
 50  }
 51
 52  @override
 53  String datePickerMediumDate(DateTime date) {
 54    return ml.formatMediumDate(date);
 55  }
 56
 57  @override
 58  String datePickerMinute(int minute) {
 59    return minute.toString().padLeft(2, '0');
 60  }
 61
 62  @override
 63  String datePickerMinuteSemanticsLabel(int minute) {
 64    return "$minute" + "分";
 65  }
 66
 67  @override
 68  String datePickerMonth(int monthIndex) {
 69    return "$monthIndex";
 70  }
 71
 72  @override
 73  String datePickerYear(int yearIndex) {
 74    return yearIndex.toString();
 75  }
 76
 77  @override
 78  String get pasteButtonLabel => ml.pasteButtonLabel;
 79
 80  @override
 81  String get postMeridiemAbbreviation => ml.postMeridiemAbbreviation;
 82
 83  @override
 84  String get selectAllButtonLabel => ml.selectAllButtonLabel;
 85
 86  @override
 87  String timerPickerHour(int hour) {
 88    return hour.toString().padLeft(2, "0");
 89  }
 90
 91  @override
 92  String timerPickerHourLabel(int hour) {
 93    return "$hour".toString().padLeft(2, "0") + "时";
 94  }
 95
 96  @override
 97  String timerPickerMinute(int minute) {
 98    return minute.toString().padLeft(2, "0");
 99  }
100
101  @override
102  String timerPickerMinuteLabel(int minute) {
103    return minute.toString().padLeft(2, "0") + "分";
104  }
105
106  @override
107  String timerPickerSecond(int second) {
108    return second.toString().padLeft(2, "0");
109  }
110
111  @override
112  String timerPickerSecondLabel(int second) {
113    return second.toString().padLeft(2, "0") + "秒";
114  }
115
116  static const LocalizationsDelegate<CupertinoLocalizations> delegate =
117      _ChineseDelegate();
118
119  static Future<CupertinoLocalizations> load(Locale locale) async {
120    var localizaltions = ChineseCupertinoLocalizations();
121    await localizaltions.init();
122    return SynchronousFuture<CupertinoLocalizations>(localizaltions);
123  }
124}
125
126class _ChineseDelegate extends LocalizationsDelegate<CupertinoLocalizations> {
127  const _ChineseDelegate();
128
129  @override
130  bool isSupported(Locale locale) {
131    return locale.languageCode == 'zh';
132  }
133
134  @override
135  Future<CupertinoLocalizations> load(Locale locale) {
136    return ChineseCupertinoLocalizations.load(locale);
137  }
138
139  @override
140  bool shouldReload(LocalizationsDelegate<CupertinoLocalizations> old) {
141    return false;
142  }
143}

这个东西弄到项目里

Finish FlutterActivity 源码解析

Tue, 08 Jan 2019 16:07:06 +0800

开篇声明:本篇文章不算是新手向的东西,你需要对于 flutter 和 android 本身有一定的了解

文章原因

为啥要写这个文章呢

最近有 qq 群的同学询问如何在关闭界面后在 service 中执行 dart 代码

我当时的理解就是 flutter 是依附于 activity 存在的,但是这部分并没有任何实际支撑

所以我抱着好奇的想法去跟了一下 engine 部分的源码

flutter engine 简单介绍

这里简单介绍一下 flutter engine,

在 android 系统上 flutter 是使用 FlutterView 实现的, 对应 github 源码 android 部分

对应的 java 层级的源码都在这里

一般一个纯 flutter 项目中是这样的, 有一个 FlutterApplication 一个 FlutterActivity 一个 FlutterView,而我们 flutter 所有的界面都是在 FlutterView 上画的

解析开始

以下基于你对于 android 原生开发有所涉猎,而不是完全不了的基础上展开

我们都知道,当 finish Activity 后页面会回调onDestroy方法

这个方法中会回调一个eventDelegate.onDestroy,我们查看以下这个东西具体是调用到哪里

能看到具体的调用是这样的

如果 Application 是 FlutterApplication 会直接将当前 Activity 置空

Flutter bottomSheet的使用

Mon, 07 Jan 2019 15:07:28 +0800

前言

最近看到群里有朋友在问类似于

这东西怎么实现

我回答的可能不那么清楚,因为我就答了 bottomSheet,下次我可能会回答的更清楚些

这东西在可能在 flutter 里有如下几种解释

Scaffold 的 bottomSheet 属性
一个叫 BottomSheet 的 widget 组件
Scaffold.showBottomSheet 方法
showBottomSheet 方法也就是一个底层弹窗

这里分别来简单的说一下

Scaffold 的 bottomSheet 属性

这个就是前言中的那种东西的简单实现方式,直接把聊天的输入框(TextField)放在里面,用 Container 也好,也用其他什么控件也可以,当然 Container => Row => [TextField,Button]就能实现图上的效果了

简单的页面代码如下

 1import 'package:flutter/material.dart';
 2
 3class BottomSheet1Page extends StatefulWidget {
 4  @override
 5  _BottomSheetPageState createState() => _BottomSheetPageState();
 6}
 7
 8class _BottomSheetPageState extends State<BottomSheet1Page> {
 9  @override
10  Widget build(BuildContext context) {
11    return Scaffold(
12      appBar: AppBar(
13        title: Text('bottom sheet'),
14      ),
15      body: ListView.builder(
16        itemBuilder: (BuildContext context, int index) {
17          return ListTile(
18            title: Text(index.toString()),
19            subtitle: Text("我是${index}的副标题"),
20          );
21        },
22        itemCount: 300,
23      ),
24      bottomSheet: Container(
25        child: Row(
26          children: <Widget>[
27            Expanded(child: TextField()),
28            RaisedButton(
29              child: Text('发送'),
30              onPressed: () {},
31            ),
32          ],
33        ),
34      ),
35    );
36  }
37}

效果如下

Caddy 初探

Sat, 05 Jan 2019 11:13:08 +0800

caddy 是使用 go 语言开发的一个 server 服务器

相对于 nginx 来说,这个部署更简单,配置起来也很简单,很适合搭私人站点使用,而且相比于 nginx 来说,这个只有单文件,很适合小白使用

而且,这东西最大的优点是,可以通过简单的配置来支持 https,而无需操心证书,另外还支持 http2 协议

这里有一份中文文档 ,请注意查收

入手

以 mac os 为例我只需要 brew install caddy 然后, 运行 caddy,这样就完成了最简单的部署过程...

当然这是因为有默认配置的关系,整个项目是单文件的,就只有一个 caddy 文件

其他系统的参考官网

运行结果如下

默认是 2015 端口,可能是代表这个项目是 2015 年创建/发布的?

然后打开 http://localhost:2015/ 就可以看到你的网页了,当然这里因为有默认的原因,你看到的也许是 404,或是其他的什么

自定义配置

caddy 支持命令行的一些简单配置和配置文件的复杂配置

命令行

使用caddy -h 可以看到最新最全的命令行参数列表

这里说命令行运行简单命令的意思并不是支持不全,而是有一些复杂的情况,如果用命令行来做调错比较麻烦

比如 -agree 同意 CA 的协议

-ca XXX 获取指定 host 的 ca 证书

一般情况下比较有用的就是

-conf string 使用配置文件

github 一些小技巧

Wed, 12 Dec 2018 15:21:47 +0800

最近沉迷 flutter,偶尔换换口味,看看 github

很多知名的开源项目落户于 github,那么为什么呢,人云亦云吗?

不一定, github 的工作流很强大.能够帮助我们更加清晰工作流程

https://help.github.com/categories/managing-your-work-on-github/

首先官方链接在此,英文好的直接去看

另外还有一个帮助你学习 github 的小机器人

https://lab.github.com/install

这个小机器人能帮你系统的了解一些 github 的工作流和 github 的一些基本功能

比如 github 仓库的元数据修改,关键字修改,github pages 的发布

工作流包括 issues 中的

PR 整体过程中分派工作/审核/修改意见/冲突处理/merge 代码的流程,强烈建议 github 用的不好的人先去梳理一下

issue 篇

常规的创建之类的就不说了,说一些你日常中看不到的东西,或者说看见了,但是不知道怎么玩出来的

不会包含所有的东西,但是会有一些很神奇的效果

通过代码创建一个 issue

比如我在某行代码发现了一个错误, 那么我可以直接在 github 中选中这个代码,然后开启一个 issue

点击行号
open new issue

通过这几个步骤,我们能看到,我们创建了一个指向改行的错误,这样开发者就能很简单的定位到该行,并且可以直观的在 issue 中看到该行代码,方便开发者定位

示例

创建一个永久可见的代码连接

提交后就可以看到了

示例

TODO List 进度条

有的时候我们会需要使用 issue 来记录我们的开发过程,或者功能需求来提醒我们什么没做

使用类似如下的写法来创建即可

1- [X] 第一项工作
2- [ ] 第二项工作
3- [X] 第三项工作
4- [X] 第四项工作

成功后是这样的

flutter http框架简介(1)

Mon, 10 Dec 2018 13:44:44 +0800

http 简介

http 是一个 http 网络请求框架, 由 dart team 出品

与HttpClient不是一回事,至于和 dio 孰优孰劣自己见仁见智吧

通过 pub 下载

基础的 api

http 协议中有多种 METHOD,当然最常见的就是 GET POST,

因为最近几年 restful 协议的频繁使用,使得 PUT,DELETE,PATCH 方法也有了一定的使用率

基础使用

 1import 'package:http/http.dart' as http;
 2void get(String url) async {
 3    http.Response response = await http.get(url);
 4
 5    // 其他的返回值都是一样的
 6    http.post(url);
 7    http.put(url);
 8    http.patch(url);
 9    http.delete(url);
10    http.head(url);
11}

增加请求头

1  void headerDemo(String url, Map<String, String> headers) async {
2    http.get(url, headers: headers);
3
4    // 其他的方法相同
5  }

post 常见的请求方式

常见的请求方式有如下几种(来自于postman)

或者使用 postman 查看也可以帮助加深理解

form-data

模拟表单上传

 1Future<String> postFormData(String url, Map<String, String> headers,
 2      Map<String, String> params, Map<String, File> files) async {
 3    Completer<String> completer = Completer();
 4
 5    var request = http.MultipartRequest("POST", Uri.parse(url));
 6
 7    request.fields.addAll(params);
 8    files.forEach((k, v) {
 9      var partFile = http.MultipartFile(
10        k,
11        v.readAsBytes().asStream(),
12        v.lengthSync(),
13      );
14      request.files.add(partFile);
15    });
16
17    var ioClient = http.IOClient();
18    var response = await ioClient.send(request);
19
20    List<int> responseBody = [];
21
22    response.stream.listen((data) {
23      responseBody.addAll(data);
24    }, onDone: () {
25      var string = String.fromCharCodes(responseBody);
26      completer.complete(string);
27    }, onError: (err) {
28      completer.completeError(err);
29    });
30
31    return completer.future;
32  }

x-www-form-urlencoded

这个也是

Flutter 1.0.0 打包apk后运行错误

Fri, 07 Dec 2018 17:04:04 +0800

java.lang.UnsatisfiedLinkError: dalvik.system.PathClassLoader[DexPathList[[zip file "/system/framework/android.test.runner.jar", ...... base.apk!/lib/arm64-v8a, /system/lib64, /system/vendor/lib64]]] couldn't find "libflutter.so"

这种问题可以看到其中有 arm64 的字样. 也有 libflutter.so

在以前运行打包命令后可以正常运行的项目,可能在更新 flutter 1.0.0 后不能正常运行

1flutter build apk

这种情况通常是因为 so 文件没有打包到 apk 中造成的拖动 apk 到 android Studio 中可以看到其中包含的库文件

我前面有一篇 so 对齐的文章可以解释原理

但是 flutter 升级后可以查看flutter.gradle文件

图片中的代码说明了当目标是 arm64 的时候, 会自动将 64 的 so 打包到 flutter 内, 这里的问题就造成了以前你在自己的 gradle 设置的打包选项和这个同时生效,也就是 v7 v8 的 so 都不进 apk 里了..

一个小说明

在说解决方案前,有一点需要说明的是 armeabi -> v7 ->v8,这个是 arm cpu 架构的进化过程,而后来的 cpu 是兼容前代的 so 库,

Flutter 原生通信 (四) - iOS 通知 Flutter

Fri, 07 Dec 2018 10:43:45 +0800

原生通信系列

1. Flutter 调用 Android
2. Android 通知 Flutter
3. Flutter 调用 iOS
4. iOS 通知 Flutter

项目地址

本篇主要介绍如何在 iOS 中发布广播,然后在 dart 端进行订阅

oc

先来查看 OC 篇

 1#import "BattlePowerPlugin.h"
 2#import <Foundation/NSTimer.h>
 3
 4@implementation BattlePowerPlugin
 5
 6+ (void)registerWithRegistrar:(NSObject<FlutterPluginRegistrar>*)registrar {
 7    //  ...
 8
 9    [self registerPostTimerWithRegistrar:registrar];
10}
11
12+(void) registerPostTimerWithRegistrar:(NSObject<FlutterPluginRegistrar>*)registrar{
13    FlutterBasicMessageChannel *channel = [FlutterBasicMessageChannel messageChannelWithName:@"run_time" binaryMessenger:[registrar messenger]];
14
15    long start = [self getNow];
16
17    [NSTimer scheduledTimerWithTimeInterval:5 repeats:true block:^(NSTimer * _Nonnull timer) {
18        long run = [self getNow] - start;
19        [channel sendMessage:[NSNumber numberWithLong:run]];
20
21        if (run > 100){
22            [timer invalidate];
23        }
24    }];
25}
26
27+(long)getNow{
28    NSDate *date = [NSDate date];
29    long timeStamp = [date timeIntervalSince1970];
30    return timeStamp;
31}
32
33//...
34
35@end

间隔 5 秒通过 sendMessage 发送一条消息

Flutter 原生通信 (三) - Flutter 调用 iOS

Fri, 07 Dec 2018 10:43:43 +0800

原生通信系列

1. Flutter 调用 Android
2. Android 通知 Flutter
3. Flutter 调用 iOS
4. iOS 通知 Flutter

项目地址

本篇要介绍的是 flutter 调用 iOS 篇

如果你没有看过我的前 2 篇,建议看一下. dart 端会承接上一篇的结果

dart

 1import 'dart:async';
 2
 3import 'package:flutter/services.dart';
 4
 5class BattlePower {
 6  static const MethodChannel _channel = const MethodChannel('battle_power');
 7
 8  static Future<String> get platformVersion async {
 9    final String version = await _channel.invokeMethod('getPlatformVersion');
10    return version;
11  }
12
13  static Future<int> requestNativeAdd(int x, int y) async {
14    int result = await _channel.invokeMethod('add', {"x": x, "y": y});
15    return result;
16  }
17
18  //....
19}

这里和第一篇一样

不详细介绍了

这里是以 oc 为例的,不建议用 swift 开发插件,尤其是开源插件

当然如果你自用还是可以用 swift 的. 后面有机会会更新一下 swift 的版本

Flutter 原生通信 (二) - Android通知Flutter

Fri, 07 Dec 2018 10:02:15 +0800

原生通信系列

1. Flutter 调用 Android
2. Android 通知 Flutter
3. Flutter 调用 iOS
4. iOS 通知 Flutter

项目地址

第二篇介绍的是原生通知 dart

开篇就是灵魂流程图,自己体会吧 😆

不同于第一篇, 本篇是由 java 端作为发布端, dart 作为订阅端
具体的创建过程请参考第一篇

java

先看看 java 端代码

 1package com.example.battlepower;
 2
 3import java.util.Timer;
 4import java.util.TimerTask;
 5
 6import io.flutter.plugin.common.BasicMessageChannel;
 7import io.flutter.plugin.common.MethodCall;
 8import io.flutter.plugin.common.MethodChannel;
 9import io.flutter.plugin.common.MethodChannel.MethodCallHandler;
10import io.flutter.plugin.common.MethodChannel.Result;
11import io.flutter.plugin.common.PluginRegistry.Registrar;
12import io.flutter.plugin.common.StandardMessageCodec;
13
14/**
15 * BattlePowerPlugin
16 */
17public class BattlePowerPlugin implements MethodCallHandler {
18
19    private static BasicMessageChannel<Object> runTimeSender;
20
21    private static Timer timer;
22
23    private static long startTime;
24
25    /**
26     * Plugin registration.
27     */
28    public static void registerWith(Registrar registrar) {
29        final MethodChannel channel = new MethodChannel(registrar.messenger(), "battle_power");
30        BattlePowerPlugin handler = new BattlePowerPlugin();
31        channel.setMethodCallHandler(handler);
32
33        runTimeSender = new BasicMessageChannel<>(registrar.messenger(), "run_time", new StandardMessageCodec());
34        startTime = System.currentTimeMillis();
35    }
36
37    public static void startTimeSender() {
38        if (timer != null) {
39            timer.cancel();
40        } else {
41            timer = new Timer();
42        }
43
44        timer.schedule(new TimerTask() {
45            @Override
46            public void run() {
47                if (runTimeSender != null) {
48                    runTimeSender.send(System.currentTimeMillis() - startTime);
49                }
50            }
51        }, 5000, 5000);
52    }
53
54    public static void cancelTimer() {
55        timer.cancel();
56    }
57
58    // ...
59}

这里创建BasicMessageChannel类来负责传递消息

Flutter 原生通信 (一) - flutter调用Android

Thu, 06 Dec 2018 17:16:34 +0800

原生通信系列

1. Flutter 调用 Android
2. Android 通知 Flutter
3. Flutter 调用 iOS
4. iOS 通知 Flutter

项目地址

在 flutter 开发中一定会有需要和原生通信的情况

第一篇介绍的是 flutter 调用 Android

这篇是给刚刚入门或者刚刚接触原生调用的朋友们使用的,老鸟们或者英文强的朋友还是直接看官方文档比较好

创建项目

一般来说建议使用一个 plugin 作为一个单独的项目来将业务逻辑独立出去

我这里使用命令行创建,事实上一律建议使用命令行创建,因为信息更加可见一些

1flutter create --template plugin  battle_power
2cd battle_power

前面都是固定格式,最后面那个是插件名,根据你自己的需要来修改

创建好的截图如下

和开发 package 的时候不同,开发 plugin 需要打开 example/android 目录

使用快捷的方式,或自己通过 Android Studio 的 open 打开项目

等待完成

接着就可以开始开发了,

默认生成了一个 java 文件,可以称之为插件的主文件

流程图

乱画的..随便看看就好

android 端

 1package com.example.battlepower;
 2
 3import io.flutter.plugin.common.MethodCall;
 4import io.flutter.plugin.common.MethodChannel;
 5import io.flutter.plugin.common.MethodChannel.MethodCallHandler;
 6import io.flutter.plugin.common.MethodChannel.Result;
 7import io.flutter.plugin.common.PluginRegistry.Registrar;
 8
 9/** BattlePowerPlugin */
10public class BattlePowerPlugin implements MethodCallHandler {
11  /** Plugin registration. */
12  public static void registerWith(Registrar registrar) {
13    final MethodChannel channel = new MethodChannel(registrar.messenger(), "battle_power"); //这里对应dart端的 MethodChannel
14    channel.setMethodCallHandler(new BattlePowerPlugin());
15  }
16
17  @Override
18  public void onMethodCall(MethodCall call, Result result) {
19    if (call.method.equals("getPlatformVersion")) { // 对应dart端 invoceMethod
20      result.success("Android " + android.os.Build.VERSION.RELEASE);
21    } else {
22      result.notImplemented();
23    }
24  }
25}

当然如果你对于 kotlin 比较喜欢也可以使用 kotlin 进行插件开发

Flutter 本人开发的一些开源库

Wed, 05 Dec 2018 11:50:03 +0800

pub 库

项目名: flutter_image_compress
项目地址: https://pub.dartlang.org/packages/flutter_image_compress
简介: 图片压缩

项目名: oktoast
项目地址: https://github.com/OpenFlutter/flutter_oktoast
项目简介: 仿 android toast 纯 flutter 实现

项目名: photo_manager
项目地址: https://github.com/CaiJingLong/flutter_photo_manager
项目简介: 读取系统相册纯 api 版支持(ios/android)

项目名: photo
项目地址: https://github.com/CaiJingLong/flutter_photo
项目简介: 相册图片选择器基于 photo_manager

项目名: loadmore
项目地址: https://github.com/OpenFlutter/flutter_listview_loadmore
项目简介: ListView 的加载更多

项目名: flutter_page_indicator
项目地址: https://github.com/CaiJingLong/flutter_page_indicator
项目简介: 配合 pageview 的简单圆点指示器

项目名: city_picker
项目地址: https://github.com/CaiJingLong/flutter_city_picker 项目简介: 城市选择器

项目名: menu
项目地址: https://github.com/CaiJingLong/flutter_long_tap_menu
项目简介: 一个长按弹出菜单的小部件

项目名: log4d
项目地址: https://github.com/CaiJingLong/log4d
项目简介: 日志插件,用于帮助将 flutter 上的日志记录至开发机

Docker 部署二进制

Fri, 16 Nov 2018 13:39:04 +0800

在搜索引擎中,搜索了一下如何部署一个 go 的程序, 发现都是基于 golang 的镜像部署 go 源码的方案

而基于 golang 源码部署 docker image 的大小有 700MB, 有时候并不需要这么大,我们生成二进制文件后只需要基于 centos 来制作 image 就可以了, 当然如果对于 go 源码有持续部署的需求,那还是只能使用 golang 镜像

目录结构

完整的目录结构就这么简单, main 是二进制运行文件

main.go

 1package main
 2
 3import "github.com/gin-gonic/gin"
 4
 5func main() {
 6    g := gin.Default()
 7
 8    g.LoadHTMLGlob("static/*")
 9
10    g.GET("/index", func(c *gin.Context) {
11        c.HTML(200, "index.html", gin.H{
12            "title": "标题",
13        })
14    })
15
16    g.Run(":80")
17}

打包 go 二进制运行文件

这里因为我是 mac 系统,所以我需要交叉编译,具体的交叉编译可以查看我的另一篇交叉文章

1cd main
2
3CGO_ENABLED=0 GOOS=linux GOARCH=amd64 go build main.go

制作镜像

Dockerfile

 1FROM centos:latest
 2
 3LABEL cjl "cjl_spy@163.com"
 4
 5WORKDIR /root
 6
 7ADD ./main ./main
 8ADD ./static/ ./static/
 9
10EXPOSE 80
11
12ENTRYPOINT  ["./main"]

FROM 基于 centos

Docker-Compose 结合nginx实现跨容器转发

Thu, 15 Nov 2018 15:28:11 +0800

开发环境

mac zsh docker-compose

1$ docker-compose --version
2docker-compose version 1.22.0, build f46880f

目录结构

docker-compose.yml

 1version: "3"
 2services:
 3  web: # 服务的名称
 4    image: nginx
 5    volumes: # 文件夹映射
 6      - /Users/cai/Documents/www:/usr/share/nginx/html:ro # 宿主:docker:只读  ,www目录
 7      - ./config/web.conf:/etc/nginx/nginx.conf:ro # nginx配置文件
 8    ports: # 端口转发 宿主:docker
 9      - "8080:80"
10      - "8081:81"
11    # environment:
12    # - NGINX_HOST=foobar.com
13    # - NGINX_PORT=80
14    # command: /bin/bash -c "envsubst < /etc/nginx/conf.d/mysite.template > /etc/nginx/conf.d/default.conf && exec nginx -g 'daemon off;'"
15    networks: ## 定义网络
16      nn: ## 加入的网络的名称
17        ipv4_address: 192.168.5.101 ## ipv4的ip地址
18
19  web8082:
20    image: nginx
21    volumes:
22      - /Users/cai/Documents/www/8082:/usr/share/nginx/html:ro
23    ports:
24      - "8082:80"
25
26    networks:
27      nn:
28        ipv4_address: 192.168.5.102
29
30  web8083:
31    image: nginx
32    volumes:
33      - /Users/cai/Documents/www/8083:/usr/share/nginx/html:ro
34    ports:
35      - "8083:80"
36
37    networks:
38      nn:
39        ipv4_address: 192.168.5.103
40
41networks: ##定义网络组
42  nn: ## 网络组名称
43    driver: bridge ## 网络的模式
44    ipam: ## 配置网络
45      driver: default
46      config:
47        - subnet: 192.168.5.0/24 ## ip地址网络 这里宿主机一般会是该网段的 192.168.5.1,所以不要设置自网段为1

配置服务配置网络

flutter - 点击事件(二) - 给图片增加点击UI效果

Wed, 14 Nov 2018 14:24:26 +0800

上一篇, 介绍了如何便利的构造一个自己的点击控件

flutter 中如果给图片外面套 InkWell ,你会发现点击的逻辑生效了,但是 UI 上没反应

备注: 图片来源 , 违反版权请联系我,删除

代码如下

 1import 'package:flutter/material.dart';
 2
 3class ImageTapWidget extends StatefulWidget {
 4  final Widget child;
 5  final Function onTap;
 6
 7  const ImageTapWidget({Key key, this.child, this.onTap}) : super(key: key);
 8
 9  @override
10  ImageTapWidgetState createState() {
11    return new ImageTapWidgetState();
12  }
13}
14
15class ImageTapWidgetState extends State<ImageTapWidget> {
16  var isDown = false;
17  @override
18  Widget build(BuildContext context) {
19    return GestureDetector(
20      child: AnimatedContainer(
21        duration: Duration(milliseconds: 500),
22        foregroundDecoration: BoxDecoration(
23          color: isDown ? Colors.white.withOpacity(0.5) : Colors.transparent,
24        ),
25        child: widget.child,
26      ),
27      onTap: widget.onTap,
28      onTapDown: (d) => setState(() => this.isDown = true),
29      onTapUp: (d) => setState(() => this.isDown = false),
30      onTapCancel: () => setState(() => this.isDown = false),
31    );
32  }
33}

利用 Container 的前景色完成点击色的变化

利用 AnimatedContainer 完成颜色的过度

这样就完成了一个有点击效果的控件,当然这个控件的效果不止于对图片有效,对所有的控件都有效,但是正常来说我对于其他类型的控件应该不需要做这个操作

点击效果过快

当然,有的时候你会遇到点击和松开之间过快,造成了视觉上没点击的感觉,这种情况下可以使用另一种方法,利用动画的方式来实现

 1import 'package:flutter/material.dart';
 2
 3class ImageTapWidget extends StatefulWidget {
 4  final Widget child;
 5  final Function onTap;
 6
 7  const ImageTapWidget({Key key, this.child, this.onTap}) : super(key: key);
 8
 9  @override
10  ImageTapWidgetState createState() {
11    return new ImageTapWidgetState();
12  }
13}
14
15class ImageTapWidgetState extends State<ImageTapWidget> with SingleTickerProviderStateMixin {
16  AnimationController _ctl;
17
18  @override
19  void initState() {
20    super.initState();
21    _ctl = AnimationController(vsync: this, duration: Duration(milliseconds: 200));
22  }
23
24  @override
25  void dispose() {
26    _ctl.stop();
27    _ctl.dispose();
28    super.dispose();
29  }
30
31  @override
32  Widget build(BuildContext context) {
33    return GestureDetector(
34      child: AnimatedBuilder(
35        animation: _ctl,
36        builder: (BuildContext context, Widget child) {
37          return Container(
38            foregroundDecoration: BoxDecoration(
39              color: Colors.white.withOpacity(0.5 * _ctl.value),
40            ),
41            child: widget.child,
42          );
43        },
44      ),
45      onTap: widget.onTap,
46      onTapDown: (d) => _ctl.forward(),
47      onTapUp: (d) => prepareToIdle(),
48      onTapCancel: () => prepareToIdle(),
49    );
50  }
51
52  void prepareToIdle() {
53    AnimationStatusListener listener;
54    listener = (AnimationStatus statue) {
55      if (statue == AnimationStatus.completed) {
56        _ctl.removeStatusListener(listener);
57        toStart();
58      }
59    };
60    _ctl.addStatusListener(listener);
61    if (!_ctl.isAnimating) {
62      _ctl.removeStatusListener(listener);
63      toStart();
64    }
65  }
66
67  void toStart() {
68    _ctl.stop();
69    _ctl.reverse();
70  }
71}

创建一个AnimationBuilder结合 AnimationController 来实现

flutter - 点击事件(一) - 自定义一个方便的点击控件

Wed, 14 Nov 2018 13:29:26 +0800

点击事件

android 中,所有 View 都可以直接 setOnClickListener, RN 中也有 TouchableHightlight 这样的控件可以直接套在外面,ios 中也可以有 UIControl 这样的控件可以直接添加点击事件.

那么 flutter 中有吗? 答案自然是有. GestureDetector,InkResponse,InkWell, 包括一些琳琅满目的按钮,比如 FlatButton,MaterialButton,CupertinoButton,IconButton,ImageButton 这些组件都可以达到目的. 那么自定义的目的是什么呢?

自定义的优点

最重要的自然就是可控性强,复用性强. 一次修改终身受用. 来看下面的这段代码

 1import 'package:flutter/material.dart';
 2
 3class MaterialTapWidget extends StatelessWidget {
 4  final double radius;
 5  final Function onTap;
 6  final Widget child;
 7  final double elevation;
 8  final Color backgroundColor;
 9  final Color splashColor;
10  final Function onLongTap;
11
12  const MaterialTapWidget({
13    Key key,
14    this.radius = 0.0,
15    this.onTap,
16    this.onLongTap,
17    @required this.child,
18    this.splashColor,
19    this.elevation = 0.0,
20    this.backgroundColor = Colors.transparent,
21  }) : super(key: key);
22
23  @override
24  Widget build(BuildContext context) {
25    Widget w = ClipRRect(
26      borderRadius: BorderRadius.circular(radius),
27      child: Material(
28        borderRadius: BorderRadius.circular(radius),
29        color: backgroundColor,
30        elevation: 0.0,
31        child: InkWell(
32          child: child,
33          onTap: onTap,
34          onLongPress: onLongTap,
35        ),
36      ),
37    );
38
39    if (this.splashColor != null) {
40      return Theme(
41        data: Theme.of(context).copyWith(splashColor: this.splashColor),
42        child: w,
43      );
44    }
45
46    return w;
47  }
48}

【转】Golang 在 Mac、Linux、Windows 下如何交叉编译

Tue, 13 Nov 2018 19:54:33 +0800

转自 https://blog.csdn.net/panshiqu/article/details/53788067

Golang 支持交叉编译，在一个平台上生成另一个平台的可执行程序，最近使用了一下，非常好用，这里备忘一下。

Mac 下编译 Linux 和 Windows 64 位可执行程序

1CGO_ENABLED=0 GOOS=linux GOARCH=amd64 go build main.go
2CGO_ENABLED=0 GOOS=windows GOARCH=amd64 go build main.go

Linux 下编译 Mac 和 Windows 64 位可执行程序

1CGO_ENABLED=0 GOOS=darwin GOARCH=amd64 go build main.go
2CGO_ENABLED=0 GOOS=windows GOARCH=amd64 go build main.go

Windows 下编译 Mac 和 Linux 64 位可执行程序

1SET CGO_ENABLED=0
2SET GOOS=darwin
3SET GOARCH=amd64
4go build main.go
5
6SET CGO_ENABLED=0
7SET GOOS=linux
8SET GOARCH=amd64
9go build main.go

GOOS：目标平台的操作系统（darwin、freebsd、linux、windows） GOARCH：目标平台的体系架构（386、amd64、arm）交叉编译不支持 CGO 所以要禁用它

上面的命令编译 64 位可执行程序，你当然应该也会使用 386 编译 32 位可执行程序很多博客都提到要先增加对其它平台的支持，但是我跳过那一步，上面所列的命令也都能成功，且得到我想要的结果，可见那一步应该是非必须的，或是我所使用的 Go 版本已默认支持所有平台。

【简单翻译】flutter的设计哲学（ inside flutter）

Sun, 11 Nov 2018 12:24:00 +0800

简单翻译

英文链接来自于 flutter 官网

对应的版本为 11 月 11 日版本连接为

后续如有改动,请以最新的英文版本为准,有翻译不准确的地方请参照英文版本自行理解

概述

本文档描述了 Flutter 工具包的内部工作原理，使 Flutter 的 API 成为可能。因为 Flutter 小部件是使用积极的可组合性(aggressive composition)构建的，所以使用 Flutter 构建的用户界面具有大量小部件。

为了支持这种工作量，Flutter 使用次线性算法来布局和构建小部件，这些数据结构使树形手术变得高效，并且具有许多常量因子优化。

通过一些额外的细节，这种设计还使开发人员可以使用回调来轻松创建无限滚动列表，这些回调可以构建用户可见的小部件。

积极的可组合性（Aggressive composability）

Flutter 最独特的一个方面是其积极的可组合性。

小部件是通过组合其他小部件构建的，这些小部件本身是由逐步更基本的小部件构建的。例如，Padding 是一个小部件而不是其他小部件的属性。因此，使用 Flutter 构建的用户界面由许多小部件组成。

小部件构建递归在 RenderObjectWidgets 中触底，这些小部件在底层渲染树中创建节点。渲染树是一种数据结构，用于存储用户界面的几何图形，该几何图形在布局期间计算并在绘制和命中测试期间使用。大多数 Flutter 开发人员不直接创建对象，而是使用小部件操纵渲染树。

为了在小部件层支持积极的可组合性，Flutter 在小部件和渲染树层使用了许多有效的算法和优化，这些将在以下小节中介绍。

次线性布局

使用大量小部件和渲染对象，良好性能的关键是高效的算法。最重要的是布局的性能，布局是确定渲染对象的几何（例如，大小和位置）的算法。其他一些工具包使用 O（N²）或更差的布局算法（例如，某些约束域中的定点迭代）。 Flutter 的目标是初始布局的线性性能，以及随后更新现有布局的常见情况下的次线性布局性能。通常，布局所花费的时间量应该比渲染对象的数量更慢。

Flutter 每帧执行一个布局，布局算法一次完成。约束通过父对象向下传递，父对象在每个子对象上调用布局方法。子项递归地执行自己的布局，然后通过返回布局方法将几何返回到树中。重要的是，一旦渲染对象从其布局方法返回，该渲染对象将不再被访问，直到下一帧的布局。这种方法将可能单独的度量和布局传递组合成单个传递，因此，每个渲染对象在布局期间最多访问两次：一次在树下，一次在树上。

Flutter 有这个通用协议的几个专业。最常见的专业是 RenderBox，它以二维笛卡尔坐标运算。在框布局中，约束是最小和最大宽度以及最小和最大高度。在布局期间，子项通过选择这些边界内的大小来确定其几何。孩子从布局返回后，父母决定孩子在父母坐标系中的位置。请注意，孩子的布局不能取决于孩子的位置，因为孩子的位置直到孩子从布局返回后才确定。因此，父母可以自由地重新定位孩子，而无需重新计算孩子的布局。

更一般地说，在布局期间，从父节点传递到子节点的唯一信息是约束，并且从子节点流向父节点的唯一信息是几何体。这些不变量可以减少布局期间所需的工作量：

如果孩子没有将自己的布局标记为脏，则孩子可以立即从布局返回，切断步行，只要父母给孩子的约束与孩子在前一个布局中收到的约束相同。
每当父级调用子级的布局方法时，父级指示它是否使用从子级返回的大小信息。如果经常发生父级不使用大小信息，那么如果子级选择新大小，则父级不需要重新计算其布局，因为父级保证新大小将符合现有约束。
严格约束是指只能通过一个有效几何体来满足的约束。例如，如果最小和最大宽度彼此相等并且最小和最大高度彼此相等，则满足这些约束的唯一尺寸是具有该宽度和高度的尺寸。如果父级提供严格约束，则父级无需在子级重新计算其布局时重新计算其布局，即使父级在其布局中使用子级的大小，因为子级无法在没有父级的新约束的情况下更改大小。
渲染对象可以声明它仅使用父级提供的约束来确定其几何。这样的声明通知框架该子渲染对象的父级在子级重新计算其布局时不需要重新计算其布局，即使约束不紧，即使父级的布局取决于子级的大小，因为子级无法更改大小没有来自其父级的新约束。

作为这些优化的结果，当渲染对象树包含脏节点时，在布局期间仅访问那些节点以及它们周围的子树的有限部分。

次线性小部件构建

与布局算法类似，Flutter 的小部件构建算法是次线性的。构建之后，小部件由元素树保存，元素树保留用户界面的逻辑结构。元素树是必要的，因为小部件本身是不可变的，这意味着（除其他外），它们不能记住它们与其他小部件的父或子关系。元素树还包含与有状态窗口小部件关联的状态对象。

响应于用户输入（或其他刺激），元素可能变脏，例如，如果开发人员在关联的状态对象上调用 setState（）。框架保留一个脏元素列表，并在构建阶段直接跳转到它们，跳过干净的元素。在构建阶段，信息在元素树中单向流动，这意味着在构建阶段期间每个元素最多访问一次。清洁后，元素不会再次变脏，因为通过感应，它的所有祖先元素也都是干净的。

因为窗口小部件是不可变的，所以如果元素没有将自身标记为脏，则元素可以立即从构建返回，如果父级使用相同的窗口小部件重建元素，则会切断步行。此外，元素只需要比较两个窗口小部件引用的对象标识，以确定新窗口小部件与旧窗口小部件相同。开发人员利用此优化来实现重投影模式，其中窗口小部件包括在其构建中存储为成员变量的预构建子窗口小部件。

在构建期间，Flutter 还避免使用 InheritedWidgets 遍历父链。如果窗口小部件通常走他们的父链，例如确定当前的主题颜色，则构建阶段将在树的深度变为 O（N 2），由于积极的组合，这可能非常大。为了避免这些父行为，框架通过在每个元素上维护一个 InheritedWidgets 的哈希表来向下推送元素树中的信息。通常，许多元素将引用相同的哈希表，该哈希表仅在引入新的 InheritedWidget 的元素上更改。

flutter android So库对齐

Sat, 27 Oct 2018 12:18:08 +0800

so 库说明

so 库在 android 中,是使用 c/c++代码编译出来的库文件,可以使用 ndk 调用,就是你在 android 代码中见到的 native 方法,具体的实现就在 so 库中

关于 so 库兼容性问题

andorid 中或多或少都会引用到第三方库,而很多第三方库中都有 so 的存在,不论是复制到项目中(如百度地图),或是 gradle 依赖(如个推) 其中都涉及到了 so 库的相关问题,如果你选择的库是有所有 cpu 类型可选还好,如果不是,那么就需要自定义设置了

举个栗子

你的 app 依赖两个库,分别是 lib1,lib2

1 lib1: arm64-v8a,armeabi-v7a
2 lib2: armeabi-v7a

那么当你运行在 v7 的手机上时,因为你的项目含有 v7 的 so 库,所以没有问题,可以跑起来

如果,你运行在 v8 手机上,那么你的项目就会 boom,崩了, 为啥呢? 这就涉及到 so 对齐了

so 对齐

简单来说,就是要有就必须都有,如果一个没有,那就一个都不要

比如上面的例子,如果你是自己复制到项目下的,你需要删掉 arm64-v8a 的文件夹

如果是个推那种使用 gradle 依赖的方案,那么你需要修改 gradle 文件,这个是我的个推的配置 gradle

 1// 个推的ndk配置
 2apply plugin: 'com.android.application'
 3
 4android {
 5    defaultConfig {
 6        ndk {
 7            abiFilters "armeabi-v7a"
 8//            abiFilters "armeabi-v7a","arm64-v8a"
 9        }
10    }
11    buildTypes {
12        debug {
13            ndk {
14                abiFilters "armeabi-v7a", "x86"
15//                abiFilters "armeabi-v7a", "x86"/*, "arm64-v8a"*/
16            }
17        }
18        release{
19            ndk{
20                abiFilters "armeabi-v7a"
21            }
22        }
23    }
24}
25
26repositories {
27    maven { url "http://mvn.gt.igexin.com/nexus/content/repositories/releases/" }
28}

这里因为涉及到 flutter 的调试,而很多模拟器都是 x86 的,所以 debug 的情况下开启了 x86

Flutter 如何自定义一个loadmore 加载更多

Thu, 06 Sep 2018 12:16:31 +0800

自定义 loadmore

写在前面

这类的库在 pub 上有很多

我为什么要自定义呢

首先是项目需要，并且这种库普适性高，抽取出来今后复用也方便点

另外记录一下编码思路,方便后续查看

pub 地址 pub 国内镜像 github

使用说明

导入说明看这里或中文镜像

看看构造方法一共 5 个属性 child 是 ListView

onLoadMore 是加载更多时的回调,由外部实现

isFinish 加载完成

delegate 是一个抽象类

有默认实现, 其中有 3 个方法,一个是根据状态给一个 widget 高度一个是延迟加载的毫秒时间一个是构建显示在内部的 Widget,这样就完全实现了外部可根据状态自定义 Widget

LoadMoreTextBuilder 是一个根据状态构建文字的方案,默认实现了中文/英文文字,如果只想修改文字,使用默认样式的话,可以直接用这个即可

思路

首先考虑怎么自定义一般来讲有 2 种方式，一个是到底部继续上拉加载，另一种是滚动到底部自动加载，我这里采取的是到底部自动加载方案

不使用上拉加载的原因是：滚动到底继续上拉不符合正常人习惯，如果是惯性滚动到底，谁知道你后面还有没有东西的

思考如何自定义

首先怎么样可以知道滚动到底了呢，最简单的方式，listview 的最后一行 build 的时候一定滚动到底了

所以我们可以使用如下的方式定义

 1
 2class _ListViewDemoPageState extends State<ListViewDemoPage> {
 3  var count = 10;
 4
 5  @override
 6  Widget build(BuildContext context) {
 7    return ListView.builder(
 8      itemCount: count + 1,
 9      itemBuilder: _buildItem,
10    );
11  }
12
13  Widget _buildItem(BuildContext context, int index) {
14    if (index == count) {
15      return Text('到底了');
16    }
17    return Text(index.toString());
18  }
19}

这样的话只要到最后了，你自然知道应该加载了

Flutter 一个简单的Route Helper/Navigator Helper

Wed, 05 Sep 2018 12:13:39 +0800

在 flutter 中 route 是一个绕不开,必须面对,且很常用东西

Route 就是路由,顾名思义,负责你页面间的跳转

不想看代码和思路分析的直接 copy 了拿去用就行没有啥外部依赖,只需要注意_rootRoute 后面的字符串需要和 initialRoute 对应即可

路由又分静态和动态路由

静态就是不需要传参数的,这样的路由可以直接定义在 MaterialApp/WidgetsApp 里这样可以通过Navigator.pushNamed调用

动态的就是传入一个PageRoute, 通常是一个MaterialPageRoute 或者CupertinoPageRoute,或者你如果有自定义的有可以使用

这里我使用一个我的工具类来实现跳转,因为大部分情况下,工程中的路由都是动态的,也就是需要传参数的,所以工具类中只包含了静态路由

 1import 'dart:async';
 2
 3import 'package:flutter/material.dart';
 4
 5class RouteHelper {
 6  static Future<T> pushWidget<T>(
 7    BuildContext context,
 8    Widget widget, {
 9    bool replaceRoot = false,
10    bool replaceCurrent = false,
11  }) {
12    return pushRoute(
13      context,
14      MaterialPageRoute(builder: (ctx) => widget),
15      replaceRoot: replaceRoot,
16      replaceCurrent: replaceCurrent,
17    );
18  }
19
20  static Future<T> pushRoute<T>(
21    BuildContext context,
22    PageRoute<T> route, {
23    bool replaceRoot = false,
24    bool replaceCurrent = false,
25  }) {
26    assert(!(replaceRoot == true && replaceCurrent == true));
27    if (replaceRoot == true) {
28      return Navigator.pushAndRemoveUntil(
29        context,
30        route,
31        _rootRoute,
32      );
33    }
34    if (replaceCurrent == true) {
35      return Navigator.pushReplacement(context, route);
36    }
37    return Navigator.push(context, route);
38  }
39}
40
41var _rootRoute = ModalRoute.withName("home");

解析一下这个类,有两个方法,一个是接受 PageRoute,一个是接收 Widget

Flutter 依赖冲突解决

Thu, 23 Aug 2018 12:12:19 +0800

有时候 flutter 更新 sdk 版本后不知道该不该更新有时候 pub 库更新后和自己的其他类库发生了冲突

类似于图上的情况

遇到这样的问题应该怎么解决呢

我们一步步解决

首先,这种依赖一般是 pub 中引用的,先查看下原作者有没有最新版,也许就解决了呢

无奈我们用到的类库是一个 5 个月没有更新过的类库,看来是指望不上了没关系,我们进 pub 主页中

一般都是有 github 的,我们点进 github 中如果真没有那就下一个 zip,然后自己创建一个吧

然后 fork 项目,clone 下来,修改下 commit

可以参考下这个修改日志, 修改了库的引用地址,因为这两个库是同一个作者,这个依赖了另一个,我这里修改了另一个库,并且也同样 fork+clone 修改后上传到了自己的 github

这里是另一个库的修改 commit

我在这里修改了作者使用的依赖为更加新的版本

接着返回自己的 app 项目中

修改引用为 git 的方式

接着再使用就没问题了

git 依赖的引用方式可以参考 flutter 官网 , dart 官网

Dart Flutter中的代码规范

Wed, 22 Aug 2018 12:19:22 +0800

文章首发地址: https://www.jianshu.com/p/047eb78dce53

前言

最近看 qq 群里发的很多代码截图,感觉命名规则/文件命名都不符合规范很多朋友都是从其他语言转向 dart/flutter 的,深感语言环境还需要大家共同去维护,建议还是规范化代码,这样所有人看着都会舒服恰好 dart 语言官方有自己的代码规范和相关的说明,在 dartlang 官网上,英文好的建议阅读原文连接地址 https://www.dartlang.org/guides/language/effective-dart/style

我这里仅粗略翻译和加入一些自己的理解

图片均来自于上述 url 对应的页面中当前 dart 版本为 2.0 版本,日期为 2018 年 08 月 22 日可能会在未来有改动,到时请以最新文档为准

文档中图片的绿色部分为正例,右上角带good标识红色是反例,右上角带bad标识

标识方案

在 dart 有 3 种常规标识方案第一个为大写字母开头的驼峰式如 UserInterface 每个词的首字母为大写第二个是小写开头的驼峰式,如testRun,第一个单词是小写,后续每个单词首字母大写第三个是每个单词均为小写,以下划线分隔,如user_response

总结

如果不想往下看具体的图片和翻译,直接看这里

文件名: 小写+下划线类型名(类名,函数类型名):大写开头驼峰变量名(包含 const final 常量):使用小写开头驼峰, 项目有特殊要求 const 可以使用大写+下划线的方式,如同java中一样导包 as 后的名称为小写+下划线不要用匈牙利命名法中的 kXXXX 这样的命名方式,应该去掉 k 超过两位的英文缩写一律按该单词为普通小写单词处理,使用小写

导包有顺序要求,且每"部分"间空行分隔开,每部分内按字母排序,按如下顺序排序 dart sdk 内的库 flutter 内的库第三方库自己的库相对路径引用

flutter json解析相关 for json_serializable

Thu, 09 Aug 2018 12:10:24 +0800

以下所有相关来自于当前认知,flutter 还在高速发展/dart 也在不停更新,后续可能发生变化目前 flutter dev 版本是 0.7.0
dart 正式版是 2.0.0
json_serializable 版本是 1.1.0

具体的 json 解析可以参考这篇 json 连接来自于官网

其中介绍了两种方式，第一种是手动解析

需要的话可以参考一位大佬写的在 Flutter 开发过程中快速生成 json 解析模板类的工具这个有一个工具，python+qt 写的跨平台工具，有 linux/mac/windows 三端可执行文件

第二种是利用 json_serializable

1dependencies:
2  # Your other regular dependencies here
3  json_annotation: ^0.2.3
4
5dev_dependencies:
6  # Your other dev_dependencies here
7  build_runner: ^0.9.0
8  json_serializable: ^0.5.4

这里有一个坑，就是高版本的 flutter hello world 工程创建时会自动依赖 flutter_test 的高版本，但是这个高版本的 flutter_test 和这个库的当前不兼容，所以会报错，删除掉 test 的引用或等待兼容性更新,我目前版本是 dev 分支的 0.5.7，不排除后续可以使用

Mac Flutter 开发环境配置从0到1 流程

Sat, 04 Aug 2018 12:08:18 +0800

mac 开发环境配置从入门到完成

本文首发简书转载请注明出处原文连接掘金连接

高能提示：文章字数不多，图很多，请做好战斗准备

前言

写这篇文章的原因是我自己的 macbook 开不开机，返修后，所有开发环境全部没有了，正好要重新配置开发环境，所以写一个从零配置的文章因为 flutter 涉及到跨平台开发，所以预想中会包含四部分 mac 篇，android 篇，ios 篇，flutter 篇

术语相关

cmd = command 键（空格左边） opt／alt = option 键（cmd 左边） ctrl = control（opt 左边） cli = 命令行工具（command-line interface,命令行界面) as = Android Studio

写在前面

最低需要 xcode 9.0.0 以上的 xcode 版本但是不建议从非官方渠道下载 xcode，以免遇到之前盗版 xcode 的问题

我就是都装好了 8.3 才告诉我这个，没办法只能升级系统，再升级 xcode

mac 篇

所谓 mac 篇就是一些基础的环境，和效率工具

后面会使用

cli

我这里使用 iterm2 ，一个免费的开源的命令行工具默认的命令行工具用 launchpad=> 其他 => 终端打开

Flutter基础faq

Thu, 02 Aug 2018 11:29:34 +0800

写在前面

这篇文章的目的是给纯 flutter 萌新回答一些基础问题,ctrl+f/cmd+f 搜索关键字控件名本篇会持续更新最后更新时间 2018-08-02

布局篇

flutter 中控件各司其职,基础控件中基本只包含自己的功能显示内容的负责显示内容,如 Text 负责文字,Image 负责图片容器的负责容器,Row,Column,ListView 等尺寸位置的负责自己,Padding,Container,SizedBox 等触摸手势触摸相关:GestureDetector

flutter 中在 widget 层级提倡组合模式,而不提倡继承模式比如你不应该有一个class TextButton extend Text/RaisedButton这样的方案出现而应该是

 1
 2class TextButton extends StatelessWidget {
 3  final Function onPressed;
 4  final String text;
 5  final Color color;
 6  final double fontSize;
 7  final EdgeInsets padding;
 8
 9  const TextButton({
10    Key key,
11    this.onPressed,
12    this.text = "",
13    this.color = Colors.black87,
14    this.fontSize = 14.0,
15    this.padding = EdgeInsets.zero,
16  }) : super(key: key);
17
18  @override
19  Widget build(BuildContext context) {
20    return new Material(
21      color: Colors.transparent,
22      child: InkWell(
23        onTap: onPressed,
24        child: Padding(
25          padding: padding,
26          child: new Text(
27            text,
28            style: new TextStyle(fontSize: fontSize, color: color),
29          ),
30        ),
31      ),
32    );
33  }
34}

类似于这样的方案

github Clone速度慢的解决方案之一

Fri, 20 Jul 2018 11:36:31 +0800

github 是每个程序员应该都会用到的平台,无奈对于国内貌似没有 CDN,速度极慢..

我在网上搜了各种修改 host 的方案,无奈并不好用,也许用国外的 VPS 中转可以解决,当然那是要收费的,还需要一些技术门槛

今天来一个傻瓜式的帮助方案用 gitee 中转项目

开始

注册账号

Gitee 注册账号,已经有的话可以直接登录,更简单的方案,直接用 github 账号登录

新建项目

二选一

新开一个窗口,把你需要的 github 项目地址复制过来,我这里以 flutter/engine 为例

然后回到新建项目的页面

点这里

然后照图上操作

最后点创建

接着就等项目好了

这里需要耐心等待,但无论如何很大的项目应该比你自己从那下载要快很多,毕竟有时候你从 github 每秒只有几十或者 100 200K

项目好了后

我们看到,项目都好了

这里复制项目地址

然后命令行中

我们看到 4M 每秒的速度, 这在大项目中就帮了大忙了

如果是 200M 的项目,你 200k 一秒需要下 1000 秒,也就是 20 分钟

而我这里 clone 只要 50 秒前面的工作一共操作也就是 2 分钟等待时间也就是 3~5 分钟

Flutter 项目新手向结构简析

Fri, 13 Jul 2018 11:03:12 +0800

flutter 面向新手向

flutter 中一切界面层级的东西全部都是 Widget 这句话怎么理解呢?

大到整个应用,小到一个文字控件,全部都是 Widget

一个常规的 Application 图级可能是这样的,当然实际情况下会比这复杂很多

对应代码和实际情况看一下

为了和图片对应我把所有的写到一个文件里

 1
 2import 'package:flutter/material.dart';
 3
 4void main() => runApp(new MyApp());
 5
 6class MyApp extends StatelessWidget {
 7  @override
 8  Widget build(BuildContext context) {
 9    return new MaterialApp(
10      title: 'Flutter 结构简析',
11      theme: new ThemeData(
12        primarySwatch: Colors.blue, // 这里是项目的主色调
13      ),
14      home: MyHomePage(),
15    );
16  }
17}
18
19class MyHomePage extends StatefulWidget {
20  @override
21  _MyHomePageState createState() => _MyHomePageState();
22}
23
24class _MyHomePageState extends State<MyHomePage> {
25  @override
26  Widget build(BuildContext context) {
27    return Scaffold(
28      appBar: AppBar(),
29      body: ListView(
30        children: <Widget>[
31          ListTile(title: Text('我是第一个item')),
32          ListTile(title: Text('我是第二个item')),
33        ],
34      ),
35    );
36  }
37}

这里的一切皆 widget 的意思就是 Application 是 Widget Page 是 Scaffold 是 Appbar 是 ListView 是 ListTile 也是 Text 也是

Flutter开篇介绍

Fri, 06 Jul 2018 09:13:17 +0800

flutter 介绍

所有的一切都是个人观点,不满可以留言,可以讨论,吵架大可不必所有的资料仅 2018-07-06 时我所了解的,当前的 flutter 版本号 dev 为 0.5.6,beta 为 0.5.1 转载请注明出处,简书为第一发布平台(本人目前迁出简书平台,自建 blog)

何谓 flutter

简介

google 自己的官方介绍,来源于 flutter 官网

为什么要用 flutter

跨平台框架,能开发 ios/android,性能不错

已有那么多的跨平台方案,flutter 有什么优势

所有 UI 为 Flutter 平台自建,使用 skia 引擎绘制到屏幕上,能保持高度的统一性所以 flutter 定位仅为 UI 框架,可以做一些业务逻辑

劣势呢

目前与原生控件很难有机的结合到一个界面内

1  大概意思是,目前类似于baidumap,这样的控件只能是生硬的覆盖到flutter的界面上
2  android中对应FlutterView(SurfaceView),ios中是FlutterViewController的根view
3  你很难直接写方便的回调,手势控制
4
5  WebView,直播等视频播放同理

与原生通信仅依赖一个接近字符串性质的通道,没有构建工具/编译层级的检查尚处于初级阶段,开源社区还不活跃,相关社区关注度不高

1  关于字符串性质的通道:
2  大概意思就是,所有的通信依赖于字符串
3  比如flutter中需要定义
4  static const MethodChannel _channel = const MethodChannel('com.365.app/BarCode');
5  _channel.invokeMethod("getData", source);
6  类似于这样的调用方式
7
8  而原生中 也是需要定义出完全相同的字符串来表示通道名,方法名等等

flutter 使用 dart 语言开发

为什么使用 dart,貌似是说 flutter 的开发团队物理距离 dart 的团队很近,这段真实性未知

swift navigation title 标题颜色代码设置

Tue, 13 Mar 2018 11:57:15 +0800

简单记录,为后续方便查找,仅有代码片段
可以放在ViewController的基类中

 1if let bar = self.navigationController?.navigationBar {
 2    bar.backgroundColor = .themeColor
 3    bar.tintColor = .white
 4    var attrs = bar.titleTextAttributes
 5    if attrs == nil {
 6        attrs = [NSAttributedStringKey:Any]()
 7    }
 8    attrs?[NSAttributedStringKey.foregroundColor] = UIColor.white
 9    bar.titleTextAttributes = attrs
10}

Swift Ios11 修改navigationbar间距

Fri, 09 Mar 2018 11:55:10 +0800

写在前面

在 ios11 中,navigationbar 的 leftItem 都会多出来一个奇怪的白边,这个白边很不容易修改,从前的设置方法失效了

之前看到有篇文章是修改 layoutMargins 的方案来做的连接这个方案设置虽然简单,但是有一个问题,就是当你 push,pop 以后,位置就变了,也就是说,layoutMargins 就失效了,而且需要遍历,采用 ContentView 的字符串

另外有一个方案是采用自定义 NavigationBar 的方案来做的连接也算是简单暴力

我这里采用另一个方案来做,而且比较简单,也就是自定义 view 的方案的来做

思路

UIBarButtonItem.init(customView: view)这种方式如果直接将 Button 放进去,那么你设置的 frame 的位置是无效的

那么我这里采用另一个取巧的方案去做众所周知,ios 中的控件摆放是可以超出父控件距离的,也就是说,我使用一个 UIView 包裹真正用于显示的 View,然后将子 View 的 x 设置偏移也就可以解决了

实现

 1
 2import UIKit
 3
 4extension UIViewController{
 5  func setNavigatorLeftItem(customView:UIView) {
 6        var view:UIView
 7        if #available(iOS 11, *){
 8            let padding:CGFloat = 20
 9            let frame = customView.frame
10            view = UIView(frame: CGRect(x: 0, y: 0, width: frame.width + padding, height: frame.height))
11            customView.frame = customView.frame.offsetBy(dx: -padding, dy: 0)
12            view.addSubview(customView)
13
14        }else{
15            view = customView
16        }
17        let item = UIBarButtonItem.init(customView: view)
18        self.navigationItem.leftBarButtonItem = item
19    }
20}

没错,代码就这么简单,没有别的代码

android 依赖冲突

Sun, 04 Mar 2018 17:14:00 +0800

起因

在引入新的依赖后,有时你会报一些冲突的错误,尤其是 v4 v7 库的使用

有的时候能"自动"纠正,但是大部分时候不行

比如 A 库引用了 v7 26.x.x 的库, B 库使用了 v7 27.x.x 作为依赖

解决方案

gradle 打包的过程中,首先会加载所有 gradle 脚本到库内

然后才是运行的过程, 所以我们只需要在 app 级的build.gradle中增加如下代码即可

 1rootProject.allprojects { // 闭包循环每个工程
 2
 3    subprojects { //每个工程子工程
 4        project.configurations.all { //查找所有配置
 5            resolutionStrategy.eachDependency { details -> //遍历所有依赖
 6                if (details.requested.group == 'com.android.support'
 7                        && details.requested.name.contains('appcompat-v7')) {
 8                    details.useVersion "26.1.0" //将support包 v7替换为26.1.0 ,这里根据你自己的需要来改就可以了
 9                }
10            }
11        }
12    }
13
14}

Swift连接BLE蓝牙打印机

Wed, 13 Sep 2017 11:52:48 +0800

swift 蓝牙连接

项目简介

最近公司要用到便携式蓝牙打印机进行打印
打印机使用的 ECS/POS 指令集
ios 使用的 BLE 方案,安卓则是因为设备的原因只能选择普通蓝牙的连接方案
BLE 蓝牙相关的概念性东西我这里就不说了大家可以自己去搜索下
有个 mac 的蓝牙开发工具 LightBlue,很好用,mac app store 自己下就好了,这个很方便你理解 BLE 的蓝牙相关 device(central/peripheral)->services->characteristics

这里可以看到,有一个 mobike,有兴趣的同学可以研究下 mobike 的蓝牙连接 ☺ 说笑一下,人家肯定有安全性校验的

语言选型

最近在学习 ios 开发,因为我是 android 出身,学习 ios 开发的时候 swift3 已经出现很久了,所以我这里使用的 swift 进行开发

坑 1

最初我使用了厂家提供的 ios sdk 进行开发,其中封装了很多常用的方法,让我自己以为很简单就能完成,但是事实上是我太天真了,首先厂家提供的是.a 的库,只有一个.h 文件暴露在外,我的项目是纯 swift 项目,这就不可避免的使用到了 swift 到 oc 的桥接

坑 2

满以为桥接完了调 SDK 方法就行,谁知道调用的时候根本就没反应,没办法,只能摸石头过河进行开发了,最初使用的是 oc 的 corebluetooth 方案,因为实在是没找到 swift 的相关说法,baidu 没搜到,没办法,oc 毕竟也算是入门了,直接开干了

spring boot 渲染md格式模板

Sun, 27 Aug 2017 10:45:55 +0800

写在前面

主要技术点:使用 thymeleaf+flexmark 渲染模板渲染 markdown 文件 ,highlight 渲染代码高亮 thymeleaf 模板负责渲染页面 flexmark 是 java 语言编写,负责将数据库中的 markdown 语法文本转为 html 文本 highlight 负责渲染 code 部分的代码,是一款 js+css 库

步骤

首先定义一个 controller 和 requstmapping

 1package com.kikt.web.ctl.blog;
 2
 3import com.kikt.service.markdown.MarkdownService;
 4import com.sun.org.apache.xpath.internal.operations.Mod;
 5import org.springframework.beans.factory.annotation.Autowired;
 6import org.springframework.stereotype.Controller;
 7import org.springframework.ui.Model;
 8import org.springframework.web.bind.annotation.RequestMapping;
 9import org.springframework.web.bind.annotation.RequestMethod;
10import org.springframework.web.bind.annotation.RequestParam;
11import org.springframework.web.bind.annotation.RequestPart;
12
13/**
14 * Created by cai on 2017/8/25.
15 */
16@Controller
17@RequestMapping("/md")
18public class MarkdownCtl {
19
20    @Autowired
21    private MarkdownService service;
22
23    @RequestMapping(value = "/parse", method = RequestMethod.POST)
24    public String parseMarkDown(Model model, @RequestParam("md") String markdownText) {
25        model.addAttribute("md", service.parseMarkdownString(markdownText));
26        return "test";
27    }
28
29    @RequestMapping(value = "/index", method = RequestMethod.GET)
30    public String index(Model model) {
31        model.addAttribute("inputName", "md");
32        return "markdown";
33    }
34
35}

在 static/templates 下定义一个文件,markdown.html

spring boot 扫码登录后端实现

Fri, 25 Aug 2017 11:42:26 +0800

前言

在业内，扫码登陆不是什么新技术了，我这里主要是想自己实现一下这个功能，用的是简单实现，提供的只是思路具体可以参考网上的其他文章扫码登录是如何实现的？

开发环境

mac+idea+paw+chrome+mysql
开发语言:java+kotlin

mac:我的开发系统
idea:开发工具
paw:http调试工具

插一句

开发语言使用kotlin是有原因,kotlin是构建在jvm上的,而且有很多很方便的语法糖,敲代码速度很快

启动项目

首先配置一个 spring boot 的项目,这里使用 maven 构建的方案,因为我这里使用 gradle 构建总是会出现各种奇怪的问题

pom.xml

  1<?xml version="1.0" encoding="UTF-8"?>
  2<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  3         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  4    <modelVersion>4.0.0</modelVersion>
  5
  6    <groupId>com.kikt</groupId>
  7    <artifactId>myapp</artifactId>
  8    <version>0.0.1-SNAPSHOT</version>
  9    <!--<packaging>war</packaging>-->
 10    <packaging>war</packaging>
 11
 12    <name>myapp</name>
 13    <description>MyApp</description>
 14
 15    <parent>
 16        <groupId>org.springframework.boot</groupId>
 17        <artifactId>spring-boot-starter-parent</artifactId>
 18        <version>1.5.4.RELEASE</version>
 19        <relativePath/> <!-- lookup parent from repository -->
 20    </parent>
 21
 22    <properties>
 23        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
 24        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
 25        <java.version>1.8</java.version>
 26        <kotlin.version>1.1.3-2</kotlin.version>
 27    </properties>
 28
 29    <dependencies>
 30        <!--<dependency>-->
 31        <!--<groupId>org.springframework.boot</groupId>-->
 32        <!--<artifactId>spring-boot-starter-data-jpa</artifactId>-->
 33        <!--</dependency>-->
 34        <dependency>
 35            <groupId>org.springframework.boot</groupId>
 36            <artifactId>spring-boot-starter-data-rest</artifactId>
 37        </dependency>
 38        <dependency>
 39            <groupId>org.springframework.boot</groupId>
 40            <artifactId>spring-boot-starter-web</artifactId>
 41        </dependency>
 42
 43        <dependency>
 44            <groupId>mysql</groupId>
 45            <artifactId>mysql-connector-java</artifactId>
 46            <scope>runtime</scope>
 47        </dependency>
 48
 49        <dependency>
 50            <groupId>com.alibaba</groupId>
 51            <artifactId>druid</artifactId>
 52            <version>1.1.0</version>
 53        </dependency>
 54
 55        <dependency>
 56            <groupId>org.springframework.boot</groupId>
 57            <artifactId>spring-boot-starter-tomcat</artifactId>
 58            <!--<scope>provided</scope>-->
 59        </dependency>
 60        <dependency>
 61            <groupId>org.springframework.boot</groupId>
 62            <artifactId>spring-boot-starter-actuator</artifactId>
 63            <!--<scope>provided</scope>-->
 64        </dependency>
 65        <dependency>
 66            <groupId>org.springframework.boot</groupId>
 67            <artifactId>spring-boot-starter-test</artifactId>
 68            <scope>test</scope>
 69        </dependency>
 70
 71        <!-- https://mvnrepository.com/artifact/org.mybatis.spring.boot/mybatis-spring-boot-starter -->
 72        <!--<dependency>-->
 73            <!--<groupId>org.mybatis.spring.boot</groupId>-->
 74            <!--<artifactId>mybatis-spring-boot-starter</artifactId>-->
 75            <!--<version>1.3.0</version>-->
 76        <!--</dependency>-->
 77
 78
 79        <dependency>
 80            <groupId>org.springframework.boot</groupId>
 81            <artifactId>spring-boot-starter-aop</artifactId>
 82        </dependency>
 83
 84        <dependency>
 85            <groupId>org.springframework.boot</groupId>
 86            <artifactId>spring-boot-starter-data-jpa</artifactId>
 87            <version>1.5.4.RELEASE</version>
 88        </dependency>
 89
 90        <dependency>
 91            <groupId>org.jetbrains.kotlin</groupId>
 92            <artifactId>kotlin-stdlib-jre8</artifactId>
 93            <version>${kotlin.version}</version>
 94        </dependency>
 95        <dependency>
 96            <groupId>org.jetbrains.kotlin</groupId>
 97            <artifactId>kotlin-test</artifactId>
 98            <version>${kotlin.version}</version>
 99            <scope>test</scope>
100        </dependency>
101        <!-- https://mvnrepository.com/artifact/com.alibaba/fastjson -->
102        <dependency>
103            <groupId>com.alibaba</groupId>
104            <artifactId>fastjson</artifactId>
105            <version>1.2.35</version>
106        </dependency>
107
108        <!-- https://mvnrepository.com/artifact/org.json/json -->
109        <dependency>
110            <groupId>org.json</groupId>
111            <artifactId>json</artifactId>
112            <version>20170516</version>
113        </dependency>
114
115        <dependency>
116            <groupId>org.springframework.boot</groupId>
117            <artifactId>spring-boot-starter-jdbc</artifactId>
118            <exclusions>
119                <exclusion>
120                    <groupId>org.apache.tomcat</groupId>
121                    <artifactId>tomcat-jdbc</artifactId>
122                </exclusion>
123            </exclusions>
124        </dependency>
125
126        <dependency>
127            <groupId>org.springframework.boot</groupId>
128            <artifactId>spring-boot-starter-thymeleaf</artifactId>
129        </dependency>
130        <dependency>
131            <groupId>org.springframework.boot</groupId>
132            <artifactId>spring-boot-devtools</artifactId>
133        </dependency>
134
135        <!--<dependency>-->
136        <!--<groupId>org.springframework.boot</groupId>-->
137        <!--<artifactId>spring-boot-starter-ssl</artifactId>-->
138        <!--</dependency>-->
139
140        <!--netty-->
141        <dependency>
142            <groupId>io.netty</groupId>
143            <artifactId>netty-all</artifactId>
144            <version>4.1.13.Final</version>
145        </dependency>
146    </dependencies>
147
148    <build>
149        <finalName>myapp</finalName>
150        <plugins>
151            <plugin>
152                <groupId>org.springframework.boot</groupId>
153                <artifactId>spring-boot-maven-plugin</artifactId>
154            </plugin>
155            <plugin>
156                <groupId>org.jetbrains.kotlin</groupId>
157                <artifactId>kotlin-maven-plugin</artifactId>
158                <version>${kotlin.version}</version>
159                <executions>
160                    <execution>
161                        <id>compile</id>
162                        <phase>compile</phase>
163                        <goals>
164                            <goal>compile</goal>
165                        </goals>
166                    </execution>
167                    <execution>
168                        <id>test-compile</id>
169                        <phase>test-compile</phase>
170                        <goals>
171                            <goal>test-compile</goal>
172                        </goals>
173                    </execution>
174                </executions>
175                <configuration>
176                    <jvmTarget>1.8</jvmTarget>
177                </configuration>
178            </plugin>
179            <plugin>
180                <groupId>org.apache.maven.plugins</groupId>
181                <artifactId>maven-compiler-plugin</artifactId>
182                <executions>
183                    <execution>
184                        <id>compile</id>
185                        <phase>compile</phase>
186                        <goals>
187                            <goal>compile</goal>
188                        </goals>
189                    </execution>
190                    <execution>
191                        <id>testCompile</id>
192                        <phase>test-compile</phase>
193                        <goals>
194                            <goal>testCompile</goal>
195                        </goals>
196                    </execution>
197                </executions>
198            </plugin>
199        </plugins>
200    </build>
201    <repositories>
202        <repository>
203            <id>spring-milestone</id>
204            <url>http://repo.spring.io/libs-release</url>
205        </repository>
206    </repositories>
207
208</project>

其中有一些是其他的配置,比如 netty 是在内部构建一个 netty 服务器,注入 spring 进行管理

spring boot jdbctemplate mysql emoji 编码错误的问题

Wed, 23 Aug 2017 11:42:26 +0800

前言

为啥标题这么长呢? 因为确实关联到了这些问题最近买了个阿里云的打折主机,打算主机布个简易的服务器,顺便熟悉下 springboot 的一些知识, 数据库打算直接用简单 jdbctemplate 但是不巧在提交上传的时候有中文,引起了乱码问题

乱码问题

根据我多年的经验,乱码都是编码问题,baidu 了下

修改 springboot.properties

1spring.datasource.url = jdbc:mysql://127.0.0.1:3306/app?autoReconnect=true&useUnicode=true&characterEncoding=utf-8

果然得到了解决

emoji 报错

后来上传的内容中有 emoji 表情,报错信息UncategorizedSQLException 原因是 utf8 不支持长度为 4 的编码

数据库

 1create table blog_content
 2(
 3  `_id` int not null auto_increment comment 'id 主键'
 4    primary key,
 5  title varchar(50) default '没有标题' not null comment '标题',
 6  content varchar(1000) null,
 7  tag varchar(30) null comment '标签',
 8  insert_time timestamp default CURRENT_TIMESTAMP not null,
 9  update_time timestamp default CURRENT_TIMESTAMP not null comment '更新时间',
10  author_uid int not null
11)
12  comment '博客内容'
13  ENGINE=InnoDB DEFAULT charset utf8mb4 collate utf8mb4_unicode_ci;
14;

1INSERT INTO blog_content (content, tag, author_uid) VALUES ('内容👌','1,2',1);

解决过程

数据库相关

根据网上的说法,修改数据库,修改表,修改表字段为 utf8mb4

Swift3之将类作为参数

Fri, 04 Aug 2017 11:48:59 +0800

何谓将类名作为参数

举个栗子

看这么一个需求:

一个 tableview,其中的 cell 是 nib 写的

步骤:

定义 1 个 cell 和对应的 xib
在 ViewController 中定义一个 Xib 加载对应文件,注册 xib

这个时候有一些步骤就是需要定义一个 xib 的文件名,cell 的 identitier,但是这两个东西都是字符串,如果一个字母敲错了或者后续业务逻辑/功能有更改,那么当你要修改 cell 对应的类名时,你就不得不一起修改文件名,字符串的名字,所有引用的名称..等等步骤

这个时候就要想了,如果将这个 Cell 实现一个 protocol,protocol 中有 xibName,identifier,同时每个类去实现,然后 tableview 注册方法中只传类名不就可以了吗,这样以后如果有修改都只在 Cell 的类内部去写,就不容易出错了

实现步骤

定义一个 Protocol

1protocol NibCell {
2
3    static func nibName() -> String
4
5    static func identifier() -> String
6
7}

定义一个 Cell

 1import UIKit
 2
 3class OrderDetailCell: UITableViewCell,NibCell {
 4
 5    static func nibName() -> String {
 6        return "OrderDetailCell"
 7    }
 8
 9    static func identifier() -> String {
10        return "OrderDetailCell"
11    }
12
13    override func awakeFromNib() {
14        super.awakeFromNib()
15        // Initialization code
16    }
17    override func setSelected(_ selected: Bool, animated: Bool) {
18        super.setSelected(selected, animated: animated)
19        // Configure the view for the selected state
20    }
21}

tableview 写一个通过注册 xib 来注册 cell 的扩展方法

 1import UIKit
 2
 3extension UITableView{
 4
 5    func registerNibCell(nibCellType nibCell:NibCell.Type){
 6        let nib = UINib(nibName: nibCell.nibName(), bundle: nil)
 7        self.register(nib, forCellReuseIdentifier: nibCell.identifier())
 8    }
 9
10}

这里传入了一个 NibCell.Type 的方法,这样在实际使用的时候,可以直接用对应的 nibName 获取到实际类(OrderDetailCell)定义的 nibName 方法的返回值

RN/Weex的个人看法

Thu, 13 Jul 2017 16:01:00 +0800

关于 react native 和 weex 之我见

写在前面

我是一个主 android 开发,原生的 ios 开发也算是初窥门径,主要是有一些东西如果能一次性开发,多次使用就好了,跨平台性嘛
本文没有代码,只是一些简单的看法

跨平台的探索

这里就有几个选择了,有纯粹的网页嵌入式开发,虽然是一个解决方案,但是毕竟不原生,而且网页渲染很不靠谱的感觉,否定掉了
然后想起了react native和weex,都号称是使用 web 语言开发,然后渲染成原生控件,而且还支持热更新!
好高端大气的样子啊!去尝试下吧

react native

首先是react native,简称 RN facebook 的开源项目,语法和文档都还算可以接受

开发环境配置

我是 jetbrain 的忠实粉丝嘛,webstorm 走起来,破解的方案自己 baidu 吧,这里就不宣传了

导航条的问题

我翻遍了所有的文档,没找到一个考虑的导航控制器,导航条虽然有一个react-navigation
但是我使用了一下这个,如果是自己写一个自己的项目还好,但是我们毕竟不是设计师,国内的设计们从来都是按照自己的方案设计导航条的啊!真没几个人是用系统自带的方案,这里用 react 的 navigation 很难自定义,我这里没找到可以修改标题颜色的方案
而且还需要吐槽一点,我认为网页端最强的一点就是百分比适配方案是 css 自带的,非常强大,而这里居然没有了,完全是 px,这样面对不同的平台真的能好好的适配吗

运行

这里就要说 webstorm 对于 react native 的支持了,帮我们全部配置好了,可以用鼠标选择 ios/android 直接运行就行了,真是 diao 啊

日志问题/debug 问题

和源生相比,android studio/xcode 都是可以直接在 ide 里直接可以看到日志的,调试相对很方便,这里就不是这样了,真的很麻烦,需要在模拟器里开 debug 模式,然后 chrome 打开网页,开发者模式,看控制台才能看见
这个时候我才知道,我们原生开发的开发环境真的比网页端的兄弟们好太多了

动态部署

可以直接在模拟器点 cmd+R 就可以了好简单啊!
直接原地重新运行,我靠,什么时候我们源生也能这样就好了

Ios版toast

Sat, 08 Jul 2017 09:39:26 +0800

ios-toast-swift

项目地址

swift 3.1 语法

如果想支持其他的语法请自己修改
这里主要是模仿android端的提示方案

截图

背景灰色是因为我把 Demo 中的 ViewController 的 view 的 backgroundColor 修改为了 gray 不是会覆盖全屏的颜色

这里有个小 bug

圆角么有包含全,后续改正

食用方法

clone 项目
将 source 下的方法 copy 到源码内,如果有文件重名请自己改名
toast("提示语句")
toast("提示内容",3) //内容时长

源码分析

都是伪代码

代码分布

ToastView:自定义view相关的代码,基本没啥东西,就是加载了xib文件
Toast:帮助类,其中定义了如何附着到window中,位置,根据文字计算文字大小,渐隐动画等相关内容

提示

这里对于项目没有太多的侵入性总体原理大概就是创建一个 view,将 view 附着到前台 window 中这里有一点,这里的 toast 会覆盖掉软键盘

如果想要修改 view 的样式,可以自己修改 ToastView.xib/ToastView.swift

内容很简单,就在ToastView中
可以自定义内容,更加丰富多彩,也可以基于扩展
content 是一个UILabel,用于显示内容

想要修改提示位置

Toast.swift 的 57~60行

想要修改大小

Toast.swift的35~50行左右

动画效果

Toast.swift的66~87行

License/开源协议

Copyright 2017 JingLong Cai

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

android 经典蓝牙编程 SPP

Sat, 08 Jul 2017 09:35:55 +0800

前言

最近有一些蓝牙的通信需要做,就研究了一下蓝牙连接相关

连接蓝牙电子秤
连接 pos 机打印

其中连接蓝牙电子秤是接收数据 pos 机打印是发送数据/接收数据

流程图

流程图画的相当不专业,请自行脑补

核心类

因为这次的电子秤不是 4.0 的设备,所以没有使用 BLE 的开发,而是经典蓝牙(SPP)的连接方式 BluetoothAdapter

全局变量

1protected BluetoothAdapter mAdapter;

获取的方法,在 API18 下的时候使用的方式和以上的不一样,其实差别不大

1if (SDK_INT < 18) {
2    adapter = BluetoothAdapter.getDefaultAdapter();
3} else {
4    BluetoothManager bm = (BluetoothManager) getSystemService(BLUETOOTH_SERVICE);
5    adapter = bm.getAdapter();
6}

蓝牙使用的是注册广播的方式来获取系统给我们的通知核心有以下的几种,注册广播的方法自己去搜下吧

1    BluetoothDevice.ACTION_FOUND//找到设备
2    BluetoothDevice.ACTION_NAME_CHANGED//设备的名字
3    BluetoothAdapter.ACTION_DISCOVERY_FINISHED//扫描结束
4    BluetoothDevice.ACTION_PAIRING_REQUEST//配对请求的放弃
5    BluetoothAdapter.STATE_OFF//蓝牙关闭
6    BluetoothAdapter.STATE_ON//蓝牙开启

连接

一般这种连接应该是全局单例,考虑写在了 service 中

首先需要扫描所有的蓝牙连接,但是这里有个坑,就是如果你将广播注册在 onCreate 中和 onDestroy,你每次都需要接收系统的广播,如果出现同名或者别的原因,这里就会一直接收广播所以这里需要动态的将广播注册与反注册我这里使用的方案请参照流程图

Android6.0百度地图导入UnsatisfiedLinkError的问题

Tue, 07 Mar 2017 12:45:55 +0800

前言

今天用 AS 写一个带有百度地图相关的项目时，发现了一个问题

提示

1 Error:Execution failed for task ':app:compileDebugNdk'.
2> Error: Your project contains C++ files but it is not using a supported native build system.
3Consider using CMake or ndk-build integration with the stable Android Gradle plugin:
4 https://developer.android.com/studio/projects/add-native-code.html
5or use the experimental plugin:
6 http://tools.android.com/tech-docs/new-build-system/gradle-experimental.

我就找原因，先点开了两个网页，发现一个是用 CMake 构建 ndk 的还一个是用 experimental 插件构件 ndk 项目的
这两个方式的共通点是都有 c 的源码，自己生成 so 文件，都不是我想要的
因为以前这么写没有问题，我在网上找相同的问题，大家都是说把 targetVersion 改成 23 以下就解决了，但是这不是我想要的，况且我这么用了也没解决问题，毕竟 targetVersion 迁移到 23+是大势所趋

我找了下原因，应该是 so 文件的原因，在 6.0 中添加了一个安全性的规范，大概意思是说，不能引用外部的 so 库，这样会有安全性的问题

Poi解析对比excel表格

Mon, 27 Feb 2017 10:45:55 +0800

前言

这次不是 Android 的技术分享，是 java 的，当然把 poi 的代码放到 Android 中也可以用，毕竟同源嘛

为啥会有这个文章呢，因为我老婆是会计嘛，她有时候会让我帮忙对账，两个 excel 文件，顺序也不同，需要我来对比出哪里有问题，也就是数不太对应，我想了一下，如果好几百个甚至几千个数字来对账，那我岂不是眼睛都花了，这样我哪里还有时间去~~happy~~愉快的撸代码了？作为一个程序员，我们要解放自己的眼睛，去做一些有意义的事情！

开发环境

Intellij Idea+maven

pom 文件

 1<?xml version="1.0" encoding="UTF-8"?>
 2<project xmlns="http://maven.apache.org/POM/4.0.0"
 3         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 4         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
 5    <modelVersion>4.0.0</modelVersion>
 6
 7    <groupId>com.kikt</groupId>
 8    <artifactId>ExcelDemo</artifactId>
 9    <version>1.0-SNAPSHOT</version>
10    <build>
11        <plugins>
12            <plugin>
13                <groupId>org.apache.maven.plugins</groupId>
14                <artifactId>maven-compiler-plugin</artifactId>
15                <configuration>
16                    <source>1.7</source>
17                    <target>1.7</target>
18                </configuration>
19            </plugin>
20        </plugins>
21    </build>
22
23    <dependencies>
24        <!-- https://mvnrepository.com/artifact/org.apache.poi/poi -->
25        <dependency>
26            <groupId>org.apache.poi</groupId>
27            <artifactId>poi</artifactId>
28            <version>3.15-beta2</version>
29        </dependency>
30        <!-- https://mvnrepository.com/artifact/org.apache.poi/poi-ooxml -->
31        <dependency>
32            <groupId>org.apache.poi</groupId>
33            <artifactId>poi-ooxml</artifactId>
34            <version>3.15-beta2</version>
35        </dependency>
36    </dependencies>
37
38</project>

引入了 poi 的解析库的两个文件

AIDL 安卓进程间通信/跨应用通信

Tue, 06 Dec 2016 10:45:55 +0800

前言

最近出去面试找工作，被人问到 AIDL，我就回答这个东西我用过，也大概理解，Android 的进程间通信语言嘛
人家不置可否，那我能咋着呢，毕竟没深入研究过，也没办法，咱只能回来奋发图强了

写在前面

我以前就看过的一个博客，里面原理代码什么都有，写的水平肯定比我高

Android 开发者指南(6) —— AIDL

首先字面解释

A=Android IDL=Interface definition language 意译就是 android 接口定义语言，马丹，完全看不明白算了，就是 Android 官方给我们定义出来跨进程，甚至跨应用通信用的

开发平台

Android Studio 2.2+Android 手机一部

新建工程

这个就不说了，跳过就是新建工程后再建一个 module 也是 android app，功能后面再说

aidl 语法

这里请去看我写在前面，里面比较详细，或者自行 baidu/google，我也了解的不多

代码示例

最关键的地方到了

其实就是新建一个 aidl 文件

1// IMyAidlInterface.aidl
2package com.kikt.aidl;
3
4// Declare any non-default types here with import statements
5
6interface IMyAidlInterface {
7
8    void test(int sum,int sum2);
9}

接着 make project，生成下 java 代码找到生成的代码看下我靠好复杂，还是渣格式，这里格式化一下：

Android Studio 简单的JunitTest

Sat, 22 Oct 2016 10:45:55 +0800

最近使用 AndroidStudio 的时候想要使用单元测试因为有一些数据需要 Activity 的支持，从网上找了一些教程，但自己使用时感觉不理想，发现都是一些业务逻辑的类，很少有直接针对 Activity 的单元测试所以想自己写一个简单的 demo

开发环境

Android Studio 2.2

步骤

首先新建工程然后会自动生成 MainActivity

MainActivity 代码如下

 1public class MainActivity extends AppCompatActivity {
 2
 3    // Used to load the 'native-lib' library on application startup.
 4    static {
 5        System.loadLibrary("kikt-camera");
 6    }
 7
 8    @Override
 9    protected void onCreate(Bundle savedInstanceState) {
10        super.onCreate(savedInstanceState);
11        setContentView(R.layout.activity_main);
12
13        // Example of a call to a native method
14        TextView tv = (TextView) findViewById(R.id.sample_text);
15        tv.setText(stringFromJNI());
16    }
17
18    /**
19     * A native method that is implemented by the 'native-lib' native library,
20     * which is packaged with this application.
21     */
22    public native String stringFromJNI();
23
24    public void showTest() {
25        Log.d("MainActivity", stringFromJNI());
26    }
27}

Android Studio 2.2 ndk开发环境 gradle配置

Fri, 21 Oct 2016 10:45:55 +0800

AndroidStudio2.2 中对于 ndk/jni 建议使用 cmake 进行编译而对于纯粹的 android 程序员来说，cmake 不是经常接触的方案，我在遇到 jni 相关时也遇到了一些问题，这里抛砖引玉吧

开发环境

Android SDK/NDK Android Studio 2.2

友情提示：更新请科学上网

准备工作

其实 demo 永远是最好的老师我们直接自己创建一个 Project

好在 AS 对于对于 ndk 的支持越来越友好选中 c++支持，这样创建出来的 gradle 文件就会自动创建相关的，有助于我们学习

自动生成的核心文件

build.gradle MainActivity.java native-lib.cpp CMakelists.txt

MainActivity.java

1    System.loadLibrary("native-lib"); //加载native-lib库
2    ...
3    public native String stringFromJNI();//指向cpp文件中的方法

左边有一个箭头，这个点击可以直接跳到 cpp 文件中的方法

gradle

project 级别的和传统没有差别看 module 级的

 1apply plugin: 'com.android.application'
 2
 3android {
 4    ...
 5        externalNativeBuild {
 6            cmake {
 7                cppFlags ""
 8            }
 9        }
10    }
11   ...
12    externalNativeBuild {
13        cmake {
14            path "CMakeLists.txt"
15        }
16    }
17
18
19    ndk{
20        abiFilters 'armeabi' //打包的cpu方案
21    }
22}
23
24dependencies {
25   ...
26}

看到核心差别就是这几句 cppFlags 先不去管这里有一个path "CMakeLists.txt" 这个指向了一个 txt 文件打开这个文件

Butterknife8.4.0的一些问题

Sun, 18 Sep 2016 19:45:55 +0800

写在前面：

website github

在 github 上 butterknife 的 star 有 11000+ 为啥有这么多人用这个插件两点： 1、自动化 2、有人更新和维护

GRADLE

根目录的 build.gradle 也就是 project 级

1buildscript {
2  repositories {
3    mavenCentral()
4   }
5  dependencies {
6    classpath 'com.neenbedankt.gradle.plugins:android-apt:1.8'
7  }
8}

module 级别

 1apply plugin: 'android-apt'
 2
 3android {
 4  ...
 5}
 6
 7dependencies {
 8  compile 'com.jakewharton:butterknife:8.4.0'
 9  apt 'com.jakewharton:butterknife-compiler:8.4.0'
10}

基本的注入我想大部分人都知道

ButterKnife.bind(this) 这里可以是 View，Activity 等等

还支持 Android annotations 的几个注解

1@Optional //可选
2@Nullable //可能为空

在 8.4.0 中最大的改动可能就是使用 R2 代替 R 文件我觉得这个可能是为了自动生成 R 文件经常出现问题的解决方案应该是和 Android Studio 中的 instant run 有冲突

Android剪切板的简单解析

Sun, 18 Sep 2016 10:45:55 +0800

其实 android 的剪切板使用不算复杂而且一般的应用需求不会太复杂，只要简单的应用即可

一般都是点击事件时将某段文字复制到剪切板中

Android 中的剪切板是使用ClipboardManager来管理的获取这个对象的方法是

1Context.getSystemService(Context.CLIPBOARD_SERVICE);
2cm = (ClipboardManager) getSystemService(CLIPBOARD_SERVICE);

在 API11 后使用的是

1android.content.ClipboardManager

API11 前使用的是

1android.text.ClipboardManager

前者的方法声明是

1public class ClipboardManager extends android.text.ClipboardManager

也就是说即使在 API11 后也可以使用旧的方法来获取和修改剪切板内的内容

CharSequence text = cm.getText();可以获取到剪切板内的内容使用cm.setText("复制到剪切板");可以将内容复制到剪切板内

如果你的应用 minSDK 在 11 以上，可以直接用新的方法，毕竟老的已经过时了

使用如下的代码

1    cm = (ClipboardManager) getSystemService(CLIPBOARD_SERVICE);
2    ClipData clipData = ClipData.newPlainText("title", "content23");
3    cm.setPrimaryClip(clipData);

可以简单的达到效果

这个有一个对象ClipData

 1package com.dn.clipbroaddemo;
 2
 3import android.content.ClipData;
 4import android.content.ClipDescription;
 5import android.content.ClipboardManager;
 6import android.os.Bundle;
 7import android.support.v7.app.AppCompatActivity;
 8import android.util.Log;
 9
10public class MainActivity extends AppCompatActivity {
11
12    private ClipboardManager cm;
13
14    @Override
15    protected void onCreate(Bundle savedInstanceState) {
16        super.onCreate(savedInstanceState);
17        setContentView(R.layout.activity_main);
18
19        cm = (ClipboardManager) getSystemService(CLIPBOARD_SERVICE);
20
21//        ClipData clipData = ClipData.newPlainText("title", "content23");
22//        cm.setPrimaryClip(clipData);
23//
24//        ClipData primaryClip = cm.getPrimaryClip();
25
26        ClipData data = new ClipData(new ClipDescription("label",new String[]{ClipDescription.MIMETYPE_TEXT_PLAIN}),
27                new ClipData.Item("test"));
28        data.addItem(new ClipData.Item("test0"));
29        data.addItem(new ClipData.Item("test1"));
30
31        for (int i = 0; i < data.getItemCount(); i++) {
32            ClipData.Item item = data.getItemAt(i);
33            Log.d("MainActivity", "item:" + item);
34        }
35
36    }
37}

日志输出：

Retroift简单二次封装

Thu, 01 Sep 2016 10:45:55 +0800

retrofit 的简单二次封装

基于上次的 retrofit 初探后，可以对 retrofit 简单的二次封装

1public interface HttpURL {
2    String baseUrl = "http://127.0.0.1:32001/";
3}

 1public class RequestUtils {
 2
 3    private static OkHttpClient client;
 4    private static Retrofit retrofit;
 5
 6    private RequestUtils() {
 7    }
 8
 9    static {
10        client = new OkHttpClient()
11                .newBuilder()
12                .connectTimeout(8, TimeUnit.SECONDS)
13                .readTimeout(8, TimeUnit.SECONDS)
14                .writeTimeout(8, TimeUnit.SECONDS)
15                .addInterceptor(new HttpInterceptor())
16                .build();
17
18        retrofit = new Retrofit.Builder()
19                .baseUrl(HttpURL.baseUrl)
20                .client(client)
21                .addConverterFactory(StringConverterFactory.create())
22                .build();
23    }
24
25    public static String post(String url, String body) throws IOException {
26        RequestServer requestServer = retrofit.create(RequestServer.class);
27        String[] path = url.split("/");
28        Call<String> call = requestServer.post(path[0], path[1], body);
29        Response<String> response = call.execute();
30        return response.body();
31    }
32
33    public static void main(String[] args) throws IOException {
34        String hello = post("ping/test", "hello");
35        System.out.println(hello);
36    }
37}

输出结果

Retroift初探

Wed, 31 Aug 2016 18:25:45 +0800

retrofit 初探

引用

maven

1<dependency>
2  <groupId>com.squareup.retrofit2</groupId>
3  <artifactId>retrofit</artifactId>
4  <version>2.1.0</version>
5</dependency>

gradle

1    api 'com.squareup.retrofit2:retrofit:2.1.0'

github

github website

个人意见

其实，最适合使用 retrofit 的是 rest 请求类的交互，如果具体的请求参数是以 url 区分业务逻辑，请求参数通过 json 进行的，那其实 retrofit 不太适用

俗话说，demo 是最好的学习先来看看怎么定义业务逻辑

1public interface GitHubService {
2  @GET("users/{user}/repos")
3  Call<List<Repo>> listRepos(@Path("user") String user);
4}

这里的{user}是一个会在实际使用时会被动态改变的，会根据 String user 中的变量而改变

 1public class RetrofitDemo {
 2  private static OkHttpClient client;
 3
 4    static {
 5        client = new OkHttpClient.Builder()
 6                .addInterceptor(new HttpInterceptor())
 7                .build();
 8    }
 9
10    public static void main(String[] args) throws IOException {
11        Retrofit retrofit = new Retrofit.Builder()
12                .baseUrl("http://127.0.0.1:32001")
13                .addConverterFactory(GsonConverterFactory.create())
14  //              .addConverterFactory(StringConverterFactory.create())
15                .client(client)
16                .build();
17
18        RequestServer requestServer = retrofit.create(RequestServer.class);
19        TestEntity bean = new TestEntity();
20        bean.setTest("text1");
21        Call<ResponseEntity> call = requestServer.post("ping", "test", bean);
22        Response<ResponseEntity> response = call.execute();
23        ResponseEntity body = response.body();
24        System.out.println(body.toString());
25    }
26}

在上述的代码中访问的 url 是 http://127.0.0.1:32001/ping/test 请求的方式是post 返回值是Call<ResponseEntity> 这里的具体访问是框架实现的框架会将请求的 Bean 转换成 Json Post 请求到指定的 url

CaiJingLong

XCode16 构建 Flutter iOS时出错的结果

Unable to find a target named RunnerTests in project Runner.xcodeproj

unable to rename temporary

使用 Amper 管理 KMP 应用

新建项目

项目结构解析

扩展项目：添加桌面端支持

安装 Kotlin Multiplatform 环境并运行在 macOS 上

新的系列

安装 Kotlin Multiplatform 环境

创建项目

设置一些东西以更好的使用

gradle_wrapper

Gradle wrapper 使用国内镜像的那点事

直接替换 url

使用代理

不能替换的情况

c/c++ 项目基础

1. 编译器

1.1 前端

1.2 优化器

Gradle 编写Plugin

插件的类型

项目脚本的方式

Gradle buildSrc

使用方法

Gradle Wrapper

给项目添加 wrapper

关于版本控制

版本号

Gradle 的约定式概念

build.gradle

settings.gradle

buildSrc

Gradle Plugin

内置插件

三方插件

Gradle Task的创建和使用

创建栈

任务的生命周期

Gradle 基础

概念

Gradle 命令行工具的使用

最典型的使用

调用 Task

运行多个 task

不执行某特定的 task

强制执行所有任务

失败，但继续

Task 名称的简写

约定式的任务

Gradle 开始

关于文档

为什么需要 Gradle

Groovy 语法

基础类型

方法

闭包

. 的方式

Gradle API

Project

目录 for content/post/gradle

Kotlin Compose 05 鼠标事件

Kotlin Compose 04 控件 Image

简单说明

加载资源图片

Kotlin Compose Kotlin Compose 03 Window

概念

Application

Tray

Window

Widget

架构

代码的组织

WindowManager

Kotlin Compose Kotlin Compose 02 Create Project

开发环境

创建项目

看看配置文件

Unable to find a target named `RunnerTests` in project `Runner.xcodeproj`

`<root>/build.gradle.kts`

`FocusNode`

Flutter 插件开发之引入aar到安卓部分并使用本地maven

Flutter 1.12后上传aar至maven私服