Radio
單選框,提供相應的用戶交互選擇項。
說明:
開發(fā)前請熟悉鴻蒙開發(fā)指導文檔 :[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md
]
該組件從API Version 8開始支持。后續(xù)版本如有新增內容,則采用上角標單獨標記該內容的起始版本。
子組件
無
接口
Radio(options: {value: string, group: string})
從API version 9開始,該接口支持在ArkTS卡片中使用。
參數(shù)名 | 參數(shù)類型 | 必填 | 參數(shù)描述 |
---|---|---|---|
value | string | 是 | 當前單選框的值。 |
group | string | 是 | 當前單選框的所屬群組名稱,相同group的Radio只能有一個被選中。 |
屬性
除支持[通用屬性]外,還支持以下屬性:
名稱 | 參數(shù)類型 | 描述 |
---|---|---|
checked | boolean | 設置單選框的選中狀態(tài)。 默認值:false 從API version 9開始,該接口支持在ArkTS卡片中使用。 從API version 10開始,該屬性支持[$$]雙向綁定變量。 |
radioStyle10+ | [RadioStyle] | 設置單選框選中狀態(tài)和非選中狀態(tài)的樣式。 從API version 10開始,該接口支持在ArkTS組件中使用。 |
事件
除支持[通用事件]外,還支持以下事件:
名稱 | 功能描述 |
---|---|
onChange(callback: (isChecked: boolean) => void) | 單選框選中狀態(tài)改變時觸發(fā)回調。 - isChecked為true時,表示從未選中變?yōu)檫x中。 - isChecked為false時,表示從選中變?yōu)槲催x中。 從API version 9開始,該接口支持在ArkTS卡片中使用。 |
RadioStyle對象說明
名稱 | 類型 | 必填 | 默認值 | 描述 |
---|---|---|---|---|
checkedBackgroundColor | [ResourceColor] | 否 | #007DFF | 開啟狀態(tài)底板顏色。 |
uncheckedBorderColor | [ResourceColor] | 否 | #182431 | 關閉狀態(tài)描邊顏色。 |
indicatorColor | [ResourceColor] | 否 | #FFFFFF | 開啟狀態(tài)內部圓餅顏色。HarmonyOS與OpenHarmony鴻蒙文檔籽料:mau123789是v直接拿 |
示例
// xxx.ets
@Entry
@Component
struct RadioExample {
build() {
Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
Column() {
Text('Radio1')
Radio({ value: 'Radio1', group: 'radioGroup' }).checked(true)
.radioStyle({
checkedBackgroundColor: Color.Pink
})
.height(50)
.width(50)
.onChange((isChecked: boolean) = > {
console.log('Radio1 status is ' + isChecked)
})
}
Column() {
Text('Radio2')
Radio({ value: 'Radio2', group: 'radioGroup' }).checked(false)
.radioStyle({
checkedBackgroundColor: Color.Pink
})
.height(50)
.width(50)
.onChange((isChecked: boolean) = > {
console.log('Radio2 status is ' + isChecked)
})
}
Column() {
Text('Radio3')
Radio({ value: 'Radio3', group: 'radioGroup' }).checked(false)
.radioStyle({
checkedBackgroundColor: Color.Pink
})
.height(50)
.width(50)
.onChange((isChecked: boolean) = > {
console.log('Radio3 status is ' + isChecked)
})
}
}.padding({ top: 30 })
}
}
審核編輯 黃宇
聲明:本文內容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權轉載。文章觀點僅代表作者本人,不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學習之用,如有內容侵權或者其他違規(guī)問題,請聯(lián)系本站處理。
舉報投訴
-
組件
+關注
關注
1文章
499瀏覽量
17775 -
鴻蒙
+關注
關注
57文章
2295瀏覽量
42641
發(fā)布評論請先 登錄
相關推薦
HarmonyOS/OpenHarmony應用開發(fā)-ArkTS的聲明式開發(fā)范式
軌跡。狀態(tài)與數(shù)據(jù)管理狀態(tài)數(shù)據(jù)管理作為基于ArkTS的聲明式開發(fā)范式的特色,通過功能不同的裝飾器給開發(fā)者提供了清晰的頁面更新渲染流程和管道。狀態(tài)管理包括UI組件狀態(tài)和應用程序狀態(tài),兩者協(xié)
發(fā)表于 01-17 15:09
HarmonyOS/OpenHarmony原生應用-ArkTS萬能卡片組件Radio
單選框,提供相應的用戶交互選擇項。該組件從API Version 8開始支持。無子組件。
一、接口
Radio(options: {value: string, group: string})
從
發(fā)表于 10-13 17:21
鴻蒙ArkTS聲明式組件:PatternLock
圖案密碼鎖組件,以九宮格圖案的方式輸入密碼,用于密碼驗證場景。手指在PatternLock組件區(qū)域按下時開始進入輸入狀態(tài),手指離開屏幕時結束輸入狀態(tài)完成密碼輸入。
評論