Kotlin Android UI利器之Anko Layouts

引言

前段时间写了一篇Kotlin语法入门的文章，还没有看过的盆友请戳(这里)，有的可能看完之后已经开始尝试用kotlin来写代码了。不过上篇体现的仅仅是针对于Kotlin相较于Java在用法上的扩展性以及写法上的简洁性，那么Android中还有另一个重要的组成部分，布局文件呢？接下来我们就继续看一下Anko（基于Kotlin的扩展库）对于Android传统布局文件XML做的改进及优化，以及工作原理。

定义

Anko是Kotlin为Android推出的第三方库，旨在提升Android界面的开发效率，使代码更简洁易懂并更容易阅读。Anko总共分为以下四个部分：

• Anko Commons: 轻量级类库包括intent，dialog，logging等帮助类
• Anko Layouts：快速的空安全的方式来写动态的布局
• Anko SQLite：关于Android SQLite查询语句DSL和容器解析器
• Anko Coroutines：Coroutines提供了一种长时间阻塞线程的解决方案，并且代之以开销更小和更可控的操作(suspension of a coroutine)

我们可以看到，Anko不仅仅可以用来写布局，更加可以做一些基础支持工具，比如操作数据库，用Intent进行数据传递等等，本文着重探讨的是Anko Layouts这一部分。

优势

• Anko可以让我们在源码中写UI布局，严格的编译检查可以保证类型安全，不会出现类型转换异常
• 没有多余的CPU开销来解析XML文件
• 我们可以把Anko DSL约束放在函数中，提高代码复用率，比原有xml的include更强大

用法

如下，是应用中的关于我们界面布局文件:

由于布局非常简单，就不多解释了，那么如果将上述布局用Anko来写如下所示：

 verticalLayout {
                verticalLayout {
                    backgroundResource = R.mipmap.setting_about_us_bg
                    setGravity(Gravity.CENTER_HORIZONTAL)
                    imageView {
                        backgroundResource = R.mipmap.setting_about_us_logo_ic
                    }.lparams(width = wrapContent, height = wrapContent){
                        topMargin = dip(114)
                    }

                    mTvVersion = textView{
                        textSize = 14f
                        textColor = R.color.yx_text_desc
                    }.lparams(width = wrapContent, height = wrapContent){
                        topMargin = dip(9)
                        bottomMargin = dip(186)
                    }

                    verticalLayout {
                        setGravity(Gravity.CENTER_HORIZONTAL)
                        textView{
                            text = ResourcesUtil.getString(R.string.about_check_update)
                            textSize = 14f
                            backgroundResource = R.drawable.selector_about_us_btn_bg
                            textColor = R.color.yx_text_desc
                            gravity = Gravity.CENTER
                        }.lparams(width = dip(127), height = dip(36)){
                            bottomMargin = dip(20)
                        }
                        textView{
                            text = ResourcesUtil.getString(R.string.private_rights)
                            textSize = 14f
                            backgroundResource = R.drawable.selector_about_us_btn_bg
                            textColor = R.color.yx_text_desc
                            gravity = Gravity.CENTER
                        }.lparams(width = dip(127), height = dip(36)){
                        }

                        view().lpara