書接上文?HarmonyOS鴻蒙學習基礎(chǔ)篇 - 運行第一個程序 Hello World
基本語法概述
打開 entry>src>main>ets>pages>index.ets 代碼如下
代碼詳細解釋如下：
@Entry
//@Entry裝飾的自定義組件將作為UI頁面的入口。在單個UI頁面中，最多可以使用@Entry裝飾一個自定義組件。
@Component
//@Component是一種裝飾器，代表自定義組件，用@Component 裝飾的 struct Hello 代表一個自定義的結(jié)構(gòu)體，名字是Hello，是可重用的UI單元，可以與其他組件組合。
struct Index {
//@State 是一種裝飾器，被它裝飾的變量 myText 值發(fā)生改變時，會觸發(fā)該變量所對應(yīng)的自定義組件 Hello 的 UI 界面進行自動刷新。
@State message: string = 'Hello World'
build() {
//build 方法中的代碼塊表示UI描述，以聲明式的方式描述UI結(jié)構(gòu)。
Row() {
//Column 是內(nèi)置組件，表示設(shè)置一列
Column() {
//設(shè)置文本及內(nèi)容
Text(this.message)
.fontSize(50) //設(shè)置文本大小
.fontWeight(FontWeight.Bold) //設(shè)置字體加粗
}
.width('100%') //設(shè)置寬度
}
.height('100%') //設(shè)置寬度
}
}在以上示例中，ArkTS的基本組成如下所示。?文章來源：http://www.zghlxwxcb.cn/news/detail-820941.html
文章來源地址http://www.zghlxwxcb.cn/news/detail-820941.html
- 裝飾器： 用于裝飾類、結(jié)構(gòu)、方法以及變量，并賦予其特殊的含義。如上述示例中@Entry、@Component和@State都是裝飾器，@Component表示自定義組件，@Entry表示該自定義組件為入口組件，@State表示組件中的狀態(tài)變量，狀態(tài)變量變化會觸發(fā)UI刷新。
- UI描述：以聲明式的方式來描述UI的結(jié)構(gòu)，例如build()方法中的代碼塊。
- 自定義組件：可復(fù)用的UI單元，可組合其他組件，如上述被@Component裝飾的struct Hello。
- 系統(tǒng)組件：ArkUI框架中默認內(nèi)置的基礎(chǔ)和容器組件，可直接被開發(fā)者調(diào)用，比如示例中的Column、Text、Divider、Button。
- 屬性方法：組件可以通過鏈式調(diào)用配置多項屬性，如fontSize()、width()、height()、backgroundColor()等。
- 事件方法：組件可以通過鏈式調(diào)用設(shè)置多個事件的響應(yīng)邏輯，如跟隨在Button后面的onClick()。系統(tǒng)組件、屬性方法、事件方法具體使用可參考基于ArkTS的聲明式開發(fā)范式。除此之外，ArkTS擴展了多種語法范式來使開發(fā)更加便捷：
- @Builder/@BuilderParam：特殊的封裝UI描述的方法，細粒度的封裝和復(fù)用UI描述。
- @Extend/@Style：擴展內(nèi)置組件和封裝屬性樣式，更靈活地組合內(nèi)置組件。
- stateStyles：多態(tài)樣式，可以依據(jù)組件的內(nèi)部狀態(tài)的不同，設(shè)置不同樣式
到了這里，關(guān)于HarmonyOS鴻蒙學習基礎(chǔ)篇 - 基本語法概述的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
