起點(diǎn)課堂會(huì)員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會(huì)特權(quán)
個(gè)人IP打造特權(quán)
30+門專項(xiàng)技能課
1300+專題課程
12場(chǎng)職場(chǎng)軟技能直播
12場(chǎng)求職輔導(dǎo)直播
12場(chǎng)專業(yè)技能直播
會(huì)員專屬社群
榮耀標(biāo)識(shí)Axure教程：實(shí)現(xiàn)分類欄拖動(dòng)效果
筆者在本文中介紹了如何用Axure實(shí)現(xiàn)分類欄拖動(dòng)效果的操作步驟，以及實(shí)現(xiàn)過程中的一些心得體會(huì)。
操作步驟
1. 一個(gè)轉(zhuǎn)換為動(dòng)態(tài)面板的矩形
這里需要注意，轉(zhuǎn)換為動(dòng)態(tài)面板后要將動(dòng)態(tài)面板默認(rèn)勾選的自動(dòng)調(diào)整為內(nèi)容尺寸的勾選取消掉！
2. 將動(dòng)態(tài)面板里面的矩形再次轉(zhuǎn)換為動(dòng)態(tài)面板
這里不需要取消勾選。
3. 在面板2里面放任意多個(gè)超出面板1寬度的矩形，這里我放了6個(gè)矩形
4. 設(shè)置面板2的交互動(dòng)作
5. 預(yù)覽看看效果
（1）初始狀態(tài)
（2）拖動(dòng)后
小記
1. 當(dāng)動(dòng)態(tài)面板的“自動(dòng)調(diào)整為內(nèi)容尺寸”勾選取消掉后，會(huì)在編輯面板里面出現(xiàn)藍(lán)色的方框
這個(gè)藍(lán)色方框是指外面那個(gè)動(dòng)態(tài)面板的大小，提示用戶預(yù)覽時(shí)只有藍(lán)色方框內(nèi)的內(nèi)容會(huì)顯示出來，假如想要藍(lán)色方框以外的內(nèi)容顯示出來，則需要我們通過設(shè)置交互動(dòng)作——拖動(dòng)，才能將范圍外的內(nèi)容拖到范圍內(nèi)顯示出來。
2. 拖動(dòng)的界限值的計(jì)算
這里首先邊界都設(shè)定為左側(cè)，但>=-[[This.width-350]]，這350很多人不知道怎么來的。其實(shí)就是外面那個(gè)動(dòng)態(tài)面板的寬度。像我這個(gè)原型就是：
外面的動(dòng)態(tài)面板寬度：
350這個(gè)數(shù)值就來自這里。
本文由 @Nilz 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載
題圖來自 Unsplash ，基于 CC0 協(xié)議
剛剛醒，準(zhǔn)備起床
評(píng)論
最后那段變量麻煩再解釋一下吧，想了半天沒想明白
如果要實(shí)現(xiàn)分類欄的拖動(dòng)效果，外面就需要有一個(gè)動(dòng)態(tài)面板，那么拖動(dòng)的界限值就是>=-[[This.width-動(dòng)態(tài)面板的寬度]]。