編輯導(dǎo)讀：下拉菜單是一個(gè)常用的功能，用戶可以在框中選擇自己想要的選項(xiàng)，也可進(jìn)行全選。本文作者分享了如何用Axure制作下拉菜單+復(fù)選框全選效果，希望對(duì)你有幫助。

在設(shè)計(jì)過(guò)程中會(huì)常常用到下拉菜單，本次課程我們學(xué)習(xí)下拉菜單+復(fù)選框全選效果。

預(yù)覽及下載地址：https://ahbvk2.axshare.com/

一、制作原型

1.制作下拉菜單的選擇框

拖入兩個(gè)【矩形】元件，【文本標(biāo)簽】制作成下拉菜，菜單部分組合一起

2.制作下拉菜單中的菜單部分

（1）全選
拖入【動(dòng)態(tài)面板】設(shè)置成兩個(gè)狀態(tài)，

(2）選項(xiàng)標(biāo)簽

拖入一個(gè)【中繼器】，并設(shè)置，選項(xiàng)框設(shè)置為兩個(gè)狀態(tài)

二、交互設(shè)置

每項(xiàng)加載時(shí)獲取文字

設(shè)置復(fù)選框鼠標(biāo)點(diǎn)擊事件

設(shè)置“全選”復(fù)選框設(shè)置鼠標(biāo)點(diǎn)擊事件

設(shè)置下拉菜單鼠標(biāo)點(diǎn)擊事件

最后設(shè)置“取消”和“確定”按鈕的鼠標(biāo)點(diǎn)擊事件

本文由@qianqianlu 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自 Pixabay，基于CC0協(xié)議