【Axure10】交互功能-交互動作-元件動作 交互功能-交互動作-元件動作

交互功能-交互動作-元件動作

顯示隱藏

控制元件的是否可見屬性

  • 目標:控制的元件。

  • 顯示:元件可見。

  • 隱藏:元件不可見。

  • 切換:切換當前元件的可見狀態(可見-不可見-可見)。

  • 動畫:控制變化的交互方向動畫。。

  • 毫秒:整個動畫持續的時長(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加載渲染的特性實現部分效果。

  • 通常用的比較多的是置於頂層,這樣有以利於元件的充分顯示(不考慮元件概要中的元件排序)。

設置不透明度

設置元件的不透明度

  • 通過設置元件的不透明度實現一些場景交互效果。
  • 設置動畫可以實現不透明度調整加載效果。

獲取焦點

設置元件獲取焦點。當元件獲取焦點後,可以結合交互事件中的獲取焦點、失去焦點進行交互處理。

同時獲取焦點可以觸發元件設置的焦點形狀屬性樣式。

  • 同時焦點是一個暫存(爲什麼說是暫存:焦點會隨着操作而消失,所以這個暫存狀態可以幫助我們完成一些其他交互無法達到的效果。)例如一些點擊選中,可以設置獲取焦點是選中,失去焦點是切換爲未選中,這樣就可以達到一些微小的視覺效果。

展開、摺疊樹節點

設置樹類型元件的節點展開與摺疊控制。此處只能作用與樹類型元件。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章