03年3月
最新的Atomic.io更新包含可滚动容器
几个月前， 我展示了如何使用atomic.io来运动原型 。 我在这篇文章中提出的一个关键点是“展示动作”，而不是将其留给客户或团队的想象力，这一点非常重要。 事实上，这已经变得如此重要，以至于现场出现了全新的UX / UI工具类别。 它们包括 - Apple Keynote，Adobe的Edge Animate，After Effects和UXPin等等。 这个块上的新手是Atomic.io，当我第一次写这个产品的时候，它是在公测版本中。
关于开放测试的好处是，他们可以让软件制造商有机会收集用户对功能集的反馈，包括缺少的功能，然后将它们添加到应用程序中，并在商业版发布前进行测试。 在原子的情况下，我真的错过了一个功能是能够垂直或水平滚动内容。 这可能包括卡片，幻灯片或实际上用户在应用程序或网站界面范围内滑动或拖动的任何内容。
这一定是很多用户所要求的主题，因为可滚动容器本月才引入到应用程序中，我不得不承认，在原型中创建可滚动内容很简单，无法启用。
就是这样…
02 03
如何在原子中创建垂直滚动内容
您需要先注册30天的免费试用版，并在该期限结束时向您提供三种定价计划。
首先你需要知道的是，你将要做的所有工作都是在浏览器中进行的，并且该应用程序严格针对Google Chrome。 登录后，您将进入“ 项目”页面。 要打开该应用，请点击新建项目按钮 。
当界面出现时，您会看到工具数量有限，可以将页面和图层添加到页面，美工板以及右侧的上下文敏感属性面板。
在这个例子中，我开始使用iPhone 5的预设为320 x 568。然后打开包含要滚动图像的文件夹并将它们拖到画布上。 它们被自动添加到项目中，如果单击图层选项卡，则可以看到它们位于单独的图层上 。 然后我选择箭头工具（选择），选择一个图像并将其拖到一个新位置，以便在它们之间添加一些空间。 然后我选择了所有的图像并单击工具栏上的垂直分布按钮 。 这使图像均匀分布。
下一步是选择要滚动的所有内容，并单击“容器”按钮或从“组”按钮中选择“创建滚动容器”按钮 。 一旦容器被创建 - 您将在“层”面板中看到它 - 单击容器并将底部手柄向上拖动到画布底部 。 点击属性面板底部的预览按钮 ，这将启动一个浏览器窗口。 使用鼠标的滚轮来滚动内容。 要返回到您的项目， 请单击浏览器窗口右下角的编辑按钮 。
03年03月
如何在原子中创建水平滚动内容
水平滚动同样容易完成。
在这种情况下，将一系列图像拖放到画布上，并将它们相互对接。 选择图像后，我点击顶部对齐按钮确保它们全部对齐。
然后，我按住Shift键并选择“图层”面板中的每个图层。 选择图像后，我单击Container按钮 ，然后在“属性”面板中的“行为”区域中选择“水平 ”。
然后我通过单击预览按钮在浏览器窗口中测试该项目。
尽管我已经展示了如何创建垂直和水平滚动的各个版本，但只要将可滚动内容放入容器中，就可以将这些容器放在屏幕的不同区域中。 例如，网页可以在侧面菜单中垂直滚动内容，并在同一页面上以幻灯片方式水平滚动内容。 事实上，一个容器可以同时具有垂直和水平滚动条目，例如具有十几个缩略图的图像选择器。
要在atomic.io中了解更多关于此功能的信息，请查看：
- 博客公告
- 滚动容器教程
- 使用容器掩蔽
- 滚动容器疑难解答