随着去年Google把Jetpack的推出，DataBinding终于被扶正，历经几年的迭代，使得DataBinding这个库已经相当完善，
但是DataBinding却不被传统的Android开发者们所接受，“xml里面写逻辑太烦了”，“编译太慢了”，“坑太多，找不到报错”
这些言语屡见不鲜，造成这些的原因大部分是由于官方文档简陋，以及各类博客教程素质参差不齐所导致的，我17年第一次接触DataBinding的时候，
也是被虐得体无完肤，但是去年，我放开胆子在正式项目里面踩坑，终于，功夫不负有心人，在经历了两个项目之后，我已经将DataBinding熟练运用，
并完成了自己的基础架构，而这篇文章，就是带领大家从学习到踩坑到熟练掌握DataBinding，并明白数据驱动好处。

我的基础配置

AS版本：3.4.1

语言：Kotlin

sdk版本：androidx

sdk版本：androidx

开始

在build.gradle中启用DataBinding 并应用kapt插件

1
2
3
4
5
6
7
8
9
10

apply plugin: 'kotlin-kapt'

android {

    dataBinding {
        enabled = true
    }

}

此时准备工作就完成了，下面创建一个新的TestActivity，并同时创建对应的activity_test.xml
切换到xml中，将光标移动到根布局的名称上 使用Alt+Enter快速将xml转换成DataBinding模板

转换之后如图

可以看到，之前的根布局被一个layout标签包起来了，此时编译器自动为我们生成了一个ActivityTestBinding的抽象类，
然后再看到data标签，在这个标签里面，我们需要定义需要引入的数据，引入方式如下：

其中name为引入数据的自定义命名，可随意取，type需要填写数据的类型，这样就定义好了一个数据，接下来如何使用这个数据，
首先我们到对应的数据类中声明变量，有两种方式:

第一种，使用DataBinding为我们准备的数据包装类来声明变量，

DataBinding库本身为我们提供了一系列的包装类来实现数据与UI的同步更新，总共有以下几种：
ObservableInt，ObservableBoolean，ObservableLong，ObservableDouble，ObservableChar，ObservableShort，ObservableByte，ObservableField，ObservableParcelable，ObservableArrayList，ObservableArrayMap

然后我们在xml中绑定数据

绑定数据的写法是 @{数据}

待续

安装

*操作系统：Windows10 64位

*IDE：WebStorm，Android Studio，由于没有mac设备，ios仅提供思路，具体请自行实践

安装node.js

去node.js官网下载安装，或者npm官网下载安装

打开控制台或者git bash

以下npm可换成cnpm，或者或使用淘宝镜像（临时使用）

1

npm --registry https://registry.npm.taobao.org install express

Angular5

1
2

安装：npm install -g @angular/cli
验证：ng -v

安装完成后输入ng -v验证

ionic和cordova

1
2
3

安装：npm install -g cordova ionic
验证ionic：ionic -v
验证cordova：cordova -v

JDK

去oracle官网下载所需jdk（Java SE）并安装

安装完成后将记得配置环境变量（这个教程应该不需要说了）
可将jdk下bin目录和jre下lib目录同时配置进去
配置完成后验证

1

验证：java -version 或 javac

Ant

去Ant官网下载解压包，
并将解压出的文件夹下bin目录和lib目录同时配置到环境变量

1

验证：ant -v

WebStorm，Android Studio

去IDEA官网下载WebStormWebStorm免费试用30天，
经济允许请购买正版，否则自己想办法或者找某宝

或者使用visual studio code

再去Android Studio中文社区下载安装Android Studio
安装好AS之后记得一定要打开Sdk Manager下载sdk，截止发这篇博客cordova最高支持到android 7.0.0
如果不知道要下载哪一个版本的sdk，可以先不急着下载，继续往下看

ios端由于我没有Mac无法测试，可以google或百度搜索ios的构建教程

创建ionic项目

找个位置新建一个文件夹并cd进入

控制台输入

1

ionic start HelloWorld tutorial

其中HelloWorld为项目名称

tutorial代表一套项目模板，包含侧滑菜单，列表等
可以替换为其他模板

比如 blank 空模板， tabs 带有三个底部tab的模板，sidemenu 包含侧滑菜单以及无限子目录的列表

创建过程会提示 Would you like to integrate your new app with Cordova to target native iOS and Android? (y/N)，
意思是是否需要将项目整合到ios和android，输入y确认即可

之后还会提示 Install the free Ionic Pro SDK and connect your app? (Y/n)，
意思是是否安装Ionic pro SDK（ionic自家的类似git的项目管理套件） 来连接你的app，
这个根据需求自己随意选择，如果选择y的话，之后还会提示输入ionic的用户名密码，建议先注册一个，
之后还需要创建SHH密码，倒也不是很麻烦，只需要选择就行

项目创建完成后

可以用WebStorm或者visual studio code来打开项目，就是一个基于angular5框架的项目

可以从控制台进入项目根目录输入以下命令在浏览器预览

1

ionic serve

生成app（Android）

在项目根目录，控制台输入

1

cordova platform ls

可以查看可用的平台和已安装的平台

1
2
3
4
5
6
7
8
9

Installed platforms:
  
Available platforms:
  android 7.0.0
  browser ~5.0.1
  ios ~4.5.4
  osx ~4.0.1
  windows ~5.0.0
  www ^3.12.0

从以上信息中看出支持的android的支持版本是7.0.0，并且还未安装，
此时就应该回到Android Studio的Sdk Manager下载对应版本的Sdk
下载完成后再次查看

1
2
3
4
5
6
7
8

Installed platforms:
  android 7.0.0
Available platforms:
  browser ~5.0.1
  ios ~4.5.4
  osx ~4.0.1
  windows ~5.0.0
  www ^3.12.0

此时就已经安装了sdk，可以编译成android项目了

在项目根目录，控制台输入

1
2

ionic cordova platform add android
或者 cordova platform add android

执行完成后，根目录会多出一个platforms文件夹，里面有一个android文件夹，
里面已经生成了build.gradle文件，然后就可以通过Android Studio打开这个生成的项目了，
之后通过AS的来运行或者打包app即可

当更新了H5代码需要刷新app的代码时，在根目录下控制台执行

1

ionic build

之后platforms中的代码也会更新，AS中即可运行最新的app

另一种方式

直接在控制台输入

1

ionic cordova build android --prod

ionic cordova build android这一部分是打包app，–prod表示混淆，
可以有效减少安装包体积，提高运行效率

这种方式下打包签名apk

先打包一个未签名apk

1

ionic build --release android

然后生成签名文件

1

keytool -genkey -v -keystore my-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000

之后控制台会提示输入签名信息，密码，和android studio上创建签名一样，

my-key.keystore这是签名文件名

alias_name这是别名

如果有签名文件可以省去这一步

然后对之前生成的未签名apk进行签名

1

jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore my-key.keystore my-unsigned-app.apk alias_name

这里的签名文件和apk文件尽量使用绝对路径

最后，优化apk

进入sdk文件夹下build-tools文件夹内，选择对应版本文件夹进入，
例如 D:\Android\Sdk\build-tools\27.0.3
里面有一个zipalign.exe的可执行文件

执行命令

1

zipalign -v 4 my-unsigned-app.apk my-app.apk

my-unsigned-app.apk优化前的名称，注意该apk的路径

my-app.apk优化后的名称

完

安装与新建项目

*操作系统：Windows10 64位

*ide：WebStorm

安装node.js

去node.js官网下载安装（直接访问），去npm官网下载安装
Windows傻瓜式安装就不具体说了，Linux系统安装网上教程也是一大堆，自行搜索。

node.js安装完成之后，使用npm安装angular cli

注意：
大多数国内用户使用npm安装速度极慢，建议将下方命令中npm换成cnpm

1

npm install -g @angular/cli

或者使用淘宝镜像（临时使用）

1

npm --registry https://registry.npm.taobao.org install express

创建angular项目

打开WebStorm -> 菜单栏File -> New -> Project…

打开如图窗口

选择项目路径，修改项目名称，点击Create，等待项目创建完成。

Angular的安装与项目创建到此结束

本篇简要学习Anko中对自定义View的扩展，以FaceBook的图片加载框架fresco中的SimpleDraweeView为例。

必要条件

支持kotlin及kotlin扩展

引入anko及anko扩展（个人建议引入github上面anko项目下所有库）

开始

创建一个名为views.kt的文件

写入以下代码

1
2
3

inline fun ViewManager.simpleDraweeView(theme: Int = 0) = simpleDraweeView(theme) {}

inline fun ViewManager.simpleDraweeView(theme: Int = 0, init: SimpleDraweeView.() -> Unit) = ankoView({ SimpleDraweeView(it) }, theme, init)

其中SimpleDraweeView代表自定义view的名称，simpleDraweeView则代表该自定义view在Anko中使用的名称，
建议自定义view以类名的驼峰式命名。

使用（在AnkoComponent的实现类中）

1
2
3
4
5
6
7
8
9
10
11
12

class MainAnkoUI<in MainActivity> : AnkoComponent<MainActivity> {
    override fun createView(ui: AnkoContext<MainActivity>) = ui.apply{
        ui.constraintLayout() {
            simpleDraweeView {
                hierarchy=GenericDraweeHierarchyBuilder(resources)
                        .setPlaceholderImage(R.mipmap.ic_launcher)
                        .build()          
            }.lparams(200, 200)
                    .setImageURI("Http://******")
        }
    }.view
}

结语

第一篇就这样吧，写短一点。