本書(shū)以倉(cāng)頡的UI實(shí)戰(zhàn)為主，語(yǔ)法部分介紹了主要組成部分，快速且形象地闡述了倉(cāng)頡編程語(yǔ)言的主要特性，讓零編程基礎(chǔ)的新手都可以迅速入門(mén)倉(cāng)頡，在此基礎(chǔ)上結(jié)合互聯(lián)網(wǎng)熱門(mén)垂直領(lǐng)域的潮流App設(shè)計(jì)，帶您深入場(chǎng)景式UI開(kāi)發(fā)體驗(yàn)。利用CangjieUI 鴻蒙的組合，能夠讓我們?cè)陂_(kāi)發(fā)基于DSL的App應(yīng)用時(shí)超快上手，從而可以快速開(kāi)發(fā)基于鴻蒙乃至跨平臺(tái)的應(yīng)用UI。
本書(shū)共兩部分。第1~9章介紹倉(cāng)頡基礎(chǔ)編程知識(shí)，從零起步介紹了倉(cāng)頡主要特性如面向?qū)ο缶幊�、面向接口編程、函�?shù)式編程等，聚焦在語(yǔ)法層面。第10~21章基于強(qiáng)大的CangjieUI框架，實(shí)際切入各種場(chǎng)景化的精美AppUI開(kāi)發(fā)案例，助力讀者徹底地掌握使用CangjieUI框架開(kāi)發(fā)各種復(fù)雜AppUI的技巧。本書(shū)案例豐富，實(shí)操性系統(tǒng)性強(qiáng)，輔助讀者更快地掌握本書(shū)的要點(diǎn)、難點(diǎn)。
本書(shū)既可以成為倉(cāng)頡初學(xué)者的入門(mén)書(shū)，也可以為想從事倉(cāng)頡應(yīng)用開(kāi)發(fā)的人士或培訓(xùn)機(jī)構(gòu)，提供前置知識(shí)參考。

本書(shū)是一本基礎(chǔ)快速入門(mén)加UI實(shí)戰(zhàn)的書(shū)，有基礎(chǔ)知識(shí)，有豐富示例，還有詳細(xì)的操作步驟，實(shí)操性非常強(qiáng)。本書(shū)第1~9章介紹倉(cāng)頡基礎(chǔ)編程知識(shí)，第10~21章屬于UI實(shí)戰(zhàn)案例，這些例子彼此之間相互獨(dú)立，讀者在掌握了前面的基礎(chǔ)知識(shí)后，可以通過(guò)11個(gè)非常有代表性的App案例項(xiàng)目來(lái)全面掌握CangjieUI的開(kāi)發(fā)過(guò)程。

　　近年來(lái)，隨著信息產(chǎn)業(yè)的國(guó)產(chǎn)化浪潮席卷而來(lái)，與芯片、操作系統(tǒng)、應(yīng)用框架、編程語(yǔ)言相關(guān)的基礎(chǔ)設(shè)施如雨后春筍般崛起。在這個(gè)歷史機(jī)遇下，以華為公司為代表的一些領(lǐng)頭羊企業(yè)成為弄潮兒。OpenHarmony打響了國(guó)產(chǎn)自主操作系統(tǒng)的第一槍?zhuān)�而且眾多與OpenHarmony生態(tài)相關(guān)的公司正在誕生�？梢灶A(yù)見(jiàn)，OpenHarmony可以成為與Android、 iOS兩大移動(dòng)端操作系統(tǒng)比肩的新力量，將來(lái)甚至可達(dá)到與macOS、Windows等桌面端系統(tǒng)的高度，而華為的另一力作倉(cāng)頡編程語(yǔ)言，必將是OpenHarmony之上的堅(jiān)實(shí)代碼 依靠。
　　本書(shū)以倉(cāng)頡的UI實(shí)戰(zhàn)為主，語(yǔ)法部分介紹了倉(cāng)頡編程語(yǔ)言的主要組成部分，形象地闡述了倉(cāng)頡編程語(yǔ)言的主要特性，讓零編程基礎(chǔ)的新手也可以迅速入門(mén)倉(cāng)頡，在此基礎(chǔ)上結(jié)合互聯(lián)網(wǎng)熱門(mén)垂直領(lǐng)域的潮流App設(shè)計(jì)，帶領(lǐng)讀者深入場(chǎng)景式UI開(kāi)發(fā)體驗(yàn)。利用CangjieUI OpenHarmony的組合，能夠讓讀者在開(kāi)發(fā)基于DSL的App時(shí)超快上手，從而可以快速開(kāi)發(fā)基于OpenHarmony乃至跨平臺(tái)的應(yīng)用UI。
本書(shū)主要內(nèi)容
　　本書(shū)內(nèi)容是筆者在充分實(shí)踐的過(guò)程中總結(jié)歸納得出的，一共分為兩部分，內(nèi)容如下：
　　第1章概要介紹倉(cāng)頡的定位和主要特性。
　　第2章介紹如何開(kāi)發(fā)第1個(gè)倉(cāng)頡Hello?World程序。
　　第3章從一個(gè)日常生活的應(yīng)用場(chǎng)景引出倉(cāng)頡的語(yǔ)法基礎(chǔ)，讓讀者快速入門(mén)這門(mén)語(yǔ)言的大部分主要內(nèi)容。
　　第4章介紹倉(cāng)頡語(yǔ)法中的高級(jí)類(lèi)型和類(lèi)型轉(zhuǎn)換。
　　第5章介紹倉(cāng)頡的面向接口編程理念。
　　第6章介紹倉(cāng)頡的函數(shù)式編程特性及一些常用的高級(jí)函數(shù)。
　　第7章介紹當(dāng)程序遇到異常時(shí)，在倉(cāng)頡語(yǔ)言中是如何處理的，包括現(xiàn)代編程語(yǔ)言中對(duì)空的新式處理。
　　第8章介紹非常流行的泛型編程，以及泛型接口和泛型約束等新奇方法。
　　第9章描述在倉(cāng)頡語(yǔ)言中對(duì)異步編程和多線(xiàn)程的處理。
　　第10章開(kāi)始全面介紹倉(cāng)頡的UI框架，以及CangjieUI的基本使用方法。
　　第11章以咖啡杯的杯型選擇為例，介紹CangjieUI中構(gòu)建互動(dòng)式UI的精髓要點(diǎn)，學(xué)完此章便可掌握如何快速構(gòu)建App的UI組件。
　　第12章給出一個(gè)耳目一新的創(chuàng)意應(yīng)用飛我電瓶車(chē)，以打電瓶車(chē)為例，構(gòu)建一個(gè)相關(guān)的整體UI。
　　第13章介紹一個(gè)智能家居控制的應(yīng)用鴻蒙之家，覆蓋了家庭內(nèi)常用的智能化電器控制總覽、單獨(dú)控制的UI及用電量的柱狀圖統(tǒng)計(jì)互動(dòng)實(shí)現(xiàn)，其中有網(wǎng)格組件Grid的使用，并且實(shí)現(xiàn)了一個(gè)系統(tǒng)尚未提供開(kāi)關(guān)組件的從零開(kāi)始的UI和互動(dòng)實(shí)現(xiàn)。
　　第14章描繪一個(gè)非常經(jīng)典的租車(chē)應(yīng)用主要頁(yè)面的實(shí)現(xiàn)，以及滾動(dòng)列表的應(yīng)用。
　　第15章帶來(lái)筆者在HarmonyOS開(kāi)發(fā)者創(chuàng)新大賽中決賽獲獎(jiǎng)作品智能打蒜器第1個(gè)版本的UI實(shí)現(xiàn)。
　　第16章是一個(gè)日常生活中使用頻率高的應(yīng)用絕汁水果。實(shí)現(xiàn)一個(gè)瀑布流的水果縮略圖布局，以及頁(yè)面式按鈕的實(shí)現(xiàn)。在頁(yè)面過(guò)渡時(shí)，首次使用了共享轉(zhuǎn)場(chǎng)的視覺(jué)特效，非常驚艷。
　　第17章使用一些CangjieUI中的動(dòng)畫(huà)特效實(shí)現(xiàn)了一個(gè)旅游應(yīng)用暢游。啟動(dòng)頁(yè)第一眼看過(guò)去就會(huì)讓用戶(hù)產(chǎn)生旅游的沖動(dòng)，首頁(yè)和內(nèi)頁(yè)的配合和布局恰到好處，可滿(mǎn)足用戶(hù)追求高端素雅的旅游產(chǎn)品需求。
　　第18章來(lái)到一個(gè)音樂(lè)應(yīng)用起司播客。作為用戶(hù)經(jīng)常使用的一種類(lèi)型應(yīng)用，如何布局和配色達(dá)到藝術(shù)審美是非常重要的。超美且簡(jiǎn)潔的UI是用戶(hù)使用音樂(lè)類(lèi)App的一大要素。
　　第19章通過(guò)一個(gè)風(fēng)格化的旅游拼團(tuán)App，來(lái)介紹如何通過(guò)漸變、瀑布流、頭像堆疊等CangjieUI中的經(jīng)典用法，實(shí)現(xiàn)一個(gè)有深度的文化類(lèi)應(yīng)用。
　　第20章以一個(gè)Web端的生鮮配送網(wǎng)站為例，介紹CangjieUI在大尺寸屏幕上布局的應(yīng)用能力。
　　第21章以一個(gè)炫彩流光的美妝電商網(wǎng)站為例，介紹如何制作復(fù)雜層次感和在深色系統(tǒng)主題背景下的高級(jí)UI組合。為最終使用CangjieUI實(shí)現(xiàn)復(fù)雜精美的平面應(yīng)用UI布局打下堅(jiān)實(shí)基礎(chǔ)。
閱讀建議
　　本書(shū)是一本基礎(chǔ)快速入門(mén)加UI實(shí)戰(zhàn)的書(shū)，有基礎(chǔ)知識(shí)，有豐富示例，還有詳細(xì)的操作步驟，實(shí)操性非常強(qiáng)。倉(cāng)頡語(yǔ)言?xún)?nèi)容較多且處于發(fā)展階段，所以本書(shū)力求精簡(jiǎn)，提供了代碼供讀者參照，由于Cangjie和CangjieUI框架更新比較快，建議讀者屆時(shí)獲取最新的源代碼以便可以立即復(fù)刻出效果。
　　本書(shū)從第10章開(kāi)始講解UI實(shí)戰(zhàn)案例，讀者在掌握了前面的基礎(chǔ)知識(shí)后，可以通過(guò) 11個(gè)非常有代表性的App案例項(xiàng)目來(lái)全面掌握CangjieUI的開(kāi)發(fā)過(guò)程。不過(guò)讀者無(wú)須按部就班地按書(shū)中的順序?qū)W習(xí)這些案例，因?yàn)檫@些例子彼此之間相互獨(dú)立，任意選擇其中一章開(kāi)始即可。
本書(shū)源代碼和配套資源
　　掃描下方二維碼，可獲取本書(shū)源代碼，以及第11~21章的工程圖片資源。

本書(shū)配套資源
致謝
　　首先感謝家人在筆者寫(xiě)作過(guò)程中的理解和鼓勵(lì)，使本書(shū)的順利出版成為可能，寫(xiě)作期間一直得到華為倉(cāng)頡團(tuán)隊(duì)的技術(shù)支持，在此表示衷心感謝；其次感謝清華大學(xué)出版社趙佳霓編輯的耐心幫助。
　　由于水平和時(shí)間的限制，本書(shū)難免存在疏漏之處，請(qǐng)讀者見(jiàn)諒并不吝提出寶貴意見(jiàn)。
　　
　　 張?jiān)撇?br />　　2024年5月

II

III

張?jiān)撇?，一個(gè)喜歡嘗試前沿領(lǐng)域的自由程序員，花川學(xué)院創(chuàng)始人、華為開(kāi)發(fā)專(zhuān)家（Huawei Developer Experts，HDE）、首屆HarmonyOS開(kāi)發(fā)者創(chuàng)新大賽導(dǎo)師、第二屆HarmonyOS開(kāi)發(fā)者創(chuàng)新大賽科技創(chuàng)新獎(jiǎng)得主、51CTO開(kāi)源技術(shù)社區(qū)MVP、潤(rùn)和軟件HiHope社區(qū)專(zhuān)家、未來(lái)杯HarmonyOS技術(shù)應(yīng)用創(chuàng)新大賽導(dǎo)師。曾就職于IBM、SAP、SONY等公司，具有豐富的工作經(jīng)驗(yàn)。從蘋(píng)果Swift、微信小程序、區(qū)塊鏈，到如今的鴻蒙和倉(cāng)頡，自然不能錯(cuò)過(guò)，希望可以親眼見(jiàn)證IT行業(yè)國(guó)產(chǎn)化的深度崛起。

第1章 倉(cāng)頡概覽 1
1.1 倉(cāng)頡的定位 1
1.2 倉(cāng)頡主要特性 1
第2章 第1個(gè)倉(cāng)頡程序 4
2.1 安裝及查看倉(cāng)頡版本 4
2.2 Hello World 5
2.2.1 編寫(xiě)第1個(gè)程序 5
2.2.2 代碼編譯和執(zhí)行 5
第3章 倉(cāng)頡語(yǔ)法基礎(chǔ) 6
3.1 常量和變量 6
3.2 類(lèi)型自動(dòng)推斷 8
3.3 兩種數(shù)值類(lèi)型 8
3.4 布爾類(lèi)型 8
3.5 流向控制 9
3.6 字符串類(lèi)型 11
3.7 區(qū)間類(lèi)型 12
3.8 循環(huán)控制 12
3.9 字符串插值 13
3.10 函數(shù) 13
3.11 運(yùn)算符 16
3.12 使用庫(kù)函數(shù) 16
3.13 使用集合類(lèi)型 17
3.14 本章小結(jié) 20
第4章 高級(jí)類(lèi)型 21
4.1?記錄類(lèi)型 21
4.2?枚舉類(lèi)型 24
4.3?類(lèi) 25
4.3.1?類(lèi)的封裝 25
4.3.2?類(lèi)的繼承和多態(tài) 29
4.4?類(lèi)型轉(zhuǎn)換 33
4.5?本章小結(jié) 37
第5章 面向接口編程 38
5.1 接口 38
5.2 擴(kuò)展既有類(lèi)型 40
5.3 面向接口編程 41
5.4 定義基礎(chǔ)接口 43
5.5 實(shí)現(xiàn)接口的類(lèi)型 44
5.6 給接口擴(kuò)展默認(rèn)的實(shí)現(xiàn) 53
5.7 枚舉類(lèi)型的接口實(shí)現(xiàn) 55
5.8 覆蓋默認(rèn)行為 55
5.9 接口的通用化 56
5.10 本章小結(jié) 58
第6章 函數(shù)高級(jí)特性 59
6.1 函數(shù)類(lèi)型 59
6.2 使用函數(shù)類(lèi)型的3種方式 60
6.3 閉包表達(dá)式 62
6.4 尾隨閉包 63
6.5 函數(shù)重載 65
6.6 構(gòu)造函數(shù) 66
6.7 系統(tǒng)中的高級(jí)函數(shù) 66
6.7.1 map 67
6.7.2 compactMap 68
6.7.3 filter 68
6.7.4 reduce 68
6.8 本章小結(jié) 69
第7章 程序異常處理 70
7.1 異常的分類(lèi) 70
7.2 拋出一個(gè)異常 71
7.3 Result類(lèi)型 73
7.4 解包Result類(lèi)型 74
7.5 Option類(lèi)型 76
7.6 本章小結(jié) 77
第8章 泛型編程 78
8.1 常見(jiàn)的泛型化案例 78
8.2 泛型接口 79
8.3 泛型類(lèi)型 81
8.4 泛型函數(shù) 83
8.5 泛型約束 83
8.6 本章小結(jié) 84
第9章 異步編程 85
9.1 新線(xiàn)程 85
9.2 異步等待 92
9.3 線(xiàn)程休眠 103
第10章 倉(cāng)頡UI框架 104
10.1 文件組織 104
10.2 聲明式語(yǔ)法 105
10.3 狀態(tài)管理 105
10.4 生命周期 107
10.5 裝飾器變量 107
10.6 樣式 108
10.7 常用組件 109
10.7.1 容器組件 109
10.7.2 獨(dú)立組件 112
10.8 系統(tǒng)接口現(xiàn)狀 115
第11章 倉(cāng)頡UI實(shí)戰(zhàn)案例：咖啡杯 116
11.1 杯型定義 117
11.2 定義資源 118
11.2.1 圖片資源 118
11.2.2 文字資源 118
11.2.3 顏色資源 119
11.3 新建組件的源碼文件 120
11.4 數(shù)據(jù)源和狀態(tài)變量定義 120
11.5 單個(gè)杯型的布局 121
11.6 樣式定義 121
11.7 條件樣式 122
11.8 用戶(hù)互動(dòng) 122
11.9 循環(huán)渲染 123
11.10 容器包裝 124
11.10.1 序號(hào)顯示 124
11.10.2 均分空間 125
11.10.3 描邊和圓角 126
11.11 組合 127
11.12 組件重用 128
第12章 倉(cāng)頡UI案例：飛我電瓶車(chē) 130
12.1 資源導(dǎo)入 131
12.2 啟動(dòng)頁(yè)結(jié)構(gòu) 131
12.3 最終啟動(dòng)頁(yè) 137
12.4 加載指示器組件 140
12.4.1 組件結(jié)構(gòu) 140
12.4.2 旋轉(zhuǎn)動(dòng)畫(huà) 141
12.5 目的地頁(yè) 141
12.5.1 歷史數(shù)據(jù) 141
12.5.2 狀態(tài)變量 142
12.5.3 下單函數(shù) 142
12.5.4 彈性面板組件 143
12.5.5 List組件 143
12.5.6 組合 144
12.6 下單成功提示頁(yè) 149
12.6.1 狀態(tài)變量 149
12.6.2 純組件 150
12.6.3 預(yù)覽用組件 152
12.6.4 組合 153
12.7 騎手當(dāng)前位置頁(yè) 156
12.7.1 狀態(tài)變量 156
12.7.2 純組件 157
12.7.3 預(yù)覽用組件 158
第13章 倉(cāng)頡UI案例：鴻蒙之家 160
13.1 資源導(dǎo)入 160
13.2 啟動(dòng)頁(yè) 161
13.2.1 橫幅數(shù)據(jù) 161
13.2.2 組件結(jié)構(gòu) 162
13.2.3 開(kāi)始按鈕 163
13.3 首頁(yè) 164
13.3.1 全屋智能家電數(shù)據(jù) 164
13.3.2 導(dǎo)航區(qū)域 165
13.3.3 數(shù)據(jù)網(wǎng)格 166
13.3.4 選項(xiàng)條 169
13.3.5 組合 170
13.4 開(kāi)關(guān)組件 170
13.4.1 組件結(jié)構(gòu) 170
13.4.2 狀態(tài)變量 171
13.4.3 顏色定義 171
13.4.4 單擊動(dòng)畫(huà) 171
13.4.5 純組件 172
13.4.6 預(yù)覽用組件 172
13.4.7 組合 173
13.5 房屋智能讀數(shù)結(jié)構(gòu) 173
13.6 用電量組件 174
13.6.1 狀態(tài)變量 174
13.6.2 組件結(jié)構(gòu) 175
13.6.3 組合測(cè)試 177
13.7 詳情頁(yè) 181
13.7.1 狀態(tài)變量 181
13.7.2 導(dǎo)航欄 182
13.7.3 溫濕度卡片 182
13.7.4 用電量柱狀圖 184
13.7.5 設(shè)備列表卡片 184
13.7.6 組合測(cè)試 187
第14章 倉(cāng)頡UI案例：卡星租車(chē) 196
14.1 資源導(dǎo)入 198
14.2 啟動(dòng)頁(yè)結(jié)構(gòu) 199
14.2.1 躍動(dòng)的標(biāo)志 199
14.2.2 中部文本 200
14.2.3 底部按鈕 201
14.2.4 組合 202
14.3 車(chē)型數(shù)據(jù)結(jié)構(gòu) 202
14.4 地圖定位頁(yè) 203
14.5 預(yù)訂頁(yè) 205
14.5.1 搜索欄 206
14.5.2 標(biāo)題欄 207
14.5.3 篩選欄 207
14.5.4 車(chē)型列表區(qū)域 209
14.5.5 組合 213
14.6 車(chē)型詳情頁(yè) 213
14.6.1 狀態(tài)變量 214
14.6.2 純組件 214
14.6.3 組合 223
第15章 倉(cāng)頡UI案例：智能打蒜器 224
15.1 資源導(dǎo)入 225
15.2 首頁(yè)結(jié)構(gòu) 226
15.3 功能層 226
15.3.1 狀態(tài)變量 226
15.3.2 面板控制區(qū)域 226
15.3.3 文字提示區(qū)域 227
15.4 開(kāi)關(guān)燈指示層 227
第16章 倉(cāng)頡UI案例：絕汁水果 229
16.1 資源導(dǎo)入 230
16.2 啟動(dòng)頁(yè)結(jié)構(gòu) 231
16.2.1 橫幅數(shù)據(jù) 231
16.2.2 橫幅組件 231
16.2.3 進(jìn)入按鈕 233
16.2.4 組合 233
16.3 首頁(yè) 234
16.3.1 狀態(tài)變量 234
16.3.2 標(biāo)題欄 236
16.3.3 水果卡片 237
16.3.4 組合 240
16.4 詳情頁(yè) 240
16.4.1 狀態(tài)變量 241
16.4.2 添加至購(gòu)物車(chē)函數(shù) 241
16.4.3 頁(yè)面結(jié)構(gòu) 242
16.4.4 組合 246
第17章 倉(cāng)頡UI案例：暢游 247
17.1 資源導(dǎo)入 248
17.2 啟動(dòng)頁(yè)結(jié)構(gòu) 249
17.2.1 背景層 249
17.2.2 文字層 250
17.2.3 動(dòng)效層 252
17.2.4 組合 254
17.3 首頁(yè) 255
17.3.1 旅游產(chǎn)品數(shù)據(jù) 255
17.3.2 狀態(tài)變量 256
17.3.3 導(dǎo)航欄 256
17.3.4 文字欄 257
17.3.5 篩選欄 257
17.3.6 旅游卡片列表 258
17.3.7 選項(xiàng)卡 260
17.3.8 組合 261
17.4 詳情頁(yè) 262
17.4.1 狀態(tài)變量 262
17.4.2 背景層 262
17.4.3 導(dǎo)航欄 262
17.4.4 品名和價(jià)格區(qū) 263
17.4.5 預(yù)訂區(qū) 265
17.4.6 組合 268
第18章 倉(cāng)頡UI案例：起司播客 270
18.1 資源導(dǎo)入 271
18.2 首頁(yè)結(jié)構(gòu) 272
18.2.1 導(dǎo)航欄 272
18.2.2 分類(lèi)標(biāo)題 273
18.2.3 分類(lèi)卡片列表 273
18.2.4 篩選欄 278
18.2.5 音樂(lè)列表 280
18.2.6 組合 284
18.3 頻道頁(yè) 285
18.3.1?播客作品數(shù)據(jù) 285
18.3.2 導(dǎo)航欄 286
18.3.3 播客個(gè)人信息區(qū)域 286
18.3.4 播客作品列表 287
18.3.5 組合 289
18.4 播放頁(yè) 290
18.4.1 狀態(tài)變量 290
18.4.2 導(dǎo)航欄 291
18.4.3 作品大圖 292
18.4.4 作品名和作者 292
18.4.5 播放控制按鈕 293
18.4.6 組合 294
第19章 倉(cāng)頡UI案例：世界巡游團(tuán) 295
19.1 資源導(dǎo)入 296
19.2 啟動(dòng)頁(yè) 297
19.2.1 封面組件 297
19.2.2 啟動(dòng)按鈕組件 302
19.2.3 背景色 303
19.2.4 右側(cè)封面修正 303
19.2.5 組合 304
19.3 首頁(yè) 306
19.3.1 導(dǎo)航組件 306
19.3.2 口號(hào)文字組件 308
19.3.3 搜索條組件 309
19.3.4 篩選按鈕欄 311
19.3.5 推薦卡片列表組件 315
19.3.6 選項(xiàng)卡組件 331
19.3.7 首頁(yè)的調(diào)整優(yōu)化 335
19.4 詳情頁(yè) 338
19.4.1 導(dǎo)航欄 338
19.4.2 縮略圖列表 340
19.4.3 詳情卡片 342
19.4.4 組合 350
第20章 倉(cāng)頡UI案例：生鮮配送網(wǎng) 353
20.1 資源導(dǎo)入 354
20.2 首頁(yè)結(jié)構(gòu) 355
20.3 導(dǎo)航 355
20.3.1 陰影層 356
20.3.2 菜單層 357
20.3.3 菜單陰影效果 357
20.3.4 菜單內(nèi)容 358
20.4 上半部分 362
20.4.1 背景圖片層 363
20.4.2 主題文字層 367
20.4.3 右側(cè)指示圖片層 371
20.4.4 組合 372
20.5 中間部分 379
20.6 下半部分 380
20.6.1 卡片結(jié)構(gòu) 380
20.6.2 卡片背景 381
20.6.3 卡片內(nèi)容 383
20.6.4 卡片列表 388
20.6.5 卡片列表容器背景 393
20.6.6 組合 394
20.7 下半屏預(yù)覽 395
第21章 倉(cāng)頡UI案例：溢彩美妝網(wǎng) 397
21.1 資源導(dǎo)入 398
21.2 啟動(dòng)頁(yè)結(jié)構(gòu) 399
21.3 背景層 399
21.3.1 漸變流動(dòng)光影 399
21.3.2 圖形襯邊 401
21.3.3 組合 407
21.4 導(dǎo)航 410
21.4.1 大標(biāo)題 410
21.4.2 導(dǎo)航菜單 410
21.4.3 右側(cè)圖標(biāo)組 411
21.4.4 組合 412
21.5 主題文字區(qū) 414
21.5.1 小標(biāo)題 414
21.5.2 大標(biāo)題 415
21.5.3 副標(biāo)題 416
21.5.4 按鈕組 416
21.5.5 組合 417
21.6 圖片區(qū) 420
21.6.1 雙卡片組 420
21.6.2 橫幅卡片 421
21.6.3 組合 421
21.7 評(píng)價(jià)浮層 424
21.7.1 評(píng)價(jià)卡片 424
21.7.2 評(píng)價(jià)頭像 425
21.7.3 組合 425
21.8 組裝首頁(yè) 427

　　
VI

VII