本申請(qǐng)涉及互聯(lián)網(wǎng)頁(yè)面處理，特別是一種表單顯示方法及相關(guān)裝置。

背景技術(shù)：

1、骨架屏(skeleton?screen)，也被稱為加載占位圖。它是在頁(yè)面數(shù)據(jù)尚未加載前先給用戶展示出頁(yè)面的大致結(jié)構(gòu)，進(jìn)而等到數(shù)據(jù)請(qǐng)求返回后再顯示頁(yè)面的數(shù)據(jù)內(nèi)容，從而替換它。這常用于文章列表、新聞動(dòng)態(tài)列表等內(nèi)容結(jié)構(gòu)相一致的頁(yè)面。其核心目的是在頁(yè)面數(shù)據(jù)加載完成之前，給予用戶即時(shí)而有指導(dǎo)性的視覺(jué)反饋，以此來(lái)提升用戶體驗(yàn)，減輕用戶在等待過(guò)程中的不確定感和不耐煩情緒。

2、目前，一般可以針對(duì)不同的表單開發(fā)適配的骨架屏布局組件，但是需要對(duì)每個(gè)待顯示界面都配置適配的骨架屏組件，開發(fā)代碼量太大導(dǎo)致效率不高。

技術(shù)實(shí)現(xiàn)思路

1、有鑒于此，本申請(qǐng)?zhí)峁┝艘环N表單顯示方法及相關(guān)裝置，可以自動(dòng)呈現(xiàn)與表單一致的骨架屏顯示效果，并且通過(guò)構(gòu)建目標(biāo)組件樹，使得表單渲染和骨架渲染可以無(wú)縫切換，大大提升了用戶體驗(yàn)。

2、第一方面，本申請(qǐng)實(shí)施例提供了一種表單顯示方法，所述方法包括：

3、根據(jù)待顯示表單中每個(gè)表單項(xiàng)的屬性，確定所述每個(gè)表單項(xiàng)對(duì)應(yīng)的表單項(xiàng)控件，其中，每個(gè)表單項(xiàng)控件包括表單項(xiàng)骨架屏組件，每個(gè)表單項(xiàng)骨架屏組件根據(jù)對(duì)應(yīng)的表單項(xiàng)的屬性確定；

4、建立所述每個(gè)表單項(xiàng)的類型與所述每個(gè)表單項(xiàng)控件的映射關(guān)系；

5、根據(jù)所述映射關(guān)系和所述每個(gè)表單項(xiàng)的屬性確定目標(biāo)組件樹；

6、響應(yīng)于表單顯示請(qǐng)求，確定所述待顯示表單的加載狀態(tài)；

7、根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用所述表單項(xiàng)骨架屏組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單。

8、第二方面，本申請(qǐng)實(shí)施例提供了一種表單顯示裝置，所述裝置包括：

9、控件單元，用于根據(jù)待顯示表單中每個(gè)表單項(xiàng)的屬性，確定所述每個(gè)表單項(xiàng)對(duì)應(yīng)的表單項(xiàng)控件，其中，每個(gè)表單項(xiàng)控件包括表單項(xiàng)骨架屏組件，每個(gè)表單項(xiàng)骨架屏組件根據(jù)對(duì)應(yīng)的表單項(xiàng)的屬性確定；

10、映射單元，用于建立所述每個(gè)表單項(xiàng)的類型與所述每個(gè)表單項(xiàng)控件的映射關(guān)系；

11、組件樹單元，用于根據(jù)所述映射關(guān)系和所述每個(gè)表單項(xiàng)的屬性確定目標(biāo)組件樹；

12、加載單元，用于響應(yīng)于表單顯示請(qǐng)求，確定所述待顯示表單的加載狀態(tài)；

13、渲染單元，用于根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用所述表單項(xiàng)骨架屏組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單。

14、第三方面，本申請(qǐng)實(shí)施例提供一種電子設(shè)備，包括處理器、存儲(chǔ)器、通信接口以及一個(gè)或多個(gè)程序，其中，上述一個(gè)或多個(gè)程序被存儲(chǔ)在上述存儲(chǔ)器中，并且被配置由上述處理器執(zhí)行，上述程序包括用于執(zhí)行本申請(qǐng)實(shí)施例第一方面任一方法中的步驟的指令。

15、第四方面，本申請(qǐng)實(shí)施例提供了一種計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)，其中，上述計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)存儲(chǔ)用于電子數(shù)據(jù)交換的計(jì)算機(jī)程序，其中，上述計(jì)算機(jī)程序使得計(jì)算機(jī)執(zhí)行如本申請(qǐng)實(shí)施例第一方面任一方法中所描述的部分或全部步驟。

16、第五方面，本申請(qǐng)實(shí)施例提供了一種計(jì)算機(jī)程序產(chǎn)品，其中，上述計(jì)算機(jī)程序產(chǎn)品包括存儲(chǔ)了計(jì)算機(jī)程序的非瞬時(shí)性計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)，上述計(jì)算機(jī)程序可操作來(lái)使計(jì)算機(jī)執(zhí)行如本申請(qǐng)實(shí)施例第一方面任一方法中所描述的部分或全部步驟。該計(jì)算機(jī)程序產(chǎn)品可以為一個(gè)軟件安裝包。

17、可見(jiàn)，通過(guò)上述表單顯示方法及相關(guān)裝置，首先，根據(jù)待顯示表單中每個(gè)表單項(xiàng)的屬性，確定所述每個(gè)表單項(xiàng)對(duì)應(yīng)的表單項(xiàng)控件，其中，每個(gè)表單項(xiàng)控件包括表單項(xiàng)骨架屏組件，每個(gè)表單項(xiàng)骨架屏組件根據(jù)對(duì)應(yīng)的表單項(xiàng)的屬性確定；然后，建立所述每個(gè)表單項(xiàng)的類型與所述每個(gè)表單項(xiàng)控件的映射關(guān)系；接著，根據(jù)所述映射關(guān)系和所述每個(gè)表單項(xiàng)的屬性確定目標(biāo)組件樹；然后，響應(yīng)于表單顯示請(qǐng)求，確定所述待顯示表單的加載狀態(tài)；最后，根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用所述表單項(xiàng)骨架屏組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單。可以自動(dòng)呈現(xiàn)與表單一致的骨架屏顯示效果，并且通過(guò)構(gòu)建目標(biāo)組件樹，使得表單渲染和骨架渲染可以無(wú)縫切換，大大提升了用戶體驗(yàn)。

技術(shù)特征：

1.一種表單顯示方法，其特征在于，所述方法包括：

2.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述表單項(xiàng)控件還包括表單項(xiàng)顯示組件；所述根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用所述表單項(xiàng)骨架屏組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單之后，所述方法還包括：

3.根據(jù)權(quán)利要求2所述的方法，其特征在于，所述根據(jù)待顯示表單中每個(gè)表單項(xiàng)的屬性，確定所述每個(gè)表單項(xiàng)對(duì)應(yīng)的表單項(xiàng)控件，包括：

4.根據(jù)權(quán)利要求3所述的方法，其特征在于，所述從預(yù)設(shè)骨架屏組件數(shù)據(jù)庫(kù)中，確定所述每個(gè)表單項(xiàng)的屬性匹配的所述每個(gè)表單項(xiàng)骨架屏組件，包括：

5.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述根據(jù)所述映射關(guān)系和所述每個(gè)表單項(xiàng)的屬性確定目標(biāo)組件樹，包括：

6.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用所述表單項(xiàng)骨架屏組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單，包括：

7.根據(jù)權(quán)利要求6所述的方法，其特征在于，所述根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用所述表單項(xiàng)顯示組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單，包括：

8.根據(jù)權(quán)利要求7所述的方法，其特征在于，所述根據(jù)所述映射關(guān)系和所述每個(gè)表單項(xiàng)的屬性確定目標(biāo)組件樹之后，所述方法還包括：

9.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述根據(jù)待顯示表單中每個(gè)表單項(xiàng)的屬性，確定所述每個(gè)表單項(xiàng)對(duì)應(yīng)的表單項(xiàng)控件之前，所述方法還包括：

10.根據(jù)權(quán)利要求9所述的方法，其特征在于，所述方法還包括：

11.一種表單顯示裝置，其特征在于，所述裝置包括：

12.一種電子設(shè)備，其特征在于，包括：處理器，存儲(chǔ)器，以及一個(gè)或多個(gè)程序；所述一個(gè)或多個(gè)程序被存儲(chǔ)在所述存儲(chǔ)器中，并且被配置成由所述處理器執(zhí)行，所述程序包括用于執(zhí)行如權(quán)利要求1-10任一項(xiàng)所述的方法中的步驟的指令。

13.一種計(jì)算機(jī)存儲(chǔ)介質(zhì)，其特征在于，所述計(jì)算機(jī)存儲(chǔ)介質(zhì)存儲(chǔ)有計(jì)算機(jī)程序，所述計(jì)算機(jī)程序包括程序指令，所述程序指令當(dāng)被處理器執(zhí)行時(shí)使所述處理器執(zhí)行如權(quán)利要求1-10任一項(xiàng)所述的方法。

技術(shù)總結(jié)
本申請(qǐng)?zhí)峁┝艘环N表單顯示方法及相關(guān)裝置，根據(jù)待顯示表單中每個(gè)表單項(xiàng)的屬性，確定所述每個(gè)表單項(xiàng)對(duì)應(yīng)的表單項(xiàng)控件；然后，建立所述每個(gè)表單項(xiàng)的類型與所述每個(gè)表單項(xiàng)控件的映射關(guān)系；接著，根據(jù)所述映射關(guān)系和所述每個(gè)表單項(xiàng)的屬性確定目標(biāo)組件樹；然后，響應(yīng)于表單顯示請(qǐng)求，確定所述待顯示表單的加載狀態(tài)；最后，根據(jù)所述加載狀態(tài)，從所述目標(biāo)組件樹中調(diào)用表單項(xiàng)骨架屏組件進(jìn)行渲染，顯示所述加載狀態(tài)匹配的所述待顯示表單。可以自動(dòng)呈現(xiàn)與表單一致的骨架屏顯示效果，并且通過(guò)構(gòu)建目標(biāo)組件樹，使得表單渲染和骨架渲染可以無(wú)縫切換，大大提升了用戶體驗(yàn)。

技術(shù)研發(fā)人員：譚杰
受保護(hù)的技術(shù)使用者：馬上消費(fèi)金融股份有限公司
技術(shù)研發(fā)日：
技術(shù)公布日：2025/1/9