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)))