Axure:不用動(dòng)態(tài)面板就能做好的手風(fēng)琴效果

6 評(píng)論 7924 瀏覽 12 收藏 4 分鐘

初入行的產(chǎn)品新人,想向大家分享一個(gè)做手風(fēng)琴的簡(jiǎn)單辦法。

第一步:在Axure里創(chuàng)建三個(gè)矩形,一個(gè)圖片,一個(gè)占位符和一個(gè)列表框(可根據(jù)實(shí)際情況替換)。

第二步,給這六個(gè)不見(jiàn)取名,在這里,我給三個(gè)矩形按照上下的順序取名為“1”“2”“3”。

給圖片取名為“1.”,給占位符取名為“2.”,給列表框取名為“3.”。

并按照一定的順序排列,如果排列順序不對(duì),演示的時(shí)候會(huì)有遮擋。

第三步,隱藏圖片、占位符和列表框。

第四步,選中“1”矩形,在鼠標(biāo)單擊時(shí),對(duì)“1.”圖片,切換可見(jiàn)性,并推動(dòng)拉動(dòng)元件,方向默認(rèn)選擇下方,無(wú)動(dòng)畫(huà)即可。

第五步,還是在上個(gè)鼠標(biāo)單擊動(dòng)作里,選擇隱藏“2.”“3.”,選擇拉動(dòng)元件,方向?yàn)橄路健?/p>

而另外兩個(gè)矩形也按照這種方法,只是“2”切換可見(jiàn)性的變成了“2.”占位符。隱藏的變成了“1.”和“2.”

同理“3”切換可見(jiàn)性的變成了“3.”,隱藏“1.”和“2.”

然后將“1.”“2.”“3.”全部隱藏,并調(diào)整到合適位置,(就是將“1.”的頂部和“1”貼合,另外兩個(gè)也這么做)如下圖

點(diǎn)擊預(yù)覽,就能有以下效果了:

希望可以幫助到大家,掌握這個(gè)手風(fēng)琴的簡(jiǎn)單制作方法,也不需要用到動(dòng)態(tài)面板,共同進(jìn)步~

 

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

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

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 跟著,學(xué)會(huì)了這個(gè),謝謝!

    來(lái)自浙江 回復(fù)
    1. 一起進(jìn)步!

      來(lái)自浙江 回復(fù)
  2. *****而另外兩個(gè)矩形也按照這種方法,只是“2”切換可見(jiàn)性的變成了“2.”占位符。隱藏的變成了“1.”和“2.”

    同理“3”切換可見(jiàn)性的變成了“3.”,隱藏“1.”和“2.”*****

    //配置2的時(shí)候,隱藏的應(yīng)該是1.和3.吧 ??

    來(lái)自浙江 回復(fù)
    1. 是的呢,看的好仔細(xì),我以后會(huì)多檢查的 ?

      來(lái)自浙江 回復(fù)