小楼axure rp教程(三)单选框效果

AxureRP6.5教程 小楼一夜听春语 22439℃ 0评论

示例原型:点击链接下载

实现目标:

选择任一项,其他项变成非选中状态。这个功能可以通过单选按钮组的设置来实现,这里只是讲一下通过事件动作来实现的思路。

最终效果如下:

gaollg0

实现过程:

1、  需要的组件:3个单选框

2、  将单选框文字改为:男、女、保密,标签分起个名字比如叫…男、女、保密(标签设置见教程一:http://www.iaxure.com/35.html

3、  分别设置三个单选框的onclick事件为:如果该单选框被选中的话,其他单选框变为未选中状态;

下图以“男”举例:(点击图片可看大图)

1

条件设置完成后继续

2

这样就把“男”设置完成了,“女”和“保密”同样进行设置。

点选一下需要默认选中的单选框,让它变成选中状态。

好了,生成原型就能看到想要的效果了。

 

扩展:把“保密”转换成动态面板,这样做成元件,以后使用时可以通过设置“保密”隐藏或显示,来适应不同的需要。

 

 

 

 

 

 

 


~~~~~~~~~~~~ 正文结束 下面没了 ~~~~~~~~~~~~

小楼老师全新打造Axure RP 9精品课程,以独有的教学方法与技巧,帮助你以最短的时间高效的完成学习目标。

《Axure RP 9 萌新修炼视频》-----从零入门进阶的优质课程------【点此查看详情】


转载请注明:Axure原创教程网 » 小楼axure rp教程(三)单选框效果

喜欢 (3)or分享 (0)
头像
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(3)个小伙伴在吐槽
  1. 头像
    什么乱七八糟的,只需要设置组名称为一样的就行了,误人子弟
    一个傻X2019-08-19 14:07 回复
    • 小楼一夜听春语
      你要是瞎,我也没办法!原文“选择任一项,其他项变成非选中状态。这个功能可以通过单选按钮组的设置来实现,这里只是讲一下通过事件动作来实现的思路。 ”。
      小楼一夜听春语2019-08-21 09:49 回复
      • 头像
        老师,你看他名字呀,你跟他认真你就输了。哈哈哈! :mrgreen:
        小白一枚2019-09-17 22:46 回复