版本：Axure RP 8.0.0.3303
內容介紹：在“Axure RP（1）Client端OPI設計”中佈局完主界面，功能區是空白的，這次來佈局一個功能區的頁面，這個功能界面定義叫“計劃管理”；
一、效果
二、設計
- 整體佈局分為三部分，查詢區、操作區、數據列表區。
圖一
- 查詢區：下拉框是原來做好的，通過複製粘貼到頁面上來對齊即可，自定義下拉框可參考 。下拉框中默認顯示的文字為提示文字，需要設置的話參考圖二。
圖二
- 操作區：這裡只畫好了按鈕，後續我們再介紹。
圖三
- 數據列表區：先畫一個動態面板，設置滾動條為“自動顯示滾動條”（圖四），進入動態面板，增加中繼器，添加中繼器列並與中繼器矩形控件綁定對應關係（圖五）。
圖四
圖五
- 為“查詢”按鈕增加交互，通過查詢區域輸入的條件，篩選數據列表中的數據。這裡因為我自己的數據要求“掛起狀態”（Item.prod_req_hld_st）實現完全匹配查詢，所以增加了case2，case1是“掛起狀態”沒有值輸入的篩選條件（圖六、圖七）；case2是“掛起狀態”時的查詢（圖八、圖九），區別case1只是增加了Item.prod_req_hld_st的篩選。注：每個查詢項寫法一樣，圖七展示一個舉列，圖九為單獨的完全匹配貼圖。
圖六
圖七
圖八
圖九
三、其它
- 動態面板，設置滾動條為“自動顯示滾動條”。
- 第5步查詢交互，case1執行時，先執行一次“全部移出篩選”，不然case2執行完後，case1的執行效果就不行了。
分享到:
閱讀更多 blitheDotChen 的文章
