交互功能-交互動作-元件動作
顯示隱藏
控制元件的是否可見屬性
目標:控制的元件。
顯示:元件可見。
隱藏:元件不可見。
切換:切換當前元件的可見狀態(可見-不可見-可見)。
動畫:控制變化的交互方向動畫。。
毫秒:整個動畫持續的時長(1000毫秒=1秒)。
效果:
燈箱效果、彈出效果:交互的效果。
遮罩效果:在元件顯示範圍外,全部填充遮罩的顏色。
推動元件:推動下方的元件(注:推送元件的效果在於可以很好的展示頁面的佈局)。
置於頂層:將元件移動在最頂層(防止其他元件遮擋顯示效果)。
設置面板狀態
控制動態面板的交互顯示。
目標:控制的元件(目標元件必須是動態面板)。
狀態:當前屬於動態面板中的哪一個。
進入動畫:動態面板進入時的交互動畫。
None:無、逐漸、向右滑動、向左滑動、向上滑動、向下滑動、向右翻轉、向左翻轉、向上翻轉、向下翻轉。
退出動畫:動態面板退出時的交互動畫。
如果隱藏則顯示:當動態面板原始的狀態爲隱藏時,加載時是否顯示。勾選顯示。
推動和拉動元件:推動、拉動元件(注:推動、拉動元件的效果在於可以很好的展示頁面的佈局)。
搖擺、線性、緩慢進入、緩慢退出、緩進緩出、彈跳、彈性
設置文本
設置文字的顯示。所有可設置文字的元件均可進行設置。
設置圖片
設置圖片的顯示。
屬性:
圖片:選擇一張本地圖片上傳。
值:
可以選擇中繼器中的賦值,配合中繼器效果可以在中繼器中設置爲導入圖片。然後通過賦值給元件,到達一些特有效果,例如:商品列表等等。
可以選着圖片地址,例如OSS圖片地址。
更多選項
設置鼠標懸停圖片:當鼠標懸停在圖片時,展示對應的圖片,同時具有圖片的屬性設置(圖片或值)。
設置鼠標按下圖片:當鼠標按下時,展示對應的圖片,同時具有圖片的屬性設置(圖片或值)。
設置選中圖片:當前圖片元件選中時,展示對應的圖片,同時具有圖片的屬性設置(圖片或值)。
設置禁用圖片:當前圖片元件禁用時,展示對應的圖片,同時具有圖片的屬性設置(圖片或值)。
設置選中
設置元件狀態爲選中狀態。可以進行選中與非選中狀態切換。
- 選中需配合已設定的元件選中效果進行使用。通過設置選中進行元件不同狀態的交互。
[圖片上傳失敗...(image-568f66-1625374305654)]
設置列表選中項
設置存在選項列表中的某一個選項。
- 在存在下拉列表、列表框時,可以觸發設置列表選中項。
啓用/禁用
設置元件(元件組)的啓用與禁用狀態。
元件禁用後,可編輯屬性的元件將不可編輯。
禁用舉例:下拉列表禁用後,將不可進行下拉選擇。
移動
設置元件(元件組)的移動
到達:使元件移動到達某個固定位置(此位置是一個絕對位置),例如:元件起始座標爲(50、50),設定達到座標(100、100),此時的移動就是元件到達(100、100)的位置。
經過:使元件移動到達某個相對位置,例如:元件起始座標爲(50、50),設定達到座標(100、100),此時的移動就是元件到達(150、150)的位置。
移動需要指定元件的X座標和Y座標。同時座標支持函數賦值。
軌道:有直線、逆時針弧線和,三種類型。可以滿足簡單的加載移動效果。
直線
順時針弧線
逆時針弧線
邊界:邊界可以理解爲給移動的元件給定一個可以移動的範圍。
邊界分爲四個方向:左側、右側、頂部、底部。
邊界的比較分爲:≥大於等於)、>(大於)、<(小於)、≤(小於等於)。
只支持具體的值,也支持函數賦值。
Axure10新特性
可以對整體範圍內元件進行移動操作。
- 所有元件在此下方:移動所有位於當前操作元件下方的內容。
- 所有元件在此右側:移動所有位於當前操作操作元件右方的內容。
旋轉
設置元件(元件組)的旋轉
旋轉:
順時針旋轉:元件旋轉方向按照順時鐘的方向旋轉。
逆時針旋轉:元件旋轉方向按照逆時鐘的方向旋轉。
方式
到達:使元件旋轉絕對角度。例如:元件起始角度爲30°,設定達到100°,元件旋轉後的角度就爲100°。
經過:使元件旋轉相對角度。例如:元件起始角度爲30°,設定進過100°,元件旋轉後的角度就爲130°。
旋轉需要指定元件旋轉角度。同時角度支持函數賦值(360°一圈)。
動畫:無(none)、搖擺、線性、緩慢進入、緩慢退出、緩進緩出、彈跳、彈性。
動畫時常:整個旋轉週期所有的時常(結和動畫使用)。注:1000毫秒等於1秒。
偏移和錨點
偏移:可偏移的位置
錨點:設定以什麼爲中心點旋轉(共有9個點供選擇、左上、上中、右上、左中、中心、右中、左下、中下、右下)。選擇不同的錨點,旋轉出的樣式不同,常用的基本爲中心旋轉。
設置尺寸(大小)
設置元件的尺寸大小
適合於觸發元件的大小調整,例如鼠標移入放大。
設置尺寸需要指定元件高度和寬度。同時高度和寬度支持函數賦值。
動畫:無(none)、搖擺、線性、緩慢進入、緩慢退出、緩進緩出、彈跳、彈性。
動畫時常:整個旋轉週期所有的時常(結和動畫使用)。注:1000毫秒等於1秒。
錨點:設定放大的方向(共有9個點供選擇、左上、上中、右上、左中、中心、右中、左下、中下、右下)。
置於頂層/底層
將元件置於頂層或者底層,通過元件的層級關係,利用Axure加載渲染的特性實現部分效果。
- 通常用的比較多的是置於頂層,這樣有以利於元件的充分顯示(不考慮元件概要中的元件排序)。
設置不透明度
設置元件的不透明度
- 通過設置元件的不透明度實現一些場景交互效果。
- 設置動畫可以實現不透明度調整加載效果。
獲取焦點
設置元件獲取焦點。當元件獲取焦點後,可以結合交互事件中的獲取焦點、失去焦點進行交互處理。
同時獲取焦點可以觸發元件設置的焦點形狀屬性樣式。
- 同時焦點是一個暫存(爲什麼說是暫存:焦點會隨着操作而消失,所以這個暫存狀態可以幫助我們完成一些其他交互無法達到的效果。)例如一些點擊選中,可以設置獲取焦點是選中,失去焦點是切換爲未選中,這樣就可以達到一些微小的視覺效果。
展開、摺疊樹節點
設置樹類型元件的節點展開與摺疊控制。此處只能作用與樹類型元件。