产品案例_www.kb88.com
Protopie教程:如何制作悬浮按钮
来源:http://www.hnzdjc168.com 作者:www.kb88.com 发布时间:2019-07-08 14:04 浏览量:

  在上图中,我们已经将点击“主按钮”后,3个子按钮(账户、手机、邮箱)展开时的位置排列完成,并且记录下了子按钮的位置坐标。

  由于默认状态下,子按钮时隐藏的(其实就是层位置上处于主按钮下方),我们需要将4个按钮坐标全部修改成一致X:190 / Y:475。

  下一步我们创建动作,选择“主按钮”图层,创建“单击”的触发动作,然后添加“条件”的参数,这里我们条件基准选择“按钮_新增”,类型选择“旋转”,判断选择“=”,并且设置参数值为“0”。

  下一步创建主按钮点击的动效,选择“按钮_新增”图层,添加“旋转”参数,设置“每次旋转”,值为“180”度,旋转方向“顺时针”,意思是每次点击主按钮时,“按钮_新增”元素,顺时针选择180度。

  下一步创建点击主按钮后,亚美娱乐官网!子按钮的移动动效,依次选择3个子按钮,分别为3个按钮添加“移动”的参数,并且将参数值设置为:账户(X:115 / Y:439)、手机(X:197 / Y:409)、邮箱(X:262 / Y:439)。

  在“单击”的触发动作下,添加新的“条件”的参数,这里我们条件基准依然选择“按钮_新增”,类型选择“旋转”,判断选择“=”,并且设置参数值为“180”。

  这里设置180的意思表示:当“按钮_新增”这个元素当前旋转值为180时,调用下方的动作。

  接着我们选择“按钮_新增”图层,添加“旋转”参数,设置“每次旋转”,值为“180”度,旋转方向“逆时针”,意思是每次点击主按钮时,“按钮_新增”元素,逆时针选择180度。

  然后依次对3个子菜单添加“移动”的参数,并且将移动后的值设置为X:190 / Y:475。

  本文由 @ZQZ原型师 原创发布于人人都是产品经理,未经许可,禁止转载。

  人人都是产品经理(是以产品经理、校园招聘(一六三)——兖州中材建设有限公司。运营为核心的学习、交流、分享平台,集媒体、培训、社群为一体,全方位服务产品人和运营人,成立8年举办在线+期,线+场,产品经理大会、运营大会20+场,覆盖北上广深杭成都等15个城市,在行业有较高的影响力和知名度。平台聚集了众多BAT美团京东滴滴360小米网易等知名互联网公司产品总监和运营总监,他们在这里与你一起成长。


  • 电话:
  • 传真:
  • 邮编:
  • 地址:凯时娱乐网址制造公司
Copyright © 2013 www.kb88.com,凯时娱乐网址,kb88com凯时娱乐,凯时娱乐手机版 All Rights Reserved 网站地图