theme: vuepress highlight: androidstudio

1. 前言

Kotlin 是一門對 DSL 友好的語言，它的許多語法特性有助於 DSL 的打造，提升特定場景下程式碼的可讀性和安全性。本文將帶你瞭解 Kotlin DSL 的一般實現步驟，以及如何通過 @DslMarker ， Context Receivers 等特性提升 DSL 的易用性。

2. 什麼是 DSL？

DSL 全稱是 Domain Specific Language，即領域特定語言。顧名思義 DSL 是用來專門解決某一特定問題的語言，比如我們常見的 SQL 或者正則表示式等，DSL 沒有通用程式語言（Java、Kotlin等）那麼萬能，但是在特定問題的解決上更高效。

創作一套全新新語言的成本很高，所以很多時候我們可以基於已有的通用程式語言打造自己的 DSL，比如日常開發中我們將常見到 gradle 指令碼 ，其本質就是來自 Groovy 的一套 DSL：

groovy android { compileSdkVersion 28 defaultConfig { applicationId "com.my.app" minSdkVersion 24 targetSdkVersion 30 versionCode 1 versionName "1.0" testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro' } } } build.gradle 中我們可以用大括號表現層級結構，使用鍵值對的形式設定引數，沒有多餘的程式符號，非常直觀。如果將其還原成標準的 Groovy 語法則變成下面這樣，是下面這樣，在可讀性上的好壞立判：

groovy Android(30, DefaultConfig("com.my.app", 24, 30, 1, "1.0", "android.support.test.runner.AndroidJUnitRunner" ) ), BuildTypes( Release(false, getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro' ) ) 除了 Groovy，Kotlin 也非常適合 DSL 的書寫，正因如此 Gradle 開始推薦使用 kts 替代 gradle，其實就是利用了 Kotlin 優秀的 DSL 特性。

3. Kotlin DSL 及其優勢

Kotlin 是 Android 的主要程式語言，因此我們可以在 Android 開發中發揮其 DSL 優勢，提升特定場景下的開發效率。例如 Compose 的 UI 程式碼就是一個很好的示範，它藉助 DSL 讓 Kotlin 程式碼具有了不輸於 XML 的表現力，同時還兼顧了型別安全，提升了 UI 開發效率。

普通的 Android View 也可以使用 DSL 進行描述。下面是一個簡單的 UI 佈局，左邊是其對應的 XML 程式碼，右邊是我們為其設計的 Kotlin DSL 程式碼

|XML|DSL| |:--:|:--:| |||

通過對比可以看到 Kotin DSL 有諸多好處： - 有著近似 XML 的結構化表現力 - 較少的字串，更多的強型別，更安全 - 可提取 linearLayoutParams 這樣的物件方便複用 - 在佈局中同步嵌入 onClick 等事件處理 - 如需要還可以嵌入 if ，for 這樣的控制語句

倘若沒有 DSL ，我們想借助 Kotlin 達到上述好處，程式碼可能是下面這樣的： ```kotlin LinearLayout(context).apply { addView(ImageView(context).apply { image = context.getDrawable(R.drawable.avatar) }, LinearLayout.LayoutParams(context, null).apply {...})

addView(LinearLayout(context).apply { 
    ...
}, LinearLayout.LayoutParams(context,null).apply {...})

addView(Button(context).apply { 
    setOnClickListener { 
        ...
    }
}, LinearLayout.LayoutParams(0,0).apply {...})

} `` 雖然程式碼已經藉助apply` 等作用域函式進行了優化，但寫起來仍然很繁瑣，這樣的程式碼是完全無法替代 XML 的。

接下來，本文帶大家看看上述 DSL 是如何實現的，以及更進一步的優化技巧

4. Kotlin 如何實現 DSL

4.1 高階函式實現大括號呼叫

常見的 DSL 都會用大括號來表現層級。Kotlin 的高階函式允許指定一個 lambda 型別的引數，且當 lambda 位於引數列表的最後位置時可以脫離圓括號，滿足 DSL 中的大括號語法要求。

我們知道了實現大括號語法的核心就是將物件建立及初始化邏輯封裝成帶有尾 lambda 的高階函式中，我們按照這個思路改造下面程式碼

kotlin LinearLayout(context).apply { orientation = LinearLayout.HORIZONTAL addView(ImageView(context)) } 我們為 LinearLayout 的建立定義一個高階函式，根據預設的 orientation 命名為 HorizontalLayout 以提高可讀性。另外我們模仿 Compose 的風格使用首字母大寫，讓 DSL 節點更具辨識度

kotlin fun HorizontalLayout(context: Context, init: (LinearLayout) -> Unit) : LinearLayout { return LinearLayout(context).apply { orientation = LinearLayout.HORIZONTAL init(this) } } 引數 init 是一個尾 lambda，傳入剛建立的 LinearLayout 物件，便於我們在大括號中為其進行初始化。我們為 ImageView 也定義類似的高階函式後，呼叫效果如下：

kotlin HorizontalLayout(context) { ... it.addView(ImageView(context) { ... }) }

雖然避免了 apply 的出現，但是效果仍然差強人意。

4.2 通過 Receiver 傳遞上下文

前面經高階函式轉化後的 DSL 中大括號內必須藉助 it 進行初始化，而且 addView 的出現也難言優雅。 首先，我們可以將 lambda 的引數改為 Receiver，大括號中對 it 的引用可以變為 this 並直接省略：

kotlin fun HorizontalLayout(context: Context, init: LinearLayout.() -> Unit) : LinearLayout { return LinearLayout(context).apply { orientation = LinearLayout.HORIZONTAL init() } }

其次，我們如果能將 addView 隱藏到 ImageView 內部程式碼會更加簡潔，這需要 ImageView 持有它的父 View 的引用，我們可以將引數 context 換成 ViewGroup

kotlin fun ImageView(parent: ViewGroup, init: ImageView.() -> Unit) { parent.addView(ImageView(parent.context).apply(init)) }

由於不再需要返回例項給父 View，返回值也可以改為 Unit 了。

按照前面引數轉 Receiver 的思路，我們可以進一步上 ImageView 的 parent 引數提到 Receiver 的位置，實際就是改成 ViewGroup 的擴充套件函式：

kotlin fun ViewGroup.ImageView(init: ImageView.() -> Unit) { addView(ImageView(context).apply(init)) }

經過上面優化，DSL 中寫 ImageView 時無需再傳遞引數 context，而且大括號中也不會出現 it

kotlin HorizontalLayout { ... ImageView { ... } }

4.3 擴充套件函式優化程式碼風格

View 的固有方法簽名都是為命令式語句設計的，不符合 DSL 的程式碼風格，此時可以藉助 Kotlin 的擴充套件函式進行重新定義。

那麼什麼是 DSL 應該有的程式碼風格? 雖然不同功能的 DSL 不能一概而論，但是它們大都是偏向於對結構的靜態描述，所以應該避免出現命令式的命名風格。

kotlin fun View.onClick(l: (v: View) -> Unit) { setOnClickListener(l) } 比如上面這樣，通過擴充套件函式使用 onClick 優化 setOnClickListener 命名，而且引數中使用函式型別替代了原有的 OnClickListener 介面型別，在 DSL 寫起來更簡單。由於 OnClickListener 是一個 SAM 介面，所以優勢不夠明顯。下面的例子可能更能說明問題。

如果想在 DSL 中呼叫 TextView 的 addTextChangedListener 方法，寫法上將非常冗餘：

```kotlin TextView { addTextChangedListener( object : TextWatcher { override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) { ... }

    override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
        ...
    }

    override fun afterTextChanged(s: Editable?) {
        ...
    }
})

`` 為TextView` 新增適合 DSL 的擴充套件函式：

```kotlin fun TextView.textChangedListener(init: _TextWatcher.() -> Unit) { val listener = _TextWatcher() listener.init() addTextChangedListener(listener) }

class _TextWatcher : android.text.TextWatcher {

private var _onTextChanged: ((CharSequence?, Int, Int, Int) -> Unit)? = null
override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
    _onTextChanged?.invoke(s, start, before, count)
}
fun onTextChanged(listener: (CharSequence?, Int, Int, Int) -> Unit) {
    _onTextChanged = listener
}

// beforeTextChanged 和 afterTextChanged 的相關程式碼省略

} ``` DSL 中使用的效果如下，清爽了不少

```kotlin Text { textChangedListener { beforeTextChanged { charSequence, i, i2, i3 -> //... }

    onTextChanged { charSequence, i, i2, i3 ->
        //...
    }

    afterTextChanged {
        //...
    }
}

} ```

5. 進一步優化你的 DSL

經過前面的優化我們的 DSL 基本達到了預期效果，接下來通過更多 Kotlin 的特性讓這套 DSL 更加好用。

5.1 infix 增強可讀性

Kotlin 的中綴函式可以讓函式省略圓點以及圓括號等程式符號，讓語句更自然，進一步提升可讀性。 比如所有的 View 都有 setTag 方法，正常使用如下： kotlin HorizontalLayout { setTag(1,"a") setTag(2,"b") } 我們使用中綴函式來優化 setTag 的呼叫如下:

```kotlin class _Tag(val view: View) { infix fun Int.to(that: B) = view.setTag(this, that) }

VerticalLayout {

    Text("Andy Rubin") {
        textSize = 18.dp
        layoutParams = linearLayoutParams
    }
    Text("American computer programmer") {
        textSize = 14f.dp
        layoutParams = linearLayoutParams
    }

    layoutParams {
        width = dip(0)
        height = MATCH_PARENT
        weight = 1f
        gravity = Grivaty.CENTER
    }
}

Button("Follow") {
    onClick {
       //...
    }
    layoutParams {
        width = 120f.dp
        height = MATCH_PARENT
    }
}

layoutParams = linearLayoutParams