39 lines
1.8 KiB
Plaintext
39 lines
1.8 KiB
Plaintext
// 通用属性绑定：业务 Model 的三个零参只读方法分别计算 rect.width、rect.color 和 label.text。
|
|
// 绑定在目标隐藏时也会更新；两个页面共享同一组 Block，不需要两份模型。
|
|
// width/color/label 是唯一业务来源，绑定计算只读，expand 是显式事件写入入口。
|
|
class Model {
|
|
width: Number
|
|
color: String
|
|
label: String
|
|
// 返回 Number，目标 width 属性同时做类型/尺寸验证。
|
|
function getWidth(self: Model): Number { return self.width }
|
|
// 返回颜色文本；依赖只包含实际读取的模型属性。
|
|
function getColor(self: Model): String { return self.color }
|
|
// 返回当前说明文字，供 TextBlock.text 绑定使用。
|
|
function getLabel(self: Model): String { return self.label }
|
|
// 一个事件同时改三个属性，随后绑定传播，布局与绘制在完整刷新后发布。
|
|
function expand(self: Model, event: Event): Unit {
|
|
self.width = 260
|
|
self.color = "#237A45"
|
|
self.label = "绑定已更新"
|
|
}
|
|
}
|
|
model = Model(120, "#526AC7", "点击更新共享对象")
|
|
rect = RectBlock(120, 40, 8, "#526AC7")
|
|
label = TextBlock("初始化")
|
|
// 保存三个可断开的绑定令牌；令牌不强持有隐藏目标，目标仍需由业务对象图保留。
|
|
widthBinding = rect.bind("width", model.getWidth)
|
|
colorBinding = rect.bind("color", model.getColor)
|
|
labelBinding = label.bind("text", model.getLabel)
|
|
button = Button("更新宽度、颜色和文字")
|
|
clickConnection = button.on("click", model.expand)
|
|
root = Column(24, 16, label, rect, button)
|
|
page = Page()
|
|
page.title = "通用属性绑定"
|
|
page.render(root)
|
|
// 第二页面使用同一根容器，切页只更换 Mount 展示上下文；最后 activate 回第一页面。
|
|
second = Page()
|
|
second.title = "同一组 Block"
|
|
second.render(root)
|
|
page.activate()
|