原型设计工具Axure RP参考(十九):单选按钮小部件

翻译|使用教程|编辑:况鱼杰|2020-12-21 14:28:39.037|阅读 545 次

概述:单选按钮是一个表单控件,它允许用户从多个选项中选择一个。例如,如果用户被要求输入一个电话号码,他们可以从一组单选按钮中选择一个号码,以表明该号码是用于家庭、工作还是手机。单选按钮小部件位于默认小部件库的表单部分。

# 31款JAVA开发必备控件和工具 # 热门开发工具JetBrains系列产品限时优惠中>>

相关链接:

Axure RP是一套专门为网站或应用程序所设计的快速原型设计工具, 可以让应用网站策划人员或网站功能界面设计师更加快速方便的建立Web AP和Website的线框图、流程图、原型和规格。

免费下载Axure RP 优惠购买Axure RP


单选按钮是一个表单控件,它允许用户从多个选项中选择一个。例如,如果用户被要求输入一个电话号码,他们可以从一组单选按钮中选择一个号码,以表明该号码是用于家庭、工作还是手机。单选按钮小部件位于默认小部件库的表单部分。

无线电组

在大多数设计模式中,选择一个单选按钮将自动取消选择同一组中任何先前选择的单选按钮。在Axure RP中,您可以通过将单选按钮添加到 "单选组 "中来创建一组单选按钮之间的这种关系。

  1. 在画布上或 "轮廓 "窗格中选择一个或多个单选按钮部件。
  2. 在 "交互 "窗格中,在 "指定单选组 "字段中为新的单选组输入一个名称。

  1. 通过选择它们并在 "指定无线电组 "下拉菜单中选择无线电组名称,将更多的单选按钮添加到无线电组中。
  2. 通过选择单选按钮并清除指定无线电组字段的选择,从无线电组中删除单选按钮。

注:删除一个无线电组中的所有单选按钮将删除该组。

按键尺寸和对齐方式

在 "样式 "窗格的 "按钮 "部分,您可以使用 "大小 "字段设置单选按钮的按钮部分的宽度和高度。

默认情况下,单选按钮的按钮部分在左边,而标签文本在右边。要调换顺序,使文字在左边,按钮在右边,请使用尺寸字段右边的对齐图标。

小贴士:当使用从右到左的语言(如阿拉伯语或希伯来语)制作表单原型时,将按钮向右对齐。

编辑标签文本

您可以通过以下任何一个选项编辑单选按钮小组件标签上的文本。

  • 双击按钮标签,进入文本编辑模式。
  • 选择按钮标签,按ENTER键进入文本编辑模式。
  • 右键单击按钮标签,在上下文菜单中选择 "编辑文本"。
  • 选择按钮标签并开始输入。(只有当你禁用了单键快捷键时,此选项才可用)

特殊性能

默认选择

默认情况下,当页面首次在 Web 浏览器中加载时,单选按钮以其未选择状态开始。

要想让单选按钮以选定状态开始,请选择单选按钮并单击画布上的按钮。

您也可以在 "交互 "窗格中选中 "选定 "选项。

禁用

禁用单选按钮可防止用户在网络浏览器中与之交互。这也会激活小组件的 "禁用 "样式效果,使其显示为灰色。

有两种方法可以禁用小组件:

  • 勾选 "交互 "窗格底部的 "已禁用 "复选框。
  • 使用 Enable/Disable 动作在 Web 浏览器中动态禁用小组件。您可以将此作为任何交互的一部分,例如在加载页面或单击按钮时进行。

小贴士:您可以在任何交互的一部分这样做,例如当页面加载或点击按钮时。

您可以使用 Enable/Disable(启用/禁用)操作在 Web 浏览器中动态启用已禁用的小组件。请查看条款和条件教程,了解如何完成此操作。

特殊交互

选择单选按钮

在Web浏览器中,您可以点击单选按钮来选择它。

您也可以通过 "设置已选择/选中 "操作动态地选择单选按钮。真选项将选择单选按钮,假选项将取消选择它。切换选项将把单选按钮设置为与交互发生时它所处状态相反的状态。

捕捉和评估所选状态

您可以通过交互和条件中的is selected of value选项来确定单选按钮是否被选中。如果单选按钮被选中,则返回值 "true",如果单选按钮未被选中,则返回值 "false"。

提交按钮

当单选按钮在 Web 浏览器中具有焦点时按 ENTER 键可以启动页面上另一个小组件的 Click 或 Tap 事件,即单选按钮的 "提交按钮"。

要为单选按钮指定一个提交按钮:

  • 选择单选按钮,然后单击 "交互 "窗格下部的 "显示所有"。
  • 从 "提交按钮 "下拉列表中选择符合条件的小组件。

要取消指定提交按钮,请单击下拉菜单底部的 "取消指定提交按钮"。


标签顺序

单选按钮和其他窗体小组件的标签顺序由它们的图层深度决定,如轮廓窗格中所示。您可以在 "组织小组件 "一文中了解更多关于这一点以及如何更改小组件的标签顺序。

推荐阅读:

原型设计工具Axure RP入门教程

原型设计工具Axure RP新手教程


想要获得Axure RP更多资源、正版授权的伙伴,请咨询【慧都客服】了解

关注慧聚IT微信公众号☟☟☟,了解产品的最新动态及最新资讯。

慧聚IT


标签:网页设计网站设计原型设计

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至hey@evget.com

文章转载自:Axure Software

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
在线咨询
联系我们

客服热线
023-68661681

QQ客服

意见反馈


添加微信获专业服务

TOP
在线客服系统
live chat