鴻蒙開發：dialog庫做了一些優化

前言

本文基于Api13

dialog庫是我去年5月份開發了一個便捷彈窗庫，主打一個使用簡單，一經推出，在dialog領域下載量穩居在前，可以說是非常受歡迎的；但是，之前的版本仍然有著可優化的空間，比如彈窗內容不支持動態更新，時間彈窗數據是循環遍歷，造成了數據加載慢，還有彈窗無法根據標識隱藏等等，這些問題的存在，導致了在特定場景下無法滿足的情況，不得不促使著自己進行優化更新。

除了代碼上的優化之外，針對功能和文檔也做了同步更新，目前把dialog拆分了八大功能模塊，幾乎涵蓋各個業務需求，分別是：1、自定義形式，2、時間彈窗，3、城市選擇，4、確認&信息，5、底部列表&網格，6、toast，7、popup形式，8、loading形式。

中心倉庫地址如下，目前版本為1.2.0，本文不在贅述使用方式，只介紹優化項，大家如果想看使用方式，直接查看中心倉庫地址即可：

https://ohpm.openharmony.cn/#/cn/detail/@abner%2Fdialog

支持的功能很多，無法做到一一截圖，主要的功能效果如下，有一點需要說的是，所有的彈窗樣式均可以通過全局初始化統一設置，或者在調用的時候進行單獨設置。

首先是常見的信息確認形式，支持單雙按鈕，并且支持message自定義組件形式，最新的版本也已經支持數據的動態更新。

底部列表形式，支持常見的單列表，網格，列表滾動選擇等形式，并且默認支持動畫從底部彈出，適用于場景的性別選擇，分享，條件選擇等場景。

時間選擇器，這一版，優化比較大，舍棄了之前的數據遍歷，改為了單組件獲取，這樣大大提高了數據的加載速度。

內置了城市地址選擇，如果不滿足需求，您可以通過底部列表樣式，自己來實現。

toast和系統不一樣的是，可以自行設置圓角和背景，以及設置自己的icon圖標。

具體使用，之前也有寫過，并且中心倉庫以及Gihub中也有文檔說明，這里不在贅述了，簡單說下本次優化的幾個問題。

優化一、內容支持更新

之前的版本中，彈窗的內容默認傳遞什么就是什么，無法在彈窗彈出后進行動態更新，雖然大部分的場景下不需要更新，但是在一些特殊的場景下，這樣的效果也是存在的，為了滿足這部分需求，1.2.0針對這個問題做了統一的處理。

信息彈窗形式更新

參數為ContentAttribute，支持標題，描述信息，按鈕，以及相關樣式等全部的屬性更新。

updateDialogInfo()

比如信息彈窗彈出后，我需要更新標題和描述信息，可以如下代碼操作：

updateDialogInfo({title:"我更新了標題",message:"我更新了描述"})

確認彈窗形式更新

和信息彈窗除了更新方法不一樣之外，參數是一模一樣的。

updateDialogConfirm()

比如彈窗彈出后，我需要更新標題和描述信息，可以如下代碼操作,當然了，你也可以更新其他的屬性，比如按鈕的內容，彈窗的樣式等。

updateDialogConfirm({title:"我更新了標題",message:"我更新了描述"})

自定義彈窗形式更新

參數是Object，和彈出自定義彈窗傳遞的數據類型一樣。

updateDialogParams()

popup彈窗數據更新

參數是Object，和傳遞的數據類型一樣。

updatePopupData()

優化二、時間彈窗數據優化

由于系統的組件無法滿足UI的樣式，針對時間彈窗做了一層封裝，系統雖然提供了可供選擇的滾動組件TextPicker，但是所有的數據都需要自己來設置；因為時間格式的不同，比如年月日時分秒，年月日時分等，所展示的列也是不同的，上一版，由于需要聯動的機制，采取了數據循環遍歷，非常的耗時，比如年月日時分秒，需要遍歷起始年，然后對每一年再遍歷月，一層層往下走，非常的不便。

這一版，不在嵌套遍歷，而是單獨的執行遍歷，年是年，月是月，日是日，時是時，分是分，秒是秒，只是在滾動單獨列的時候，再去初始化數據和執行聯動機制，極大的縮短了數據加載的時間。

使用方式上和之前保持不變，通過timeType字段區分時間展示類型。

showDialogTime({titleBarAttribute: {titleText: "年月日-彈窗",},timeAttribute: {timeType: TimeDialogType.YMD,startTime: "2024-10-24",selectTime: "2024-12-24",endTime: "2029-12-10",},timeConfirmClick: (date) => {//時間回調console.log("===時間結果：" + date)},confirmClick: (value, index) => {//內容和索引回調console.log("===內容結果：" + value + "====" + index)}})

優化三、支持多種隱藏模式

之前的版本只支持單一的頂層隱藏模式，也就是從上到下逐一隱藏，但是在有些特殊的場景的，dialog彈出順序不一樣，隱藏順序也不一樣，比如，我彈出了三個彈窗，我要先隱藏第二個，再隱藏第三個和第一個，之前的版本就無法實現，為了解決這個問題，這個版本，增加可以按照索引順序隱藏和按照指定id隱藏的模式。

按照位置索引隱藏

適用于多個彈窗的情況下，只需要傳遞索引即可，比如彈出了三個彈窗，想隱藏第二個，就可以傳索引1。

hidePosition(1)

按照指定id進行隱藏

也僅適用于多彈窗的情況下，和位置索引不同的是，你不需要考慮彈窗的彈出順序，只需要標記彈窗的id，隱藏的時候直接傳id即可。

使用id隱藏需要在彈出彈窗時進行設置id，可以通過dialogAttribute中的dialogId屬性進行設置：

dialogAttribute:{dialogId:"dialogInfo1",
}

隱藏時直接隱藏對應的id即可。

hideDialogId("dialogInfo1")

優化四、toast和loading單獨封裝

之前toast和loading是和普通的彈窗綁定在一起的，由于toast和loading的使用頻率很大，索性就單獨抽取封裝了，防止在使用的時候，造成不必要的問題。

優化五、message內容支持自定義組件

之前的message內容都是字符串形式的，為了兼顧到多樣的需求，本次版本支持大家傳遞自定義組件形式，同樣也支持動態數據的傳遞，支持確認取消形式和信息彈窗形式。

showDialogConfirm({title: "我是標題",messageView: wrapBuilder(MessageView), //傳遞自定義視圖messageData: new TextBean("我是自定義的message視圖", true), //傳遞自定義數據，可以是任意的類型clickConfirm: () => {//確認hide() //隱藏dialog}})