算譜王におれはなる!!!!

偏りはあると思うけど情報技術全般についてマイペースに書くよ。

#Kotlin 向けAndroidライブラリ #Anko のレイアウト組むやつこんな感じに使ってみるとよさげ?

AnkoというKotlin向けAndroidライブラリがあります。 JetBrainsが開発しています。 先日、公式ブログでもアナウンスがありました。

blog.jetbrains.com

面白くて便利なAPIが揃っていますが、目玉機能はUIレイアウトを構築するDSLでしょう。 このDSLはKotlinコードなわけですが、型安全、NULL安全で宣言的に記述できるのが気持ちいいです。 詳しい説明は上記ブログか、Githubのページをご覧ください。

で、本題です。 サンプルコードを見るとActivityonCreateの中でDSLをもりもり記述してレイアウトを組んでいます*1Activityが肥大化して見通し悪くなったりとか心配してしまいます。 そこで、こんな使い方どうだろ〜ということで考えてみました。

例えばこんなobjectを定義して

object MainActivityViews {

    class Views(val usernameEditText: EditText, val signUpButton: Button)

    fun setup(activity: Activity, afterViews: Views.() -> Unit): View {
        var usernameEditText: EditText? = null
        var signUpButton: Button? = null

        // ここでレイアウト組む
        return with(activity) {
            verticalLayout {
                padding = dip(16)

                usernameEditText = editText {
                    hint = "Username"
                }
                signUpButton = button("Sign up")
            }
        } let {
            Views(usernameEditText!!, signUpButton!!).afterViews()
            it
        }
    }
}

こう使う。

public class MainActivity : Activity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        MainActivityViews.setup(this) {
            // この中は上記Viewsクラスの拡張メソッドになっているのでsignUpButtonなどが見れる
            signUpButton.onClick {
                usernameEditText.text?.let { toast(it) }
            }
        }
    }
}

レイアウトを組むのはActivityとは違う場所でやって、各部品に名前を付けてActivity側で参照できるようにしてあげると。 まだがっつりAnkoを触ったわけではないので、もっといい方法はいくらでもありそうなんですが、、面白いアイデアあったら教えてください。

追記

重要なこと書くの忘れてた。

「Anko DSL Preview」というIntelliJAndroid Studioプラグインがあって、Anko DSLで構築したレイアウトのプレビューを確認することができます!

*1:サンプルなのでノイズを省いてシンプルにするためでしょうが。。