建议收藏：Axure手机自适应教程( 二 )

4. 得分页制作
这页和开始页很像，只是文字，不一样，所以我们只需要改一下文字，和设置计分=上面的计分文本。
里面只有在玩一次有交互，这里交互有两种做法，一种是将所有的汉堡、鸡翅、可乐、薯条显示，然后移动回最开始的位置，桶也是移动回最开始的位置，然后出发之前知道了的事件，重新开始游戏。
但是我觉得这样做太复杂了，所以我用第二种方法，刷新页面，哈哈哈哈哈哈哈哈。

本文插图
5.自适应的设置
如果想在每一台手机设备，都能看到自适应的效果怎么做呢？
首先的话我们要对外部的动态面板移动到(0,0)的位置。
载入时，设置动态面板的尺寸，宽度=屏幕的宽度，高度=屏幕的高度，锚点在左上角。
然后到桶，桶也是一样，我们要设置他的尺寸，那桶的尺寸怎么设计能，其实他的宽度=窗口的width/原始动态面板的欢度*桶的宽度，高度=窗口的width/原始动态面板的欢度*高度。锚点同样在左上角。然后的话移动桶到中部位置即可，中部位置x=(窗口宽度-桶的宽度)/2 。

本文插图
最后到炸鸡组合，首先也是设置尺寸，和上面桶的方式是一致的，然后移动，移动的话这里的y值要移动到-this.height 。
这样就完成了，完成之后，需要上传到网上，用axshare、axhub、或者大牛都可以，然后生成网址、或者二维码，用手机连接就可以看到手机端的效果了。
那么这期分享就想到这里了，如果大家喜欢的关注一下和收藏文章，谢谢大家。
本文由 @梓贤Vigo 原创发布于人人都是产品经理。未经许可，禁止转载
题图来自 Unsplash ，基于CC0协议