如何在Fragment中使用Anko DSL？

Question

这个Github wiki页面上展示了一个在Activity实例中使用的例子：

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)

    verticalLayout {
        padding = dip(30)
        editText {
            hint = "Name"
            textSize = 24f
        }
        editText {
            hint = "Password"
            textSize = 24f
        }
        button("Login") {
            textSize = 26f
        }
    }
}

如何在Fragment中完成相同的操作？

我尝试将verticalLayout块放在onCreateView中，但该方法无法解析。我已经添加了anko-support-v4依赖项，但仍然没有成功。

- akhy

---

尝试导航到verticalLayout方法。我猜它是在Activity上定义的，所以它只能在其中运行，而不能在外部运行。 - voddan

如果我说的是真的，那么解决方案就是尝试将布局分配给适当的属性。在你的示例中，它有点悬而未决。 - voddan

@voddan 是的，它只能在Activity中使用。最终，我找到了一种解决方法，很快会发布答案。 - akhy

Answer 1

使用 Anko 0.8 版本您也可以使用 AnkoComponent，如果您想将 UI 存储在单独的类中以便在其他地方重用。

class FragmentUi<T>: AnkoComponent<T> {
    override fun createView(ui: AnkoContext<T>) = with(ui) {
        verticalLayout {
            // ...
        }
    }
}

您可以在片段的onCreateView()中调用它：

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup, savedInstanceState: Bundle?): View
        = FragmentUi<Fragment>().createView(AnkoContext.create(ctx, this))

- RussHWolf

---

AnkoContext.create(ctx, this) is deprecated. instead of ctx one should use requireContext() - LeoColman

Answer 2

经过查找anko-support-v4源代码和一些尝试，我找到了一个解决方法，但我不确定它是否是正确/推荐的方法。它似乎有点未记录。

我Fragment代码中的一个示例：

override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?, savedInstanceState: Bundle?): View? {

    return UI {
        verticalLayout {
            linearLayout {
                avatar = imageView().lparams(width = dip(48), height = dip (48))
                name = textView().lparams(width = 0, weight = 1f)
            }

            linearLayout {
                // ...
            }
        }
    }.toView()
} 

我在Fragment.onCreateView(...)中返回用UI { ... }.toView()封装的布局DSL。

- akhy

---

我建议你在 Slack 频道的 #anko 线程上询问有关 API 的预期用途的更多信息：http://kotlinslackin.herokuapp.com/。因为对我来说，这种不一致性似乎像是一个 bug，但那里的人肯定知道。 - voddan

是的，对于当前版本的Anko（0.7.3），这是正确的方法。 - yanex

@netimen 只需返回 UI{}.view。 - Eefret

Answer 3

从anko 0.8.1版本开始，正确的代码应该是：

override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?, savedInstanceState: Bundle?): View? {
    return UI {
        verticalLayout {
            linearLayout {
                // ...
            }
            linearLayout {
                // ...
            }
        }
    }.view
} 

- Eefret

---

当删除LayoutInflater中的问号时，它表示它想要它。 - Qube