在使用Axure制做表格或是列表时,经常用到鼠标移入时整行变色,移出时恢复原来颜色,选中一行时整行变色,取消选中是恢复原来颜色。

工具/原料

  • Axure 8

方法/步骤

  1. 1

    在页面中拖入一个中继器,取名为:表格中继器

  2. 2

    双击打开中继器,删除现有的“矩形”方框,然后添加一个表格,只保留一个空行,将多余行删除并调整列宽至合适样式,我的是35:150:150,高为30

  3. 3

    添加复选款至第一个单元格中,复选框取名为“选中”,用于选择行

  4. 4

    组合复选框与表格,取名为“行”

  5. 5

    设置“表格中继器”背景色为蓝色(点击中继器空白处即可设置)

  6. 6

    选中组合“行”,分别设置期鼠标移入与鼠标移出时的交互:

  7. 7

    鼠标移入时,当复选框“选中”的“选中状态”值==false时,“设置不透明”为"行”90%

  8. 8

    鼠标移入时,当复选框“选中”的“选中状态”值==false时,“设置不透明”为"行”100%

    到此时鼠标移入变色就做好了,接下来做选中变色

  9. 9

    设置“选中”复选框“选中时”交互为 “设置不透明”“行”为75%

  10. 10

    设置“选中”复选框“取消选中时”交互为 “设置不透明”“行”为75%

  11. 11

    下面看看效果

    END

注意事项

  • 如果要实现单击当前行任何位置选中或取消复选框,只需设置组合“行”的“鼠标单击时”交互即可。
经验内容仅供参考,如果您需解决具体问题(尤其法律、医学等领域),建议您详细咨询相关领域专业人士。