鸿蒙开发(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接口,而获取选中项的值与上面一样。


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

目录
打赏
0
0
0
0
20
分享
相关文章
HarmonyOS NEXT仓颉开发语言实战案例:外卖App
仓颉语言实战分享,教你如何用仓颉开发外卖App界面。内容包括页面布局、导航栏自定义、搜索框实现、列表模块构建等,附完整代码示例。轻松掌握Scroll、List等组件使用技巧,提升HarmonyOS应用开发能力。
【HarmonyOS 5】鸿蒙组件&模板服务详解 - 助力高效开发的利器
在移动应用开发领域,效率与质量始终是开发者追求的核心目标。鸿蒙系统作为新兴的操作系统,为开发者提供了丰富且强大的开发资源,其中鸿蒙组件&模板服务更是成为开发者快速构建高质量应用的得力助手。
76 0
HarmonyOS NEXT仓颉开发语言实战案例:健身App
本期分享一个健身App首页的布局实现,顶部采用Stack容器实现重叠背景与偏移效果,列表部分使用List结合Scroll实现可滚动内容。代码结构清晰,适合学习HarmonyOS布局技巧。
HarmonyOS NEXT仓颉开发语言实战案例:银行App
仓颉语言银行App项目分享,页面布局采用List容器,实现沉浸式体验与模块化设计。顶部资产模块结合Stack与Row布局,背景图与内容分离,代码清晰易懂;功能按钮部分通过负边距实现上移效果,圆角仅保留顶部;热门推荐使用header组件,结构更规范。整体代码风格与ArkTS相似,但细节更灵活,适合金融类应用开发。
跟老卫学HarmonyOS开发:ArkTS关系型数据库开发
本节以“账本”为例,使用关系型数据库接口实现账单的增、删、改、查操作。通过创建ArkTSRdb应用,演示如何操作RdbStore进行数据管理,并结合界面按钮实现交互功能。
39 0
跟老卫学HarmonyOS开发:ArkTS关系型数据库开发
详解HarmonyOS NEXT系统中ArkTS和仓颉的混合开发
本文介绍了鸿蒙系统中ArkTs与仓颉语言的混合开发方法,讲解了如何通过DevEco Studio创建混合项目、目录结构特点及组件调用方式,强调编译器自动化处理大幅简化开发流程,提升了开发体验。
HarmonyOS NEXT仓颉开发语言实战案例:图片预览器
本文介绍了如何使用仓颉语言实现图片放大预览器。通过弹窗组件`CustomDialogController`与`Swiper`容器结合,实现全屏图片浏览效果,支持多图切换与点击关闭功能,适配动态广场场景下的图片预览需求。
HarmonyOS NEXT仓颉开发语言实战案例:动态广场
本文介绍了使用仓颉语言开发类似朋友圈的动态广场页面,包含导航栏和状态列表。通过Column、Row、List等组件实现页面结构,并使用Grid适配图片展示。结合数据绑定与组件化思想,完成动态内容展示。
HarmonyOS NEXT仓颉开发语言实现画板案例
本文介绍了使用仓颉开发语言实现画板功能的案例,通过Canvas组件实现画布绘制,并利用贝塞尔曲线使画笔跟随触摸轨迹生成平滑曲线。内容包含画布初始化、触控事件处理及清空功能,展示了仓颉语言在图形绘制中的应用技巧。
|
23天前
详解HarmonyOS NEXT仓颉开发语言中的全局弹窗
仓颉语言提供全局弹窗模块prompt_action,支持无需页面依赖的弹窗功能。包含三种预设弹窗:文字提示、对话框及菜单弹窗,也可自定义内容并动态控制关闭。适用于各类交互场景,提升开发效率。
AI助理
登录插画

登录以查看您的控制台资源

管理云资源
状态一览
快捷访问

你好,我是AI助理

可以解答问题、推荐解决方案等