一分钟实现弹性按钮页面跳转

1. 画好如下动效草图

在Principle中，我们可以使用简单几步来实现弹性按钮页面跳转。首先，按照我之前的教程【Principle教程】Principle入门如何快速画好动效草图？的步骤，画好以下动效草图。

2. 添加按钮跳转交互

选中绿色按钮，在右边工具栏中找到一个闪电符号的按钮，点击它。然后选择第一个选项"Tap"，这将在按钮上生成一个箭头。接下来，点击第二个界面，表示点击绿色按钮时跳转到第二个界面。

3. 添加返回按钮跳转

同样地，点击第二个界面中的红色按钮，然后再点击第一个界面，表示点击红色按钮时跳转回第一个界面。

4. 查看动画元素

完成以上操作后，点击上方的直线图标，将会显示时间坐标面板，其中记录了所有动画元素。

5. 自动生成过渡动画

在时间坐标面板中，我们可以看到如果名称保持一致，即使属性发生变化，Principle也会自动生成过渡动画。

6. 添加按钮的弹性

为了让按钮具有弹性效果，找到按钮所在图层，在Center Y和Height属性中选择"spring"弹性曲线。

7. 预览效果

将手机连接到电脑上，就可以预览添加了弹性按钮页面跳转的效果了。

结束语

如果你觉得这篇文章对你有帮助，请在下方投票、点赞、关注并留言。小编将定期分享更多有用的内容。你的支持是我们继续努力的动力！谢谢！

版权声明：本文内容由互联网用户自发贡献，本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。