31 lines
1.8 KiB
Plaintext
31 lines
1.8 KiB
Plaintext
class Actions {
|
|
vertical: ScrollBlock
|
|
horizontal: ScrollBlock
|
|
function down(self: Actions): Unit { self.vertical.mounts().at(0).scrollBy(0, 60) }
|
|
function right(self: Actions): Unit { self.horizontal.mounts().at(0).scrollBy(60, 0) }
|
|
function reset(self: Actions): Unit {
|
|
self.vertical.mounts().at(0).scrollTo(0, 0)
|
|
self.horizontal.mounts().at(0).scrollTo(0, 0)
|
|
}
|
|
function both(self: Actions): Unit { self.vertical.axis = "both" }
|
|
}
|
|
paragraph = TextBlock("这里展示的是同一个 TextBlock。左侧只允许纵向滚动,文字会按照这个 Mount 的实际视口宽度换行;右侧只允许横向滚动,文字保留横向展开。对象的文字和业务状态只有一份,每次展示的约束、几何和滚动位置分别保存。修改滚动轴也会重新测量受影响内容,并将已经不再允许的偏移夹回零。布局传播持续到受影响部分稳定,不会按固定跳数丢弃后续更新。这里展示的是同一个 TextBlock,两个视图可以拥有不同的换行结果。")
|
|
vertical = ScrollBlock(260, 140, paragraph)
|
|
vertical.padding = 8
|
|
vertical.axis = "vertical"
|
|
horizontal = ScrollBlock(260, 140, paragraph)
|
|
horizontal.padding = 8
|
|
horizontal.axis = "horizontal"
|
|
actions = Actions(vertical, horizontal)
|
|
down = Button("向下滚动")
|
|
down.onClick(actions.down)
|
|
right = Button("向右滚动")
|
|
right.onClick(actions.right)
|
|
reset = Button("回到起点")
|
|
reset.onClick(actions.reset)
|
|
both = Button("左侧恢复双轴")
|
|
both.onClick(actions.both)
|
|
page = Page()
|
|
page.title = "滚动轴"
|
|
page.render(Column(24, 16, TextBlock("同一个对象,不同的滚动轴", 2), Row(0, 24, Column(0, 8, TextBlock("vertical"), vertical), Column(0, 8, TextBlock("horizontal"), horizontal)), Row(0, 12, down, right, reset, both)))
|