APP Splash效果 获赏10金币 案例教程 基础教程

leeyun 普通用户 2019-12-5 3277

APP启动引导页的动效实现


效果说明:

左右滑动,可以实现页面之间附带动效的流畅切换。


知识点:

1、动态面板操作:左右拖动、切换效果

2、元件的移动

3、隐藏和显示元件

4、条件判断


实现步骤:

1、4个页面的布局

2、将4个页面进行整合,形成一个动态面板 (4个状态,每个状态一张图)


3、首先我们需要对每个面板中需要添加效果的元件进行命名(这里我截了第一页的两个需要处理动效的元件,其他3个同样命名)

4、接下来需要对动态面板的用例进行设置条件和动作配置,“向左拖动结束时”“向右拖动结束时”


5、配置交互用例


朋友们注意下:上面两个用例中需要注意文字移动时间和logo移动的时间需要有时差,这样看起来移动动画才会比较自然流畅,否则移动时间和速度都一致看起来就没那么好的 效果了。


最后附上RP文件,互相交流,多多指教。谢谢大家。



上传的附件:
登录后回复
打赏排行 用户名 打赏金额
第1名 沈十三 10金币
最新回复 (33)
  • yujiabian 普通用户 8月前
    0 引用 34
    6666
  • 尹木 普通用户 2022-6-18
    0 引用 33
  • 尹木 普通用户 2022-6-18
    0 引用 32
  • pandakill 普通用户 2022-6-16
    0 引用 31
    感谢
  • 18809860773 普通用户 2022-4-23
    0 引用 30
    1
  • 发发发发 普通用户 2021-8-20
    0 引用 29
    感谢分享
  • wowo 普通用户 2021-6-21
    0 引用 28
    感谢
  • lxy1120 普通用户 2020-9-28
    0 引用 27
    感谢
  • 飞奔的母猪 普通用户 2020-9-15
    0 引用 26
    感谢分享
  • 柒月喵 普通用户 2020-8-27
    0 引用 25
    学到了
  • 치즈치즈 普通用户 2020-8-14
    0 引用 24
    赞赞赞
  • 宸枫 普通用户 2020-8-14
    0 引用 23
    感谢分享
  • 一路向南 普通用户 2020-8-3
    0 引用 22
    谢谢
  • 墨客 普通用户 2020-7-16
    0 引用 21
    感谢分享
  • itcc 普通用户 2020-7-8
    0 引用 20
    感谢分享
  • Dwan. 普通用户 2020-7-7
    0 引用 19
    1
  • agstarpm 普通用户 2020-7-6
    0 引用 18
    感谢分享
  • Fafa_xxhh 普通用户 2020-7-6
    0 引用 17
    感谢分享
  • ylfang 普通用户 2020-7-6
    0 引用 16
    太棒了,学习
  • meihao 普通用户 2020-7-6
    0 引用 15
    感谢分享
  • wh104112 普通用户 2020-6-29
    0 引用 14
    66666666666666666666666
  • 宸枫 普通用户 2020-6-27
    0 引用 13
    感谢分享
  • water8712 普通用户 2020-6-24
    0 引用 12
    最后附上RP文件,互相交流,多多指教。谢谢大家。
  • 乘槎海客 普通用户 2020-6-23
    0 引用 11
    感谢分享
  • Serendipity° 普通用户 2020-6-19
    0 引用 10
    感谢感谢
  • ICEJOE 普通用户 2020-4-16
    0 引用 9
    感谢分享
  • Demon_1586777772 普通用户 2020-4-13
    0 引用 8
    感谢分享
  • wangarthur 普通用户 2020-3-17
    0 引用 7
    感谢感谢
  • 笨笨狐 普通用户 2020-3-14
    0 引用 6
    感谢分享
  • 真以航(熊岳南京) 普通用户 2020-3-10
    0 引用 5
    感谢分享
  • 小草莓 普通用户 2020-2-29
    0 引用 4
    感谢
  • Beck_1577503406 普通用户 2019-12-28
    0 引用 3
    感谢分享
  • 沈十三 管理员 2019-12-6
    0 引用 2
    感谢分享,已获得10金币奖励!
返回