鸿蒙开发(11)---RadioButton与RadioContainer组件

简介: 鸿蒙开发(11)---RadioButton与RadioContainer组件

RadioButton与RadioContainer组件


在个人信息的选择中,一般都会涉及到性别的处理。而性别显然是一个单选问题,这种单选情况,在鸿蒙开发中需要使用RadioButton与RadioContainer组件。


本篇,将详细介绍RadioButton与RadioContainer组件的使用规则。


创建单选项

首先,我们用纯XML布局文件创建一个单选项选择组件。示例代码如下所示:

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:background_element="#98ffff"
    ohos:orientation="vertical">
    <RadioContainer
        ohos:id="$+id:test_radiocontainer"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:layout_alignment="horizontal_center"
        ohos:top_margin="20vp"
        ohos:orientation="vertical">
        <RadioButton
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:text_size="25fp"
            ohos:text_color_on="#0066FF"
            ohos:text_color_off="#505050"
            ohos:text="学士"/>
        <RadioButton
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:text_size="25fp"
            ohos:text_color_on="#0066FF"
            ohos:text_color_off="#505050"
            ohos:text="硕士"/>
        <RadioButton
            ohos:height="match_content"
            ohos:width="match_content"
            ohos:text_size="25fp"
            ohos:text_color_on="#0066FF"
            ohos:text_color_off="#505050"
            ohos:marked="true"
            ohos:text="博士"/>
    </RadioContainer>
</DirectionalLayout>


这里的属性基本在前面的讲解都用到过,这里不在赘述。唯一需要说明的是,因为其是单选项,那么肯定会有一个初始化的选择,而marked可以设置默认选项。


运行之后,效果如下:



这里,只要更改RadioContainer属性orientation为横向纵向,就可以显示出上面的两种效果图。


监听事件

当然,我们使用单选项的目的,是为了获取我们选择的到底是哪个数据。所以,我们需要对RadioContainer组件进行监听。


示例如下:

public class MainAbilitySlice extends AbilitySlice{
    HiLogLabel label=new HiLogLabel(HiLog.LOG_APP, 0x00201, "TAG");
    private Text radio_text;
    private RadioContainer radioContainer;
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);
        this.radioContainer=(RadioContainer)findComponentById(ResourceTable.Id_test_radiocontainer);
        this.radio_text=(Text)findComponentById(ResourceTable.Id_radio_text);
        int radio_id=radioContainer.getMarkedButtonId();
        this.radio_text.setText(((RadioButton) radioContainer.getComponentAt(radio_id)).getText());
        this.radioContainer.setMarkChangedListener(new RadioContainer.CheckedStateChangedListener() {
            @Override
            public void onCheckedChanged(RadioContainer radioContainer, int i) {
                radio_text.setText(((RadioButton) radioContainer.getComponentAt(i)).getText());
            }
        });
    }
}


这里,我们通过getMarkedButtonId()获取单选项的默认子组件序号。然后,再通过getComponentAt()获取到RadioButton以及它的值。


同样的,监听选择需要使用CheckedStateChangedListener接口,而获取选中项的值与上面一样。


运行之后,效果如首图所示。

相关文章
|
2月前
|
开发者 容器
鸿蒙应用开发从入门到实战(十四):ArkUI组件Column&Row&线性布局
ArkUI提供了丰富的系统组件,用于制作鸿蒙原生应用APP的UI,本文主要讲解Column和Row组件的使用以及线性布局的方法。
274 12
|
2月前
|
API 数据处理
鸿蒙应用开发从入门到实战(十三):ArkUI组件Slider&Progress
ArkUI提供了丰富的系统组件,用于制作鸿蒙原生应用APP的UI,本文主要讲解滑块Slider和进度条Progress组件的使用。
167 1
|
1月前
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
239 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
1月前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
206 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
1月前
|
移动开发 Rust JavaScript
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
524 4
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
2月前
|
数据安全/隐私保护 开发者
鸿蒙应用开发从入门到实战(十一):ArkUI组件Text&TextInput
ArkUI提供了丰富的系统组件,用于制作鸿蒙原生应用APP的UI,本文主要讲解文本组件Text和TextInput的使用。
273 3
|
1月前
|
移动开发 Android开发
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
122 0
|
2月前
|
API 数据处理
鸿蒙应用开发从入门到实战(十三):ArkUI组件Slider&Progress
ArkUI提供滑块Slider与进度条Progress组件,用于鸿蒙原生APP开发。Slider支持拖动调节音量、亮度等,可设步长、方向及提示气泡;Progress支持线性、环形等多种样式,可自定义颜色、宽度与刻度,实时显示任务进度。
232 2
|
2月前
|
开发者
鸿蒙应用开发从入门到实战(十二):ArkUI组件Button&Toggle
ArkUI提供了丰富的系统组件,用于制作鸿蒙原生应用APP的UI,本文主要讲解按钮组件Button和Toggle的使用。
291 2
|
2月前
|
传感器 监控 安全
HarmonyOS NEXT 5.0 的星闪(NearLink)开发应用案例
V哥分享HarmonyOS NEXT 5.0星闪开发实战,涵盖智能车钥匙无感解锁与工业传感器监控。低延迟、高可靠,代码完整,速来学习!
487 0

热门文章

最新文章

下一篇
oss云网关配置