鴻蒙#2020征文-TV# 3.1.1 文本組件 - Text
想了解更多內(nèi)容，請(qǐng)?jiān)L問(wèn)：
51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)
https://harmonyos.51cto.com/#zz
文本組件是我們最常用的組件之一，它是用來(lái)在UI界面上顯示字符串。作為基本組件，有很多擴(kuò)展，常見(jiàn)的有按鈕組件Button、文本編輯組件TextFiled、計(jì)時(shí)器組件TickTimer，它們都是Text組件的擴(kuò)展(也稱為Text的子類)。
Text(文本組件)是Component類的子類之一，所以它能夠使用Component類的所有公開(kāi)的屬性和方法(后面章節(jié)會(huì)詳細(xì)介紹該類)，Text類自身也提供了一些特殊的屬性、方法、內(nèi)部類和接口。
1、從源代碼入手
閱讀官方的Java API文檔看結(jié)構(gòu)不是很清晰，所以我們?cè)贒evEco中查看源代碼。
- /**
- * 繼承Component類
- */
- public class Text extends Component {}
這里我們說(shuō)一下如何查看類的繼承關(guān)系，由于DevEco是基于開(kāi)源的社區(qū)版，它是沒(méi)有Diagrams功能的，我們可以使用第二種方法Navigate --> Type Hierarchy(或者F4)來(lái)查看關(guān)系圖。
我們可以點(diǎn)擊DevEco界面左側(cè)選項(xiàng)卡Structure查看類中詳細(xì)結(jié)構(gòu)，我們可以看到Text自身提供了很多屬性和方法，同時(shí)也繼承父類的很多屬性和方法。
- /**
- * 默認(rèn)構(gòu)造函數(shù)
- * 用于使用默認(rèn)屬性和樣式創(chuàng)建文本實(shí)例
- * @param context
- */
- public Text(Context context) {}
- /**
- * 提供了用于在XML解析后使用指定的屬性集合和默認(rèn)樣式創(chuàng)建文本實(shí)例的構(gòu)造函數(shù)
- * @param context
- * @param attrSet
- */
- public Text(Context context, AttrSet attrSet) {}
- /**
- * 提供了用于在XML解析后使用指定的屬性集和指定的樣式創(chuàng)建文本實(shí)例的構(gòu)造函數(shù)
- * @param context
- * @param attrSet
- * @param styleName
- */
- public Text(Context context, AttrSet attrSet, String styleName) {}
我們?cè)诖a中要給布局添加組件時(shí)，需要先創(chuàng)建組件對(duì)象。使用磨人的構(gòu)造函數(shù)創(chuàng)建Text對(duì)象，后面兩種構(gòu)造函數(shù)我們這里不做過(guò)多說(shuō)明，這兩種是用于自定義組件時(shí)使用的，后面自定義組件小節(jié)中會(huì)詳細(xì)介紹，期待吧。
- //創(chuàng)建Text對(duì)象
- Text text = new Text(this);
我們可以在Structure中看到Text類有很多屬性，比如設(shè)置文本內(nèi)容的text屬性、設(shè)置文本內(nèi)容顏色的textColor屬性、設(shè)置文本內(nèi)容字體大小的textSize屬性，及設(shè)置文本內(nèi)容字體的font屬性等。也有繼承自父類的屬性，比如設(shè)置文本寬度的width屬性、設(shè)置文本高度的height屬性等。
- //1. 創(chuàng)建Text對(duì)象
- Text text = new Text(this);
- //2. 設(shè)置文本內(nèi)容寬高
- text.setWidth(ComponentContainer.LayoutConfig.MATCH_PARENT);
- text.setHeight(ComponentContainer.LayoutConfig.MATCH_PARENT);
- //3. 設(shè)置顯示內(nèi)容
- text.setText("我是在代碼創(chuàng)建的Text。");
- //4. 設(shè)置文字大小
- text.setTextSize(50, Text.TextSizeType.FP);
- //5. 設(shè)置文字顏色
- text.setTextColor(Color.BLUE);
- //6. 添加組件到布局中
- layout.addComponent(text);
我們可以啟動(dòng)一下我們的模擬器，查看是不是在界面中顯示了我們?cè)O(shè)置的文本內(nèi)容。
當(dāng)然組件不僅僅是做顯示使用的，我們還可以在組件上添加監(jiān)聽(tīng)事件，來(lái)實(shí)現(xiàn)交互效果，比如我們點(diǎn)擊界面中的文字內(nèi)容，讓它顯示成其他的內(nèi)容。
我們現(xiàn)在使用的是代碼中構(gòu)建UI界面，當(dāng)然官方也給我們提供了在XML中聲明布局，添加組件，在代碼中設(shè)置界面入口只需要指定它在內(nèi)存中的地址。如果我們要對(duì)組件進(jìn)行監(jiān)聽(tīng)，需要指定其在內(nèi)存中的地址，然后創(chuàng)建對(duì)象完成監(jiān)聽(tīng)操作。
在resources --> base目錄下創(chuàng)建layout目錄(目錄下的文件就是布局資源)，然后在該目錄下創(chuàng)建布局資源文件(后綴為.xml)，然后在XML中聲明布局和組件。
- xmlns:ohos="http://schemas.huawei.com/res/ohos"
- ohos:height="match_parent"
- ohos:width="match_parent"
- ohos:orientation="vertical">
- ohos:id="$+id:text_helloworld"
- ohos:height="match_parent"
- ohos:width="match_parent"
- ohos:layout_alignment="horizontal_center"
- ohos:text="我是在XML中聲明的Text。"
- ohos:text_size="50"
- />
- //在AbilitySlice的onStart方法中設(shè)置界面入口，這里指定頁(yè)面在內(nèi)存中的地址
- super.setUIContent(ResourceTable.Layout_ability_text_xml);
2、常用屬性和方法
到這里我們已經(jīng)對(duì)Text有了大致的了解，對(duì)兩種編寫布局的方式也有了大致的了解。Text有很多屬性和方法，我們?cè)谶@里給大家列出常用的幾個(gè)屬性和方法。
Text常用屬性
Text常用方法
- ohos:id="$+id:text_helloworld"
- ohos:height="match_content"
- ohos:width="match_content"
- ohos:text="我是在XML中聲明的Text。"
- ohos:text_size="50fp"
- />
- ohos:id="$+id:text_auto_font_size"
- ohos:height="match_content"
- ohos:width="match_content"
- ohos:text="T"
- ohos:text_size="50fp"
- ohos:auto_font_size="true"/>
- ohos:height="match_content"
- ohos:width="match_content"
- ohos:text="Text Font"
- ohos:text_size="50fp"
- ohos:text_font="serif"/>
- //2. 自動(dòng)調(diào)整字體大小
- Text text_auto_font_size = (Text) findComponentById(ResourceTable.Id_text_auto_font_size);
- text_auto_font_size.setClickedListener(l -> {
- text_auto_font_size.append("T");
- });
聲明：碼字不易，轉(zhuǎn)載請(qǐng)注明出處，系列圖文僅供學(xué)習(xí)使用，不可用于商用。因轉(zhuǎn)載作品引發(fā)的知識(shí)產(chǎn)權(quán)或其他法律糾紛的，轉(zhuǎn)載人須自行承擔(dān)一切后果，與本人無(wú)關(guān)!
想了解更多內(nèi)容，請(qǐng)?jiān)L問(wèn)：
51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)
https://harmonyos.51cto.com/#zz
