Axure如何自定義設計下拉列表交互
下拉列表本家兒要要實現被選擇時有下拉項，鼠標移至下拉項時有顏色轉變，對應選擇后可展示選擇項。以下為Axure自界說設計交互下拉列表的方式
東西/原料
- Axure
方式/步調
- 1
起首我們先設計好下拉列表的組件，這里自界說的下拉組件構成為：一個箭頭、一個布景、四個矩形框。
- 2
接下來我們要實現當鼠標移入對應選項時，選項呈現顏色轉變。
1、同時選中三個選項的矩形框，然后點擊新建交互，選擇鼠標懸停
2、這里我將懸停時的交互填充顏色為藍色，字體為白色
- 3
設計完懸停結果之后，我們設計下拉框的選中狀況，被選中下拉框時，箭頭朝下，不然朝上，交互如圖。
需要注重的是，當我們設計好選中狀況事務時，需要設計單擊事務，令其選中狀況為切換
- 4
箭頭的選中結果完當作后，我們需要使鼠標點擊組件時切換滑動呈現選項，這里操縱動態面板。
1、將布景以及選中狀況轉換為動態面板并定名為下拉選項_01，設為埋沒
2、之后我們鄙人拉框的選中狀況為面板設計事務，被選中時顯示下拉選項_01并標的目的下滑動，打消選中時滑動并埋沒下拉選項_01,如下圖。
- 5
以上步調完當作后，大致交互結果就完當作了。
下一步我們要實現選擇選項時，下拉選項_01滑動埋沒
雙擊進入下拉選項_01的動態面板，別離為各個矩形框設置單擊時，下拉框的選中狀況為假，如下圖。
- 6
第二步我們要設計選擇下拉選項時，下拉框獲取到該文本值。操縱函數，如下圖為各個選項設置。
- 7
以上都完當作后即可點擊預覽，就可以看到自界說設計的下拉框結果啦
- 發表于 2019-11-29 20:26
- 閱讀 ( 1359 )
- 分類：其他類型
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章