文章目錄

• 一、RadioButton 與 RadioContainer 組件
• 二、監聽 RadioContainer 選擇事件
• 三、GitHub 地址

一、RadioButton 與 RadioContainer 組件

---

RadioButton 組件就是單選按鈕 ;

給出 $3$ 個 RadioButton 按鈕 , 使用 RadioContainer 編組后 , 只能 $3$ 選 $1$ , 同一時刻 , 只能有單個按鈕處于選中狀態 ;

RadioContainer 組件是單選按鈕的編組組件 , 可以將若干 RadioButton 放到 RadioContainer 標簽中 , 這些 RadioButton 組件只能有一個處于選中狀態 ;

RadioContainer 編組 RadioButton 布局代碼示例 :

<?xml version="1.0" encoding="utf-8"?> <DirectionalLayoutxmlns:ohos="http://schemas.huawei.com/res/ohos"ohos:height="match_parent"ohos:width="match_parent"ohos:orientation="vertical"><!-- 單選按鈕容器 --><RadioContainerohos:id="$+id:radioContainer"ohos:height="match_parent"ohos:width="match_parent"ohos:orientation="vertical"><RadioButtonohos:id="$+id:radioButton1"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="單選按鈕 1"ohos:text_size="100"/><RadioButtonohos:id="$+id:radioButton2"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="單選按鈕 2"ohos:text_size="100"/><RadioButtonohos:id="$+id:radioButton3"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="單選按鈕 3"ohos:text_size="100"/></RadioContainer></DirectionalLayout>

顯示樣式 : 當前單選按鈕 2 處于選中狀態 ;

下圖是使用遠程鴻蒙模擬器顯示單選按鈕 ;

二、監聽 RadioContainer 選擇事件

---

調用 RadioContainer 對象的 setMarkChangedListener 方法 , 給 RadioContainer 添加 RadioContainer.CheckedStateChangedListener 監聽器 , 可以監聽編組在 RadioContainer 下的所有 RadioButton 的選擇事件 ;

當某個 RadioButton 被點擊時 , 會回調 RadioContainer.CheckedStateChangedListener 監聽器的 onCheckedChanged 方法 , 在該方法的第二個參數 int i , 就是被點擊的 RadioBtton 的索引 ;

代碼示例 :

package com.example.radiobutton.slice;import com.example.radiobutton.ResourceTable; import ohos.aafwk.ability.AbilitySlice; import ohos.aafwk.content.Intent; import ohos.agp.components.Button; import ohos.agp.components.RadioContainer; import ohos.agp.components.Text;public class MainAbilitySlice extends AbilitySlice {@Overridepublic void onStart(Intent intent) {super.onStart(intent);super.setUIContent(ResourceTable.Layout_ability_main);// 獲取文本組件Text text = (Text) findComponentById(ResourceTable.Id_text);// 獲取 RadioContainerRadioContainer radioContainer = (RadioContainer) findComponentById(ResourceTable.Id_radioContainer);radioContainer.setMarkChangedListener(new RadioContainer.CheckedStateChangedListener() {@Overridepublic void onCheckedChanged(RadioContainer radioContainer, int i) {text.setText("當前選中 : " + i);}});}@Overridepublic void onActive() {super.onActive();}@Overridepublic void onForeground(Intent intent) {super.onForeground(intent);} }

布局文件 :

<?xml version="1.0" encoding="utf-8"?> <DirectionalLayoutxmlns:ohos="http://schemas.huawei.com/res/ohos"ohos:height="match_parent"ohos:width="match_parent"ohos:orientation="vertical"><!-- 單選按鈕容器 --><RadioContainerohos:id="$+id:radioContainer"ohos:height="match_content"ohos:width="match_parent"ohos:orientation="vertical"><RadioButtonohos:id="$+id:radioButton1"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="單選按鈕 0"ohos:text_size="100"/><RadioButtonohos:id="$+id:radioButton2"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="單選按鈕 1"ohos:text_size="100"/><RadioButtonohos:id="$+id:radioButton3"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="單選按鈕 2"ohos:text_size="100"/></RadioContainer><Textohos:id="$+id:text"ohos:height="match_content"ohos:width="match_content"ohos:layout_alignment="horizontal_center"ohos:text="當前選中 : "ohos:text_size="100"ohos:text_color="#FF0000"/></DirectionalLayout>

執行結果 :

三、GitHub 地址

---

GitHub 主應用 : https://github.com/han1202012/HarmonyHelloWorld

RadioButton 與 RadioContainer 組件示例 Module : https://github.com/han1202012/HarmonyHelloWorld/tree/master/radiobutton

總結

以上是生活随笔為你收集整理的【鸿蒙 HarmonyOS】UI 组件 ( 单选按钮 | RadioButton 与 RadioContainer 组件 )的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。