小楼axure rp教程(三)单选框效果
小楼axure rp教程(三)单选框效果
作者: 小楼一夜听春语
示例原型:点击链接下载
实现目标:
选择任一项,其他项变成非选中状态。这个功能可以通过单选按钮组的设置来实现,这里只是讲一下通过事件动作来实现的思路。
最终效果如下:
实现过程:
1、需要的组件:3个单选框
2、将单选框文字改为:男、女、保密,标签分起个名字比如叫…男、女、保密(标签设置见教程一:http://www.soger.net/35.html)
3、分别设置三个单选框的onclick事件为:如果该单选框被选中的话,其他单选框变为未选中状态;
下图以“男”举例:
条件设置完成后继续
这样就把“男”设置完成了,“女”和“保密”同样进行设置。
点选一下需要默认选中的单选框,让它变成选中状态。
好了,生成原型就能看到想要的效果了。
扩展:把“保密”转换成动态面板,这样做成元件,以后使用时可以通过设置“保密”隐藏或显示,来适应不同的需要。
本文出自 诉客 ▪ 产品经理的心声,转载时请注明出处及相应链接。
本文永久链接: http://www.soger.net/59.html
收藏分享评分
页:
[1]