日本综合一区二区|亚洲中文天堂综合|日韩欧美自拍一区|男女精品天堂一区|欧美自拍第6页亚洲成人精品一区|亚洲黄色天堂一区二区成人|超碰91偷拍第一页|日韩av夜夜嗨中文字幕|久久蜜综合视频官网|精美人妻一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間：8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
HarmonyOS基礎(chǔ)之UI組件（二）

想了解更多內(nèi)容，請訪問：

十余年的靈臺網(wǎng)站建設(shè)經(jīng)驗，針對設(shè)計、前端、開發(fā)、售后、文案、推廣等六對一服務(wù)，響應(yīng)快，48小時及時工作處理。成都全網(wǎng)營銷的優(yōu)勢是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動調(diào)整靈臺建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計，從而大程度地提升瀏覽體驗。成都創(chuàng)新互聯(lián)從事“靈臺網(wǎng)站設(shè)計”,“靈臺網(wǎng)站推廣”以來，每個客戶項目都認真落實執(zhí)行。

和華為官方合作共建的鴻蒙技術(shù)社區(qū)

https://harmonyos.

概述

上一篇【HarmonyOS 基礎(chǔ)之 UI 布局(一)】我們一起學(xué)習(xí)了HarmonyOS的常用 UI 布局和一些基礎(chǔ)屬性，一個界面除了UI布局，組件也是非常重要的組成部分。HarmonyOS的 UI 常見組件分為顯示類和交互類。顯示類負責文本圖像顯示，交互類負責交互響應(yīng)功能。組件的具體使用場景，需要根據(jù)業(yè)務(wù)需求來選擇使用。今天這篇文章我將跟大家分享一下常見組件的使用場景和特性。

常見組件

根據(jù)組件的功能，可以將組件分為顯示類、交互類：

1. Text

Text是用來顯示字符串的組件，在界面上顯示為一塊文本區(qū)域。

在layout目錄下的xml文件中創(chuàng)建Text。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:id="$+id:text"
    3. 
  
  
  
  
  3.     ohos:width="match_content"
    4. 
  
  
  
  
  4.     ohos:height="match_content"
    5. 
  
  
  
  
  5.     ohos:text="Text"
    6. 
  
  
  
  
  6.     />
    7.

可以根據(jù)不同需要，給Text添加各種屬性值。常用的背景如常見的文本背景、按鈕背景，可以采用XML格式放置在graphic目錄下。如：創(chuàng)建“background_text.xml”，在“background_text.xml”中定義文本的背景。

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     //背景形狀，oval橢圓，rectangle方形...
    4. 
  
  
  
  
  4.     ohos:shape="rectangle">  
    5. 
  
  
  
  
  5.     
  
  
  
  
  6.         //背景圓角程度
    7. 
  
  
  
  
  7.         ohos:radius="20"/> 
    8. 
  
  
  
  
  8.     
  
  
  
  
  9.         //背景顏色
    10. 
  
  
  
  
  10.         ohos:color="#878787"/>
    11. 
  
  
  
  
  11.

2. Image

Image 是用來顯示圖片的組件。

2.1 創(chuàng)建 Image

在 src -> main -> resources -> base -> media，添加一個圖片至media文件夾下，既可以在XML中創(chuàng)建 Image，也可以在代碼中創(chuàng)建 Image。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:id="$+id:image"
    3. 
  
  
  
  
  3.     ohos:width="match_content"
    4. 
  
  
  
  
  4.     ohos:height="match_content"
    5. 
  
  
  
  
  5.     ohos:layout_alignment="center"
    6. 
  
  
  
  
  6.     ohos:image_src="$media:plant"
    7. 
  
  
  
  
  7.     //設(shè)置透明度
    8. 
  
  
  
  
  8.     ohos:alpha="0.5"
    9. 
  
  
  
  
  9. />
    10. 
 
 
 
 
 
 
 
 
    
  
  
  
  
  1. Image image = new Image(getContext());
    2. 
  
  
  
  
  2. image.setPixelMap(ResourceTable.Media_plant);
    3.

2.2 縮放 Image

 
 
 
 
    
  
  
  
  
  1. ohos:image_src="$media:plant"
    2. 
  
  
  
  
  2.  //設(shè)置縮放方式
    3. 
  
  
  
  
  3.  ohos:scale_mode="zoom_center"
    4. 
  
  
  
  
  4.  //設(shè)置縮放系數(shù)
    5. 
  
  
  
  
  5.  ohos:scale_x="0.5"
    6. 
  
  
  
  
  6.  ohos:scale_y="0.5"
    7.

2.3 裁剪 Image

當 Image 尺寸小于圖片尺寸時，可以對圖片進行裁剪，仍以 Image 的寬高為 200 vp 為例，小于圖片尺寸。以左對齊裁剪為例，設(shè)置 clip_alignment = “256”。

3. ProgressBar

ProgressBar 用于顯示內(nèi)容或操作的進度。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:progress_width="10vp"
    3. 
  
  
  
  
  3.     ohos:height="80vp"
    4. 
  
  
  
  
  4.     ohos:width="280vp"
    5. 
  
  
  
  
  5.     //設(shè)置進度條方向為水平，（ vertical 為水平）
    6. 
  
  
  
  
  6.     ohos:orientation="horizontal"
    7. 
  
  
  
  
  7.     //設(shè)置最大值最小值
    8. 
  
  
  
  
  8.     ohos:max="100"
    9. 
  
  
  
  
  9.     ohos:min="0"
    10. 
  
  
  
  
  10.     //設(shè)置當前進度 
    11. 
  
  
  
  
  11.     ohos:progress="60"
    12. 
  
  
  
  
  12.     //設(shè)置進度條顏色
    13. 
  
  
  
  
  13.     ohos:progress_element="#FF9900"
    14. 
  
  
  
  
  14.     //設(shè)置進度條組件底色
    15. 
  
  
  
  
  15.     ohos:background_instruct_element="#F23456"
    16. 
  
  
  
  
  16.     //設(shè)置分割線
    17. 
  
  
  
  
  17.     ohos:divider_lines_enabled="true"
    18. 
  
  
  
  
  18.     ohos:divider_lines_number="5"
    19. 
  
  
  
  
  19.     //設(shè)置提示文字以及提示文字顏色
    20. 
  
  
  
  
  20.     ohos:progress_hint_text="60%"
    21. 
  
  
  
  
  21.     ohos:progress_hint_text_color="#FF4989"
    22. 
  
  
  
  
  22.     />
    23.

如上圖，進度條展示效果如下：

4. Button

Button是一種常見的組件，點擊可以觸發(fā)對應(yīng)的操作，通常由文本或圖標組成，也可以由圖標和文本共同組成。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:id="$+id:button"
    3. 
  
  
  
  
  3.     ohos:width="match_content"
    4. 
  
  
  
  
  4.     ohos:height="match_content"
    5. 
  
  
  
  
  5.     ohos:text_size="27fp"
    6. 
  
  
  
  
  6.     ohos:text="button"
    7. 
  
  
  
  
  7.     ohos:background_element="$graphic:background_button"
    8. 
  
  
  
  
  8.     ohos:left_margin="15vp"
    9. 
  
  
  
  
  9.     ohos:bottom_margin="15vp"
    10. 
  
  
  
  
  10.     ohos:right_padding="8vp"
    11. 
  
  
  
  
  11.     ohos:left_padding="8vp"
    12. 
  
  
  
  
  12.     />
    13.

4.1 背景樣式

如上布局xml文件中可以設(shè)置 Button 字體大小，文字內(nèi)容，文字格式，背景等。其中背景可以在 graphic 文件夾下自定義需要的背景風(fēng)格。

例如：background_button.xml;

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     //設(shè)置控件形狀為方形
    4. 
  
  
  
  
  4.     ohos:shape="rectangle">
    5. 
  
  
  
  
  5.     
  
  
  
  
  6.         //背景圓角程度
    7. 
  
  
  
  
  7.         ohos:radius="10"/>
    8. 
  
  
  
  
  8.     
  
  
  
  
  9.         //背景背景顏色
    10. 
  
  
  
  
  10.         ohos:color="#007CFD"/>
    11. 
  
  
  
  
  11. 
 
 
 
 
 
 
 
 
    
  
  
  
  
  1. ohos:background_element="$graphic:oval_button_element"
    2.

復(fù)制通過在 graphic 文件夾下自定義 Button 樣式文件，可以自定義不同類型的 Button，按照 Button 的形狀，按鈕可以分為：普通，橢圓，膠囊，圓形等。

4.2 點擊事件

用戶點擊Button時，Button對象將收到一個點擊事件，然后自定義響應(yīng)點擊事件的方法。如：通過創(chuàng)建一個 Component.ClickedListener 對象，然后通過調(diào)用 setClickedListener 將其分配給按鈕，再收到該點擊事件后，執(zhí)行相應(yīng)操作對該事件做出響應(yīng)。

 
 
 
 
    
  
  
  
  
  1. Button button = (Button) findComponentById(ResourceTable.Id_button);
    2. 
  
  
  
  
  2. // 為按鈕設(shè)置點擊事件回調(diào)
    3. 
  
  
  
  
  3. button.setClickedListener(new Component.ClickedListener() {
    4. 
  
  
  
  
  4.     public void onClick(Component v) {
    5. 
  
  
  
  
  5.         // 此處添加點擊按鈕后的事件處理邏輯
    6. 
  
  
  
  
  6.     }
    7. 
  
  
  
  
  7. }); 
    8.

5. Picker

Picker 提供了滑動選擇器，允許用戶從預(yù)定義范圍中進行選擇。常見的 Picker 有 DatePicker ( 選擇日期 ) 和 TimePicker ( 選擇時間 )。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:height="match_content"
    3. 
  
  
  
  
  3.     ohos:width="160vp"
    4. 
  
  
  
  
  4.     ohos:top_margin="60vp"
    5. 
  
  
  
  
  5.     ohos:selected_text_size="40vp"
    6. 
  
  
  
  
  6.     ohos:normal_text_size="20vp"
    7. 
  
  
  
  
  7.     ohos:layout_alignment="center"
    8. 
  
  
  
  
  8.     />
    9.

根據(jù) xml 布局文件配置自己需要的 Picker 種類，顯示效果如下：

Picker

DatePicker

TimePicker

6. Switch

Switch是切換單個設(shè)置開/關(guān)兩種狀態(tài)的組件。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:height="60vp"
    3. 
  
  
  
  
  3.     ohos:width="120vp"
    4. 
  
  
  
  
  4.     ohos:layout_alignment="center"
    5. 
  
  
  
  
  5.     ohos:top_margin="60vp"
    6. 
  
  
  
  
  6.     />
    7.

Switch相當于一個雙相開關(guān)，點擊開關(guān)的時候會進行切換，效果如下：

7. RadioButton

RadioButton 是用于多選一操作的組件，需要搭配 RadioContainer 使用，實現(xiàn)單選效果，RadioContainer 是 RadioButton 的容器，在其包裹下的 RadioButton 保證只有一個被選項。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:id="$+id:harmony_UI"
    3. 
  
  
  
  
  3.     ohos:top_margin="60vp"
    4. 
  
  
  
  
  4.     ohos:height="40vp"
    5. 
  
  
  
  
  5.     ohos:width="match_content"
    6. 
  
  
  
  
  6.     ohos:text="Hello Harmony"
    7. 
  
  
  
  
  7.     ohos:layout_alignment="center"
    8. 
  
  
  
  
  8.     ohos:text_size="20fp"
    9. 
  
  
  
  
  9.     //字體顏色，text_color_onon 為選中狀態(tài)，text_color_off 為未選中狀態(tài)
    10. 
  
  
  
  
  10.     ohos:text_color_on="#00BFFF"
    11. 
  
  
  
  
  11.     ohos:text_color_off="#808080"
    12. 
  
  
  
  
  12.     />
    13.

選中狀態(tài)

未選中狀態(tài)

以上兩張圖為 RadioButton 的選中與未選中的狀態(tài)對比。

8. Checkbox

Checkbox可以實現(xiàn)選中和取消選中的功能。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:top_margin="60vp"
    3. 
  
  
  
  
  3.     ohos:layout_alignment="center"
    4. 
  
  
  
  
  4.     ohos:id="$+id:check_box"
    5. 
  
  
  
  
  5.     ohos:height="match_content"
    6. 
  
  
  
  
  6.     ohos:width="match_content"
    7. 
  
  
  
  
  7.     ohos:text="harmony checkbox"
    8. 
  
  
  
  
  8.     ohos:text_color_on="#00AAEE"
    9. 
  
  
  
  
  9.     ohos:text_color_off="#000000"
    10. 
  
  
  
  
  10.     ohos:text_size="20fp" />
    11.

xml 布局文件中創(chuàng)建 Checkbox 組件，顯示效果如下：

9. TextField

TextField 是一種文本輸入框。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:height="40vp"
    3. 
  
  
  
  
  3.     ohos:width="200vp"
    4. 
  
  
  
  
  4.     //設(shè)置提示語
    5. 
  
  
  
  
  5.     ohos:hint="Please enter......"
    6. 
  
  
  
  
  6.     //設(shè)置內(nèi)邊距
    7. 
  
  
  
  
  7.     ohos:left_padding="24vp"
    8. 
  
  
  
  
  8.     ohos:right_padding="24vp"
    9. 
  
  
  
  
  9.     ohos:top_padding="8vp"
    10. 
  
  
  
  
  10.     ohos:bottom_padding="8vp"
    11. 
  
  
  
  
  11.     //設(shè)置可多行顯示
    12. 
  
  
  
  
  12.     ohos:multiple_lines="true"
    13. 
  
  
  
  
  13.  />
    14.

在代碼中，我們也可以對文本輸入框設(shè)置響應(yīng)事件。

 
 
 
 
    
  
  
  
  
  1. textField.setFocusChangedListener(((component, isFocused) -> {
    2. 
  
  
  
  
  2.     if (isFocused) { 
    3. 
  
  
  
  
  3.         // 獲取到焦點
    4. 
  
  
  
  
  4.         ...
    5. 
  
  
  
  
  5.     }else { 
    6. 
  
  
  
  
  6.         // 失去焦點
    7. 
  
  
  
  
  7.         ...
    8. 
  
  
  
  
  8.     }
    9. 
  
  
  
  
  9. }));
    10.

10. ToastDialog

ToastDialog 是在窗口上方彈出的對話框，是通知操作的簡單反饋。ToastDialog 會在一段時間后消失，在此期間，用戶還可以操作當前窗口的其他組件。

在代碼中創(chuàng)建 ToastDialog。

自定義布局 Resource 文件 Layout_layout_toast.xml 內(nèi)容如下：

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
    4. 
  
  
  
  
  4.     ohos:height="match_content"
    5. 
  
  
  
  
  5.     ohos:width="match_content"
    6. 
  
  
  
  
  6.     ohos:orientation="vertical">
    7. 
  
  
  
  
  7.     
  
  
  
  
  8.         ohos:id="$+id:msg_toast"
    9. 
  
  
  
  
  9.         ohos:height="match_content"
    10. 
  
  
  
  
  10.         ohos:width="match_content"
    11. 
  
  
  
  
  11.         ohos:left_padding="16vp"
    12. 
  
  
  
  
  12.         ohos:right_padding="16vp"
    13. 
  
  
  
  
  13.         ohos:top_padding="4vp"
    14. 
  
  
  
  
  14.         ohos:bottom_padding="4vp"
    15. 
  
  
  
  
  15.         ohos:layout_alignment="center"
    16. 
  
  
  
  
  16.         ohos:text_size="16fp"
    17. 
  
  
  
  
  17.         ohos:text="This is a ToastDialog for the customized component"
    18. 
  
  
  
  
  18.         ohos:background_element="$graphic:background_toast_element"/>
    19. 
  
  
  
  
  19.

11. ScrollView

ScrollView 是一種帶滾動功能的組件，它采用滑動的方式在有限的區(qū)域內(nèi)顯示更多的內(nèi)容。

 
 
 
 
    
  
  
  
  
  1. 
  
  
  
  
  2.     ohos:id="$+id:scrollview"
    3. 
  
  
  
  
  3.     ohos:height="300vp"
    4. 
  
  
  
  
  4.     ohos:width="300vp"
    5. 
  
  
  
  
  5.     ohos:background_element="#FFDEAD"
    6. 
  
  
  
  
  6.     ohos:top_margin="32vp"
    7. 
  
  
  
  
  7.     ohos:bottom_padding="16vp"
    8. 
  
  
  
  
  8.     ohos:layout_alignment="horizontal_center">
    9. 
  
  
  
  
  9.     
  
  
  
  
  10.         ohos:height="match_content"
    11. 
  
  
  
  
  11.         ohos:width="match_content">
    12. 
  
  
  
  
  12.         
  
  
  
  
  13.             ohos:id="$+id:img_1"
    14. 
  
  
  
  
  14.             ohos:width="300vp"
    15. 
  
  
  
  
  15.             ohos:height="match_content"
    16. 
  
  
  
  
  16.             ohos:top_margin="16vp"
    17. 
  
  
  
  
  17.             ohos:image_src="$media:dog.png"/>
    18. 
  
  
  
  
  18.         
    19. 
  
  
  
  
  19.     
    20. 
  
  
  
  
  20.

12. ListContainer

ListContainer 是用來呈現(xiàn)連續(xù)、多行數(shù)據(jù)的組件，包含一系列相同類型的列表項。

首先需要在 layout 目錄下的 xml 布局文件中創(chuàng)建 ListContainer。

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2.     
  
  
  
  
  3.         xmlns:ohos="http://schemas.huawei.com/res/ohos"
    4. 
  
  
  
  
  4.         ohos:id="$+id:list_container"
    5. 
  
  
  
  
  5.         ohos:height="200vp"
    6. 
  
  
  
  
  6.         ohos:width="300vp"
    7. 
  
  
  
  
  7.         ohos:layout_alignment="horizontal_center"/>
    8.

 然后在 layout 目錄下新建 xml 文件(例：item_listContainer.xml)，作為 ListContainer 的子布局。

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
    4. 
  
  
  
  
  4.     ohos:height="match_content"
    5. 
  
  
  
  
  5.     ohos:width="match_parent"
    6. 
  
  
  
  
  6.     ohos:left_margin="16vp"
    7. 
  
  
  
  
  7.     ohos:right_margin="16vp"
    8. 
  
  
  
  
  8.     ohos:orientation="vertical">
    9. 
  
  
  
  
  9.     
  
  
  
  
  10.         ohos:id="$+id:item_index"
    11. 
  
  
  
  
  11.         ohos:height="match_content"
    12. 
  
  
  
  
  12.         ohos:width="match_content"
    13. 
  
  
  
  
  13.         ohos:padding="4vp"
    14. 
  
  
  
  
  14.         ohos:text="Item0"
    15. 
  
  
  
  
  15.         ohos:text_size="20fp"
    16. 
  
  
  
  
  16.         ohos:layout_alignment="center"/>
    17. 
  
  
  
  
  17.

ListContainer 每一行可以為不同的數(shù)據(jù)，因此需要適配不同的數(shù)據(jù)結(jié)構(gòu)，使其都能添加到 ListContainer 上。

創(chuàng)建 ListcontainerItemProvider.java，繼承自RecycleItemProvider。

ListContainer 的樣式設(shè)置

看看效果：

13. PageSlider

PageSlider 是一個交互類組件。

main_pageSlider.xml

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
    4. 
  
  
  
  
  4.     ohos:height="match_parent"
    5. 
  
  
  
  
  5.     ohos:width="match_parent"
    6. 
  
  
  
  
  6.     ohos:background_element="blue"
    7. 
  
  
  
  
  7.     ohos:orientation="vertical">
    8. 
  
  
  
  
  8. 
  
  
  
  
  9.     
  
  
  
  
  10.         ohos:id="$+id:pager_slider"
    11. 
  
  
  
  
  11.         ohos:height="0vp"
    12. 
  
  
  
  
  12.         ohos:width="match_parent"
    13. 
  
  
  
  
  13.         ohos:background_element="#ffffff"
    14. 
  
  
  
  
  14.         ohos:weight="1"/>
    15. 
  
  
  
  
  15. 
  
  
  
  
  16.     
  
  
  
  
  17.         ohos:id="$+id:radio_container"
    18. 
  
  
  
  
  18.         ohos:height="60vp"
    19. 
  
  
  
  
  19.         ohos:width="match_parent"
    20. 
  
  
  
  
  20.         ohos:alignment="horizontal_center"
    21. 
  
  
  
  
  21.         ohos:orientation="horizontal">
    22. 
  
  
  
  
  22. 
  
  
  
  
  23.         
  
  
  
  
  24.             ohos:height="match_parent"
    25. 
  
  
  
  
  25.             ohos:width="match_content"
    26. 
  
  
  
  
  26.             ohos:text_size="20fp"
    27. 
  
  
  
  
  27.             />
    28. 
  
  
  
  
  28. 
  
  
  
  
  29.         
  
  
  
  
  30.             ohos:height="match_parent"
    31. 
  
  
  
  
  31.             ohos:width="match_content"
    32. 
  
  
  
  
  32.             ohos:text_size="20fp"
    33. 
  
  
  
  
  33.             />
    34. 
  
  
  
  
  34. 
  
  
  
  
  35.     
    36. 
  
  
  
  
  36.

pageSlider1.xml

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
    4. 
  
  
  
  
  4.     ohos:height="match_parent"
    5. 
  
  
  
  
  5.     ohos:width="match_parent">
    6. 
  
  
  
  
  6. 
  
  
  
  
  7.     
  
  
  
  
  8.         ohos:height="match_content"
    9. 
  
  
  
  
  9.         ohos:width="match_content"
    10. 
  
  
  
  
  10.         ohos:center_in_parent="true"
    11. 
  
  
  
  
  11.         ohos:text="PageSlider1"
    12. 
  
  
  
  
  12.         ohos:text_size="25fp"/>
    13. 
  
  
  
  
  13.

pageSlider2.xml

 
 
 
 
    
  
  
  
  
    2. 
  
  
  
  
  2. 
  
  
  
  
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
    4. 
  
  
  
  
  4.     ohos:height="match_parent"
    5. 
  
  
  
  
  5.     ohos:width="match_parent">
    6. 
  
  
  
  
  6. 
  
  
  
  
  7.     
  
  
  
  
  8.         ohos:height="match_content"
    9. 
  
  
  
  
  9.         ohos:width="match_content"
    10. 
  
  
  
  
  10.         ohos:center_in_parent="true"
    11. 
  
  
  
  
  11.         ohos:text="PageSlider2"
    12. 
  
  
  
  
  12.         ohos:text_size="25fp"/>
    13. 
  
  
  
  
  13.

然后啟動程序看一下控件效果:

想了解更多內(nèi)容，請訪問：

和華為官方合作共建的鴻蒙技術(shù)社區(qū)

https://harmonyos.


網(wǎng)站欄目：HarmonyOS基礎(chǔ)之UI組件（二）
鏈接URL：http://www.dlmjj.cn/article/cdehjos.html