axure选中后横线切换_Axure教程:中继器如何切换标记状态?

原标题：Axure教程:中继器如何切换标记状态?

中继器如何切换标记状态呢？一定有很多PM和我一样为此苦恼，一起来看看作者的解答。

写在前面

在之前的文章《Axure教程：如何使用Axure中继器元件？》中，@wu赖、在评论里指出：

有瑕疵，选中一次后背景颜色改变再点击一次背景颜色变成原始状态，但这行其实状态还是标记状态，会一起被删除。

问题产生的原因是什么呢？答案是当我们点击中继器某一行的时候，该行的 选中状态会“toggle”而 标记状态不会“toggle”也不会变为“false”，也就是说，中继器只是切换了选中状态而没有切换标记状态。

因此当点击某一行两次时，该行选中状态为“false”→“true”→“false”，而标记状态为“false”→“true”→“true”。于是我们看到的视觉效果就是白→蓝→白，而该行却依然处于标记状态，删除处于标记状态的行时该行依然会被删除。

这个问题看似简单，其实不然。在网上也无法搜到正确的解决方案。有的只是如何“标记行”和“取消标记”，并没有“切换标记状态”的方法。

那么，中继器到底该如何切换标记状态呢？

上下求索

想法一

一下子想到的便是，既然点击时行的 选中状态可以“toggle”，那 标记状态也跟着“toggle”不就好了？不幸的是，Axure并不支持对行 标记状态的“toggle”。So bad.

点击 中继器模式编辑操作区中的组合，在右侧“检视：组合——交互”中双击“Case 1”打开 用例编辑面板，如下图所示，可以看到没有“切换标记状态”动作，只有“标记行”和“取消标记”动作。

想法二

问题总会有办法解决的！既然 选中状态可以“toggle”， 标记状态不可以“toggle”，那我们可不可以删除处于 选中状态的行呢？答案是Axure也不支持删除处于 选中状态的行，只支持删除处于 标记状态的行。真令人难过。

切换到 主界面，点击选择用于删除的按钮，在右侧“检视：矩形——交互”中双击“Case 1”打开 用例编辑面板，如下图所示，可以看到没有“已选中”选项。

想法三

咦，除了已标记，这不还有个条件嘛！说不定那里有我们想要找的答案！点进去一看，还是可用的条件，绝望。。。

选择“条件”选项，点击右下角“fx”，试图设置删除行的条件为[[“isPitchOn”==true]]，然而如下图所示，并没有这样的变量或函数。

条件判断

山穷水尽疑无路，柳暗花明又一村。

点击 中继器模式编辑操作区中的组合，在右侧“检视：组合——交互”中双击“Case 1”打开 用例编辑面板，我们看到有个“添加条件”的按钮。

点开看看？可以看到，我们可以根据行的 选中状态来决定对应用例(也就是这里的Case1：切换选中状态和标记行)的执行与否。

于是脑海里产生了这样的想法：

if (选中状态 == false) {选中状态 == true；标记状态 == true；}

if (选中状态 == true) {选中状态 == false；标记状态 == false；}

嗯！一定就是这样了！试试看！

解决方案

点击 中继器模式编辑操作区中的组合，在右侧“检视：组合——交互”中双击“Case 1”打开 用例编辑面板，点击“添加条件”按钮，打开 面板，将判断变量设为“选中状态”，判断值设为“false”，如图所示。

按“确定”按钮保存，关闭条件设立面板，关闭 用例编辑面板，回到 中继器模式编辑操作区。在右侧“检视：组合——交互”中右键单击“鼠标单击时”，选择“添加用例”。

会自动弹出 用例编辑面板，点击正上方“添加条件”按钮，设置判断变量为“选中状态”，判断值为“true”。

按“确定”按钮关闭条件 设立面板，回到 用例编辑面板，在左侧“添加动作”栏点击“元件——取消选中”添加取消选中动作。

再在左侧“添加动作”栏点击“中继器——数据集——取消标记”添加取消标记动作。

点击“确定”按钮关闭 用例编辑面板，回到 中继器模式编辑操作区，可以在右侧“检视：组合——交互”中看到此时鼠标单击时会执行的动作。

大功告成！

点击上方“预览”按钮查看最新效果。

本文由 @许木胜 原创发布于人人都是产品经理。未经许可，禁止转载。返回搜狐，查看更多

责任编辑：