10+年产品经理聊聊产品、测测产品,产品人交流学习成长平台,按 Ctrl+D 收藏我们
留言板 小程序 交流群 关于我

苏米客

  • 首页
  • AIGC
    • AI最新动态
    • AI学习教程
    • AI工具集合
    • AI产品百科
    • AI编程开发
  • Axure
    • Axure动态
    • Axure教程
  • 产品
    • 用户体验
    • 产品设计
    • 苏米杂谈
  • 资源
    • 产品UI组件库
    • 开源图标库
    • 中后台框架
  • 书单
    • AI书籍
    • 用户体验
    • UI视觉
    • 产品研究
    • 其他类型
  • 下载
    • Axure组件
    • Axure原型
    • 文档报告
    • 素材资源
  • 登录
  • 首页
  • AIGC
    • AI最新动态
    • AI学习教程
    • AI工具集合
    • AI产品百科
    • AI编程开发
  • Axure
    • Axure动态
    • Axure教程
  • 产品
    • 用户体验
    • 产品设计
    • 苏米杂谈
  • 资源
    • 产品UI组件库
    • 开源图标库
    • 中后台框架
  • 书单
    • AI书籍
    • 用户体验
    • UI视觉
    • 产品研究
    • 其他类型
  • 下载
    • Axure组件
    • Axure原型
    • 文档报告
    • 素材资源

Axure RP 教程:元件操作之快速创建单选按钮组或选项组

5月前 746 0

关于Axure RP 9中单选选项组的创建,其应用场景主要包括需要用户从多个选项中选择一个选项的情况,例如:

表单控件:允许用户在多个选项中选择一个,如电话号码是家庭用、手机还是工作用。

导航菜单栏:在顶部或左侧导航栏中,用户可以选择不同的菜单项,但一次只能选择一个。

单选按钮组:在一组单选按钮中,用户只能选择一个按钮。

Tab页签:在Tab页签中,用户可以选择不同的标签页,但一次只能查看一个。

 

接下来我们一起了解下一种更高效快捷的办法来创建一个按钮选项组:

一、单选按钮组

 

1、从元件库拖出三个单选按钮,分别命名,设置第一个默认为选择,同时添加交互动作,如下图所示

Axure RP 9如何快速制作单选按钮组?

相同的办法设置另外两个按钮,需要注意的是,另外按钮不用设置为选中,如下图所示

Axure RP 9如何快速制作单选按钮组?

 

 

以此类推,如果有多个按钮,需要设置多个内容,虽然可以实现,但是数量多的时候较为繁琐,接下来,我们看一个简便的办法

 

二、单选选项组

 

1、从元件库拖出三个单选按钮,分别命名,同时选中,然后在“单选按钮组”中命名组名

Axure RP 9如何快速制作单选按钮组?

2、选择需要默认加载选中的元件,单独设置选中即可

Axure RP 9如何快速制作单选按钮组?

 

我个人使用第二种方式比较多,再多个选项内容时候设置较为方便

 

总结

Axure RP 9中单选选项组的创建主要是为了实现互斥选择的效果,即在一组选项中,用户只能选择一个选项,而其他选项会自动进入非选中状态。这种设置在制作原型时非常有用,尤其是在需要用户进行单一选择的场景中,如表单填写、导航菜单、选项卡控件和手风琴菜单等。通过设置单选选项组,可以确保用户的选择是唯一的,并且界面的反馈是一致和明确的。

声明:本站原创文章文字版权归本站所有,转载务必注明作者和出处;本站转载文章仅仅代表原作者观点,不代表本站立场,图文版权归原作者所有。如有侵权,请联系我们删除。
#Axure RP #Axure RP 9 #Axure RP教程 #选项组 #单选按钮 
收藏 1
推荐阅读
  • Axure RP 教程:Axure中实现多组条件判断情形(Case)的使用和设置
  • axure rp 一款专业的快速原型设计工具
  • Axture元件库教程(二):一键复制Iconfont图标到Axure
  • Axure入门教程:Axure RP键盘快捷键大全
  • Axure RP 教程:Axure 预览与发布生成HTML文件
评论 (0)
请登录后发表评论
分类精选
Axure RP 教程:Axure中实现多组条件判断情形(Case)的使用和设置
1686 9月前
Axure RP 教程:制作滚动字幕效果,文字滚动的动态效果
1612 11月前
Axure RP 教程:Axure中继器的增、删、改、查操作教程
1593 11月前
Axure RP 教程:快速制作页面跳转,Axure RP跳转链接教程
1558 11月前
Axure RP 教程:Axure 预览与发布生成HTML文件
1549 11月前
在Axure RP中快速创建可视化统计图,加载图表元件库 Axhub Charts
1519 11月前
Axure入门教程:将Adobe XD设计导入Axure
1519 11月前
Axure RP 教程:Axure中继器中按钮文字添加页面链接或外链设置方法
1514 11月前
Axture元件库教程(二):一键复制Iconfont图标到Axure
1503 11月前
Axure RP 无法发布预览页面问题?无法正常预览页面怎么办?怎么解决?
1348 11月前

文章目录

关注「苏米客」公众号

订阅推送更及时,手机查看更方便
分类排行
1 Axure PR进阶教程:输入数值控制滑块与拖动滑块动态显示数值交互设计
2 Axure RP 教程:如何导入阿里云Datav地图,实现Axure地图可视化交互效果
3 Axure RP 教程:Axure视频播放功能,高保真原型实现视频交互的详细操作步骤
4 Axure RP 教程:动态面板之表单多级联动效果制作
5 Axure RP 教程:动态面板之Tab标签导航页面切换效果制作
6 Axure RP 教程:动态面板之水平拖动及展开收起如何实现
7 Axure RP 教程:元件操作之快速创建单选按钮组或选项组
8 Axure RP 教程:常用样式之元件样式管理器
9 Axure RP 教程:常用样式之页面样式管理器
10 Axure RP 教程:Axure 支持哪些类型的页面布局,如何创建自定义布局
©2015-2024 苏米客XMSUMI 版权所有 · WWW.XMSUMI.COM 闽ICP备14005900号-6
免费影视APP 花式玩客 免费字体下载 产品经理导航 Axure RP 10 免费Axure模板 Axure原型设计 Axure元件库下载 原创Axure模板 申请友联