品牌型号：联想Yoga 14Sitl

系统：Windows 10 64位专业版

软件版本：Axure rp 9

在做原型设计的时候，复选框是很常见的交互元素，用来体现某个选项是否被选中。Axure RP内置的复选框虽然使用便捷，但默认样式比较单一，往往与UI设计稿中的视觉风格不太匹配。如果想让原型界面更贴近实际产品效果，我们就需要学会自定义复选框样式，并掌握尺寸调整的方法。下面就为大家介绍Axure RP如何自定义复选框，Axure RP复选框怎么调整大小的相关内容。

​一、Axure RP如何自定义复选框

复选框在界面中出现的频率非常高，例如“我已阅读并同意用户协议”旁的小方框就是典型的复选框。Axure自带的复选框部件可以快速实现点击勾选，但在样式上缺乏灵活性。如果项目对视觉风格有更高要求，我们可以自己动手创建一个定制版本。

1、绘制基础结构。首先，从元件库中拖出一个【矩形】到画布上，把它缩放到30×30像素，这就是复选框的外形。然后再添加一个【文本标签】元件，输入【勾选协议】的提示文字，放置在方框右侧。这样，一个最基础的复选框雏形就完成了。

2、设置样式效果。接下来，可以在右侧【样式】面板中调整外观。比如，为矩形设置一定的圆角值，让边缘显得更柔和自然。再把描边颜色改为更醒目的红色，使选框在界面上更突出。此时这个方块仍然只是静态图形，点击时不会有变化，还需要添加交互逻辑。

3、创建勾选状态。复制当前的矩形形状，然后在副本中用文本工具加入一个【✔】符号，表示选中状态。将矩形与【✔】一起选中后按下Ctrl+G组合成一个组。

4、构建动态面板。选择原始的矩形，右击并选择【转换为动态面板】。

Axure会自动生成第一个面板状态，我们再新建第二个状态，把刚才带有✔符号的组合放入其中。务必注意两个状态的位置要完全对齐，否则在切换时会出现轻微的跳动，影响视觉流畅度。

5、添加交互逻辑。最后一步是为动态面板添加动作。在右侧交互区域中，设置【单击时】触发【设置面板状态-下一项】，并勾选【向后循环】选项。这样，每次点击方框时，系统就会在未选中和已选中之间来回切换。点击【预览】后，可以看到第一次点击出现对勾，再次点击则恢复为空框，复选框的交互效果就完成了。

二、Axure RP复选框怎么调整大小

如果只是想做个小框放在画面上，自己画个矩形当然也行，但那样的复选框是静态的，没有交互效果。一般我们还是用Axure自带的复选框组件，它自带交互功能，能响应点击事件，非常方便。

1、插入复选框。在左侧的默认元件库中找到【复选框】，拖到画布中。默认样式是一个方框加文字复选框。

2、调整框的大小。选中复选框后，在右侧样式区域找到【按钮】部分。前面的【尺寸】选项可以修改复选框的尺寸数值，想让复选框更大，就调高尺寸参数。同时，还可以改变文字与方框的排列方式，默认是文字在右侧，也可以让文字显示在左边。

3、修改间距。样式面板最下方有【边距】设置，通过调整右边距，可以拉开文字与方框之间的距离， 比如有些设计中，文字和方框靠得太近会显得拥挤，适当加大间距会让界面更清爽。

以上就是Axure RP如何自定义复选框，Axure RP复选框怎么调整大小的相关内容。如果只是普通交互，用软件自带的组件效率最高。但在需要匹配特定设计风格时，自己动手做一个自定义复选框也是很实用的技能。掌握这两种方法，能让原型既能快速实现功能，又能在视觉上更贴近真实设计效果。