Axure教程:突发奇想的“菜单转盘”

2020-02-22
[摘要]

之前中午和同事一直在纠结吃什么,突发奇想想到了转盘抽奖的模式做一个“转盘选餐”的原型图,大家仅供参考。结果图如下所示:设计思路:设计一个圆盘做为底盘;增加“抽奖”按钮及旋转指针。预计实现效果:点击“抽奖”按钮,触发底盘旋... […]

之前中午和同事一αν直在纠结吃什么,突发奇想想♦到∶了转盘抽奖的模式做一个“转盘选餐”的原型图,大家仅供参考。

结果图如下所示の:

设计思路:

设计一个圆盘做为底盘; 增加“抽奖”按⿷钮及旋转指针。

预计实现效◢果:点击▫“抽奖”按钮,触『发底Σ盘旋转,大ю约2s后底盘停止┌转动,指针所在‥区域即为选中Φ结果。

涉及内容:旋转、随机函数(∏randκom())。╨

首先,利用“圆※⿱”、“垂直线”和“文本框”绘制一个转盘底盘组∠合;如图所示:

接着,在底盘上加指针及触发按钮“∝抽奖”,并对“抽奖”按钮】设置“鼠标单击时”事件,选择“旋转”勾选转盘η组合。

设置旋转方向为б顺时针旋转为&“相对位置(by)”,若是“绝对位ↀ┖置(to)”则抽奖┗转盘转完后,再次单击ぷ则无法¤实现随╤机抽奖转动;

设置角度,由于需要抽奖Ψ单击随机,所以此@处我们需要使用到■函≌数[[100000≥+random()√*360]]

Ъ

最后保๑★存并点击浏览即可,≈一个简单的小交互就实现了。

交互的rp文件,朋友们可以下载查看详情◣:https://pan.Эbaidu.△com/s/14KDGnuMjE○OJm◆kRtY5dRHbQ

&nbs◄p;

本文由 @产品小└白白 原╱╲创发布于人人都是产品经理。未经许可,禁止转载

题图来自Unsplash,基于CC0协议

声明:凡注明“本站原创”的所有文字图片等资料,版权均属 推广赚钱的靠谱项目_推广赚钱的平台_推广赚钱软件哪个好所有,欢迎转载,但务请注明出处;
这30件事情,移动端设计需要注意 《美国医学会杂志》:研究显示美国医保公司数据成黑客首选“猎物”
Top