.

16.滑动长图(重力感应)

WU发表于:2015年03月25日 16:17:57更新于:2019年07月19日 15:48:51

一、案例效果

上下旋转手机,画面跟随移动

0015cb837224a85d54acae8d8b5de16


二、素材准备

准备足够长的长图片,建议宽度为画布外框尺寸或者内框尺寸。

文末附件下载素材,非商用,仅供学习使用。


三、功能用法

1.点击编辑器右上角的页面切换,进入Layer页面

0015cb82d814dacb58bbdc64b6d10dc


2.切换到layer页面后,会默认有一个layer页面,我们可以直接在这个页面添加素材。

0015cb82ea78843d360240c3c45b1b7


3.点击图片素材,我们要添加一张长图

0015cb82ef865a3fdc12c0cf37c2a7b


4.选中要添加的素材点击添加标志添加素材,注意:过大的图需要在PS里切图上传,单张图尺寸不要超过300KB。

0015cb82d24f11e0ed51cb4292d517b


5.根据自己所需调整图片尺寸,调整layer画布尺寸。

0015cb831622a88a1386776be22ddfd


6.让图片跟画布重合,调整好位置,切换回到页面中。

0015cb831c1c2fdda8c5809b9376e9b


7.在页面界面的工具栏中,在“高级组件”的组件菜单中,点击添加Layer容器组件

blob.png


8.在弹出的layer素材窗中,找到之前所做的Layer页内容,点击插入到页面中。

blob.png

9.调整Layer容器组件的位置和大小

0015cb833f26c786f51d63fba4e282e     

10.调整到这里的时候,可以预览看下,这个时候的layer容器是可以滑动的。如果需要用重力感应去控制长图的滑动,可以勾选一下这里。

0015cb83460711c98a5f1dece3d882c



附件:长图.jpeg • 52.23KB • 下载

回复(2)