axure 用中繼器實現下拉多選框


中繼器實現下拉多選框。
有一種用全局變量實現的方式,那個不太靈活,在不用的頁面添加更多的選項。所以做了一個用中繼器實現的。
 
 
 
  1. 添加控件:下拉框、文本框、熱區、標簽、中繼器
  2. 下拉框、文本框、熱區。三個控件只為得到下拉框的效果。如果只用文本框和向下的三角形來表示下拉框,則在拉伸這個組合控件時,三角形會變形。因此需要用到下拉框的形狀,但下拉框在復選框選中時,又沒有辦法賦值。因此將下拉框置於最底層;文本框在上,但將背景色設置為透明,只用來顯示被選中的文本;熱區在最上方,為響應鼠標的點擊事件。
  3. 設置中繼器中的數據,添加一些行:下拉選項1,下拉選項2,下拉選項3....
  4. 雙擊中繼器,進入中繼器內容編輯。先刪除原有的矩形框,然后添加一個復選框,將復選框的寬度設置為和文本框一致。
  5. 設置復選框的loaded事件,設置復選框的文本為[[item.column0]]
  6. 設置復選框的selected or unselected 事件。這個比較復雜,要添加條件和變量和使用函數。第一種情況:如果當前控件(復選框)選中狀態為真並且文本框的內容沒有包含當前控件的文本,則將文本框的內容設置為文本框的內容加上當前控件的文本;如選中狀態為假並且文本的內容包含了當前控件的文本,則將文本框的內容設置為去掉當前控件文本。為了區分多個選項值,在添加文本時,后面帶上了一個','。在replace時,也需要帶上這個','。具體如下圖。
  7. 設置中繼器的可見性為‘隱藏’,
  8. 設置熱區的點擊事件:切換中繼器的可見性;將中繼器提升到最頂層。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM