原型的固定和滚动

溢出行为

在制作原型时，可以通过为容器设置溢出行为来实现演示时的滚动效果。通过选取不同的滚动方式，可以实现纵向列表、横向列表、照片墙或互动地图等交互效果，构建出更复杂或更高保真度的原型。

当容器中有元素超出了容器所框选的范围时，在原型模式下选中该容器，则可在右侧属性面板中的“溢出行为”栏进行设置，以便展示滚动效果。

“溢出行为”包含“无滚动”、“水平滚动”、“垂直滚动”、“水平 & 垂直滚动” 4 个选项，默认选项为“无滚动”。

在演示长设计稿时，使用演示滚动时位置固定的功能，可以规定某个元素在页面滚动时位置不跟随页面发生变化，来模拟“吸顶”或“吸底”效果。

约束的方向决定了元素固定的参照方向。在设计模式下，选中要固定的元素，在确定了需要固定的元素的约束方向后，在右侧属性面板的「约束」栏中，勾选“演示滚动时位置固定”即可。（如下图中 A 所示）

此时在左侧图层面板，会多出“固定内容”与“滚动内容”两个分组，该元素会被归入“固定内容”分组。（如下图中 B 所示）

通过上述步骤，我们已经为元素设置好了位置固定，接下来在进行原型演示时，就可以看到即使整体页面滚动，但设置了位置固定的元素依然可以保持位置不变。

👉本篇文章对你是否有帮助？👍🏻 有帮助 👎🏻 无帮助，我们期待着你的反馈。