页面入口Pager

大约 1 分钟

页面入口Pager

Pager作为Kuikly页面的入口类,类似AndroidActivityiOSVCKuiklyCore在运行时,根据各个的平台Kuikly容器跳转Kuikly页面时, 传递过来的pageName来找到对应的Pager创建闭包,最后创建对应Pager类。

使用@Page注解注册Pager

当你编写一个Kuikly页面时,你需要新建一个类,然后继承Pager, 接着在新建的类上添加@Page, 将Pager注册到KuiklyCore

@Page("HelloWorld")
internal class HelloWorldPage : Pager() {
    ...
}

实现body方法, 返回UI结构描述

当一个类继承Pager后, 必须要实现的方法为:body方法,body方法用于返回页面UI结构描述的闭包, 然后KuiklyCore根据返回的body方法返回的闭包来创建页面的UI。

@Page("HelloWorld")
internal class HelloWorldPage : Pager() {

    override fun body(): ViewBuilder {
        return {
            attr {
                allCenter()
            }

            Text {
                attr {
                    text("Hello Kuikly")
                    fontSize(14f)
                }
            }
        }
    }
}

在上述代码中,body方法返回了一个Text文本组件,并指定了文本的值和字体大小;同时也指定了Pager中的组件居中布局。 运行以上代码后,你将得到一个居中显示的文本

下一步

Kuikly中的Pager有了基本的了解以后,下一步我们来学习Kuikly页面数据PagerData

上次编辑于: