在中心應用還未完成構建或部署時,輕應用支持構建不依賴于底層能力的頁面。本文介紹如何構建靜態應用首頁和自定義頁面。
步驟一:創建服務方法
前提條件
當前應用為輕應用。關于如何創建輕應用,請參見創建輕應用。
當前應用的版本狀態處于開發中,尚未發布。
當前賬號具有應用開發權限。
操作步驟
登錄BizWorks,在選擇平臺下拉列表中選中輕應用組裝平臺。
單擊頁面右上角圖標或其文本框區域,在下拉列表中單擊目標項目名稱后,單擊應用頁簽。在應用列表頁面單擊目標輕應用名稱。
在目標輕應用導航欄中,選擇 。
在服務方法頁面,單擊新建服務方法。
在新建服務方法面板,參考下圖完成服務方法的相關配置后,單擊創建。
在新打開的編排服務方法畫布中,創建一個符合服務方法出參類型(步驟5:List<String>)的變量,并打開結束節點,把新變量賦值給出參。
請您參考下圖新增變量:變量名稱:output、變量類型:List<String>。
具體操作,請參見變量管理。
在畫布的流程圖中,單擊結束節點卡片右上角的圖標。在結束節點面板,把新增變量(步驟6:a中的output)賦值給出參。
完成結束節點參數配置后,服務編排設計器會進行自動校驗,告知您變量尚未賦值。
說明由于該輕應用未關聯模型,服務編排過程中您還無法調用后端應用服務節點。為了給變量賦值,您可以新增一個變量賦值流程節點,且通過表達式直接為變量賦值。
請您參考下圖新增變量賦值流程節點,且為其賦值。
更多信息,請參見變量賦值。
完成變量賦值節點賦值后,您在后續的頁面編排中支持調用此服務方法(信息查詢)。在本示例中,自定義頁面內調用此服務方法,在應用部署后,即可看到此服務方法的調用效果。
步驟二:編排頁面
在頁面編排中,您可以通過對組件的拖拽實現對頁面內容的設計及布局,實現應用的可視化編排。具體操作,請參見可視化編排頁面。
下圖為應用首頁的設計畫布,包含四個標準組件:輪播、選項卡、折線圖、時間軸。在輪播項的設置中,您可以刪減參與輪播的圖片,并對輪播設置進行自定義操作。
本文以上圖中的首頁為例,說明如何進行頁面編排。
新建頁面。
在目標輕應用導航欄中,選擇 。
在頁面編排頁面,單擊新建頁面。
在新建頁面面板,請參考下圖完成配置項設置后,單擊創建。
頁面名稱:首頁
編碼:mainPage
顯示導航菜單:保持默認選中
開發模式:保持默認選項(可視化編排)
在資源管理頁面上傳目標圖片。
具體操作,請參見管理資源。
在輪播項配置中對圖片進行調用。
在頁面編排頁面,單擊頁面名稱首頁右側操作列下的編輯頁面。
請參考下圖在輪播圖的屬性面板中對圖片文件進行設置。
在選項卡中,您可以自定義標題的名稱和數量,并在容器中拖入其他組件。
說明輕應用頁面編排設計器中內置了11個圖表組件,本文示例拖入的組件為折線圖。
在折線圖屬性的數據設置中配置固定值或動態值的數據源。
折線圖的配置詳情如下圖所示。
說明頁面編排設計器內置了示例數據,以幫助您理解數據結構。
在時間軸組件中,請參考下圖配置時間軸顯示內容的數據源。
說明時間軸組件的數據源同樣可分為固定值和動態值兩類,您可以關聯數據源,進行自定義顯示。
步驟三:調用自定義頁面和自定義組件
當頁面編排無法滿足您的設計需求時,您也可以把開發好的頁面和組件上傳至輕應用,與編排好的頁面共同部署。
關于如何開發自定義頁面和組件,請參見開發和管理自定義頁面和開發和管理自定義組件。
調用自定義頁面
調用自定義組件
在完成自定義組件的開發并上傳后,您可以在頁面編排設計器的組件庫中找到自定義組件,把該組件拖入畫布后即能看到組件效果。
新增自定義組件。具體操作,請參見新增自定義組件。
在頁面編排設計器的自定義組件的組件庫中查看自定義組件。
步驟四:配置頁面框架
在頁面編排的過程中,您可以對頁面框架進行調整。
打開頁面框架設計器,您可以根據喜好對頁面框架進行相應的配置。具體操作,請參見配置頁面框架。
步驟五:管理菜單
完成對頁面的設計后,您可以通過菜單管理把編排完成的頁面關聯至具體的菜單,有需要時還可進行分組。具體操作,請參見配置頁面導航和框架。
步驟六:部署應用
在應用開發完成后,您可以選擇環境并進行應用的部署。具體操作,請參見部署和管理輕應用。
部署完成后,您即可對輕應用頁面進行訪問,各頁面效果如下。
首頁
自定義頁面
單擊調用自定義接口,頁面調用在服務編排中的信息查詢服務方法,且顯示該服務方法
?
的出參值。自定義組件