Axure怎么做下拉条件逻辑的效果

 时间:2026-02-15 14:22:42

1、从控件库拖拽一个下拉框,添加3个选项“电视机”、“冰箱”、“洗衣机”

Axure怎么做下拉条件逻辑的效果

2、再拖拽一个动态面板到页面,添加三个面板动态“电视机”、“冰箱”、“洗衣机”

Axure怎么做下拉条件逻辑的效果

3、双击“电视机”面板状态,在面板的区域添加需要展示的图片

同理,双击“冰箱”、“洗衣机”面板状态,添加对应的图片

Axure怎么做下拉条件逻辑的效果

4、鼠标点击下拉框,在右侧交互区域,添加交互案例

点击“OnSelectionChange”(选择更改),添加交互逻辑

ps:我用的英文版axure,大家可以图文结合着看操作过程

Axure怎么做下拉条件逻辑的效果

5、点击“Edit Condition”,选择电视机

Axure怎么做下拉条件逻辑的效果

Axure怎么做下拉条件逻辑的效果

6、点击“Set Panel State”,再勾选“Set dianqi state to 电视机”,点击ok即可

Axure怎么做下拉条件逻辑的效果

7、同理设置另外两个面板状态,设置完成,交互区域总共3个case

注意设置哪个面板状态,“select state”就选择哪个

Axure怎么做下拉条件逻辑的效果

8、点击预览,查看交互效果,切换下拉框的选项,页面展示对应的图片

Axure怎么做下拉条件逻辑的效果

Axure怎么做下拉条件逻辑的效果

  • Axure中如何制作线性图形
  • Axure RP参考线如何批量快速删除
  • 如何使用AXURE的标记组件设计UI?
  • Axure RP如何设置页面排列
  • Axure编辑按钮
  • 热门搜索
    有关水的手抄报 我爱我班手抄报内容 有关爱国的手抄报 小学消防安全手抄报 关于桥的手抄报图片 勤俭节约的手抄报 保护动物手抄报内容 法制教育手抄报资料 手抄报春节图片 垃圾不落地手抄报