滚动与分页使用场景
了解如何在常见场景中高效使用滚动和分页。探索如何为移动端和桌面端应用创建纵向和横向滚动视图。掌握正确配置滚动属性的方法,并为与滚动相关的交互选择合适的触发器和响应。
亲自体验这些原型并下载它们,以查看其交互方式。此外,浏览我们的教程,了解创建每个原型背后的分步流程。
找到你需要的使用场景。
浏览社交媒体应用
消息应用中的纵向滚动
循环滚动轮播
滚轮选择器
从中间开始的滚动与分页
无限分页滚动
浏览社交媒体应用
如同如今大多数社交媒体应用的工作方式一样,你可以创建横向和纵向滚动来浏览不同的个人资料和照片。了解如何为滚动视图添加边距,以保持与你的应用类似的 UI(滚动末尾留有空白)。

学习如何分步创建此原型。
消息应用中的纵向滚动
在消息应用或电子邮件收件箱中上下滚动以查看消息。创建一个滚动容器,并学习如何设置自定义的初始滚动位置(例如从底部开始)。

学习如何分步创建此原型。
循环滚动轮播
像在线购物网站或视频流媒体平台上的图片画廊一样,你可以创建幻灯片。了解如何使用 分页容器来制作轮播视图,以及如何在滚动时使用变量交替图片名称。

学习如何分步创建此原型。
滚轮选择器
创建你自己的滚轮选择器来选择日期、时间等。滚轮选择器可让你非常快速地上下滚动浏览多个选项。它尤其在选项列表可能超出屏幕可用空间、无法完整显示时非常有用。

学习如何分步创建此原型。
从中间开始的滚动与分页
让你的页面从中间向左和向右两侧滚动。了解如何设置正确的容器属性来实现这一点。

学习如何分步创建此原型。
无限分页滚动
让你的页面在两个方向上无限滚动。了解如何使用分页容器对页面进行分组,以及如何使用范围触发器来启用无限滚动。

学习如何分步创建此原型。