Axure RP設計新浪微博140字輸入、手風琴效果的方法

1 評論 12971 瀏覽 96 收藏 4 分鐘

感謝各位PM小伙伴的閱讀,讓我不斷有動力去分享Axure的一些小方法,內(nèi)容相對簡單,適合新手收藏,老鳥請點個贊,謝謝~~~

一.仿新浪微博140字內(nèi)容框

例如:適合SNS網(wǎng)站,留言吧,個人介紹等文本框的設計

1.1

1.布置好需要的元件(文本框,文本標簽等),對140字命名為“140”,對文本框命名為”weibo”;

2.“weibo”文本框設置交互動作,添加“文本改變時”→添加動作“設置文本”→選擇配制動作“140”→設置局部變量“元件文字:weibo”→設置文本的變量和函數(shù)([[140-LVAR1.length]]);

1

2

二.實用的手風琴效果

例如:web端和APP端都很常見,也非常的實用、美觀、省空間

1

1.拖動5個圖片元件,和5個動態(tài)模板元件,全部設置命名,尺寸保持一致。動態(tài)模板放在圖片的下方,并且隱藏;

2.動態(tài)模板添加圖片元件,載入圖片,尺寸與動態(tài)模板一致;

3.圖片下拉動作(對圖片添加鼠標點擊交互→編輯條件“if 元件可見于 圖片1 == false”→ 添加顯示動作→選擇圖片1→可見性為“顯示”,更多選項“推動元件”,方向“下方”,動畫“線性”,時間“500毫秒”);

4.圖片回收動作(對圖片添加鼠標點擊交互→編輯條件“if 元件可見于 圖片1 ==true”→ 添加顯示動作→選擇圖片1→可見性為“隱藏”,拉動元件,方向“下方”,動畫“線性”,時間“50毫秒”);

5.其它圖片的交互也是一樣,但選擇的圖片一定要與所勾選的命名圖片一致。

1

2

3

4

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

更多精彩內(nèi)容,請關注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 寫的不錯??

    回復