多选下拉列表能用作展现可选条码，并容许使用者优先选择数个条码，那么该如何利用 Axure 里用网络连接制做三个半选下拉列表。译者归纳了相关关键步骤，希望对你有所协助。
多选下拉列表常见作须要使用者从几组快捷键中优先选择多个快捷键的情况。它提供了三个输入框，使用者能点选进行并优先选择她们钟爱的数个快捷键。多选下拉列表能用作展现可选条码，并容许使用者优先选择数个条码。例如，在三个网志发布界底下，能使用多选下拉列表优先选择适用于的条码。因此今天就教大家在 Axure 里假如用网络连接制做三个半选下拉列表，因此依照已快捷键手动聚合条码的蓝本模版。
一、效用展现
1、点选下拉列表框能弹出快捷键，点选快捷键能选上快捷键或者中止选上
2、依照已选内容手动显示相关联的条码，因此依照条码数量手动调整下拉框的体积
3、中止选上时，相关联条码手动删掉，也能点选条码里的删掉按键删掉并中止选上
4、快捷键信息能在网络连接表单里保护，快捷键非常多时，能透过快捷方式每边查阅快捷键
蓝本门牌号：https://g8a5mh.axshare.com/#g=1二、制做讲义
1. 用网络连接制做快捷键
她们追加三个网络连接，在网络连接里加进文档条码，大背景正方形，以及多选按键，这里她们即使想自订多选按键的式样，因此她们没用掌控系统多选按键，她们用静态液晶来制做，减少三个状况，三个是未选上状况，三个是选上的状况，依次引入选上和未选上的多选按键的片断。
当然你们也能用掌控系统的多选按键来制做，依次将她们放进三个状况里，但是须要用个西厄县压住他，即使先期与否选上是透过网络连接里的值掌控的，并不是透过点选直接改变的。如下表所示图右图放置：
网络连接表单里她们减少一列：
text 列：在该列加进快捷键名，有几个快捷键就核对几行
xuanzhong 列：用以掌控相关联行的快捷键与否被优先选择，一般假如预设没选上项的话，不填方可，假如项预设某一快捷键选上，就在该快捷键 xuanzhong 列的值核对 1
在网络连接每一项写入时，她们首先用增设文档的交互，将 text 列快捷键的值增设到文档条码里。然后她们还要依照 xuanzhong 列的值来增设静态液晶是选上还是未选上的状况。假如 xuanzhong 列的值等于 1，那么她们用将静态液晶设置到选上状况；假如不等于 1，她们就增设到未选上的状况，不过这里不等于 1 的情况能不用写，即使他预设就是未选上的状况。
2. 鼠标单击快捷键时的交互鼠标单击快捷键时，她们要依照判断该快捷键与否已经被选上，假如已被选上，她们就将他增设为未选上，即使掌控他与否选上是透过网络连接里选上列的值来掌控的，因此她们用更新行的交互，将网络连接里 xuanzhong 列的值更新为 0 方可；假如未被选上，她们就将他增设为选上，用更新行的交互，将网络连接里 xuanzhong 列的值更新为 1 方可。
3. 将网络连接转为静态液晶这样她们就基本完成了下拉快捷键，假如快捷键非常多，这个快捷键就会很常，因此她们把它转为静态液晶，中止液晶
假如觉得掌控系统的快捷方式不太好看的话，她们还能透过再次转为静态液晶，然后用外液晶遮压住大部分或全部内液晶的快捷方式，这样去美化一下。
然后她们在底部减少三个大背景正方形，将她们组合在一起，这样下拉快捷键就做好了。
4. 下拉框的制做
下拉框她们须要用到正方形，每边箭头，以及网络连接条码组。
鼠标单击这个组合时，她们用显示的交互，将下拉快捷键显示出来，这个她们能优先选择灯箱效用，这样点选其他空白的地方，下拉快捷键就能手动收起来。
当然她们也能减少一些交互式样让他更加美化，减少正方形选上和禁用式样，鼠标移入移出或者下拉快捷键显示隐藏时，触发这些式样，即使每个人审美不一样，这些你们自行处理方可。
4. 网络连接条码组
前面说到下拉框组合里须要有三个网络连接条码组，她们现在来制做。
须要再网络连接里减少大背景正方形，文字条码和删掉按键，文字条码她们转为静态液晶，即使考虑到有些快捷键太长，她们就自显示前面部分方可。如下表所示图右图放置方可。
网络连接表单里不须要修改，用自带的 Column0 列方可，预设网络连接表单为空。网络连接布局为水平，按网格排布，案例中是每行项目数是 2。
在网络连接每一项加载时，她们用增设文档的交互，将 Column0 列的值增设到文档条码里。
这样条码组就只做完成了。
5. 快捷键和条码的联动
接下来她们要让快捷键和条码进行联动，在快捷键中继器里，该快捷键被选上，她们就用加进行的交互，将该快捷键的快捷键值减少的条码网络连接里。这里须要注意的是，即使网络连接每次更新都会从头加载，因此在一开始假如直接加进行的话，选第二个快捷键之后，就会发现之前第一次添加的条码，重复加进了。
因此她们在一开始的时候，要对条码网络连接做三个还原的操作，她们能用删掉所有行的方式，让选上之前的条码网络连接处于三个原始为空的状况。
她们要删掉条码的话，她们也不是用删掉行的方式，删除条码里相关联的行。即使她们是透过下拉快捷键网络连接里的值来掌控具体显示的条码，因此假如她们想让条码删掉，她们就用更新行的交互，将和条码名称一样的行的 xuanzhong 列的值更新为 0，这样就能把条码删掉。这样她们就基本完成了，但是她们还须要考虑条码太多的情况。6. 增设下拉框的体积
她们能依照条码网络连接的体积，来增设外框的体积。
当所有条码加载完成后，她们用增设体积的交互，首先增设下拉框的体积，宽度保持不变，高度就是条码组的高度 + 每边的边距，这样就能外框就能变高。
同事她们还要用移动的事件，移动下拉快捷键组合，移动到下拉框的底部，这样就能依照条码的多少，手动调整下拉框的体积。
这样她们就完成了多选下拉列表（手动聚合条码）蓝本模版的制做了，下次使用也很方便，她们只须要在下拉快捷键网络连接表单里核对快捷键值，方可手动聚合交互效用。那以上就是本期讲义的全部内容，钟爱的同学们能动手试试哦，感谢您的阅读，她们下期见。
本文由 @AI 产品人 原创发布于人人都是产品经理，未经许可，禁止转载
题图来自 Unsplash，基于 CC0 协议
