鸿蒙开发(8)---DatePicker组件

简介: 鸿蒙开发(8)---DatePicker组件

DatePicker组件


在我们讲解Picker组件实现城市地址选择时,是不是有的读者也想过用其实现日期的选择呢?


其实,Picker组件可以用于日期的选择,但是如果用于选择年月日,那么和城市一样你就要操作3个Picker组件,无疑增加了代码量。


鸿蒙给我们直接提供了DatePicker组件今天日期的选择操作。下面,我们来讲解DatePicker组件的使用规则。


创建一个DatePicker组件

首先,我们通过XML布局文件创建一个DatePicker组件。同时也创建一个Text组件用于动态显示我们选择的时间。示例如下:

<DatePicker
    ohos:id="$+id:test_datepicker"
    ohos:height="match_content"
    ohos:width="match_parent"
    ohos:text_size="20fp"
    ohos:selected_text_color="#FFA500"
    ohos:date_order="2"/>
<Text
    ohos:id="$+id:test_test"
    ohos:height="match_content"
    ohos:width="match_content"
    ohos:text_size="30fp"
    ohos:text_color="#FF0000"
    ohos:layout_alignment="center"/>


这里,有一个陌生的属性需要注意,也就是date_order。


该属性定义了显示格式,比如这里2代表显示年月日,0代表显示日月年等。取值为0-10,后面的8-9分别只显示年月日的单个数据选择。


接着,我们需要通过Java代码设置DatePicker组件为当前的日期时间,并为其设置其样式。当然,还要初始化Text组件的日期也是当前时间。


示例代码如下所示:

public class MainAbilitySlice extends AbilitySlice{
    private DatePicker datePicker;
    private Text text;
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);
        this.datePicker=(DatePicker)findComponentById(ResourceTable.Id_test_datepicker);
        this.text=(Text)findComponentById(ResourceTable.Id_test_test);
        Calendar now = Calendar.getInstance();
        int year=Integer.valueOf(now.get(Calendar.YEAR));
        int month=Integer.valueOf(now.get(Calendar.MONTH))+1;
        int day=Integer.valueOf(now.get(Calendar.DAY_OF_MONTH));
        this.text.setText(new SimpleDateFormat("yyyy-MM-dd").format(now.getTime()));
        this.datePicker.updateDate(year,month,day);
        this.datePicker.setShaderColor(new Color(Color.getIntColor("#00FFFF")));
        ShapeElement shape = new ShapeElement();
        shape.setShape(ShapeElement.RECTANGLE);
        shape.setRgbColor(RgbColor.fromArgbInt(0xFF9370DB));
        this.datePicker.setDisplayedLinesElements(shape,shape);
        this.datePicker.setValueChangedListener(new DatePicker.ValueChangedListener() {
            @Override
            public void onValueChanged(DatePicker datePicker, int i, int i1, int i2) {
                text.setText(String.format("%04d-%02d-%02d", i, i1, i2));
            }
        });
    }
}


这里,我们通过Calendar类获取当前的时间,通过ShapeElement设置DatePicker组件的样式。


同样,为了获取我们的选择人日期,与Picker组件一样,DatePicker组件的监听选择事件为ValueChangedListener。


其中,i代表年year,i1代表月month,i2代表日day。运行之后,效果如首图所示。


其他重要属性

在上面的XML布局文件中,我们使用的属性除了date_order,其他的基本在前面的博文都使用过。


但其实它还有其他的重要属性。下面,博主专门用一个表格将这些属性一一列举出来:

属性 含义
day_fixed 日期是否固定
month_fixed 月份是否固定
year_fixed 年份是否固定
max_date 最大日期 (Unix时间戳)
min_date 最小日期 (Unix时间戳)

比如,我们在代码中选择出生年月日,设置最小的日期选择。示例代码如下:

this.datePicker.setMinDate(getUnixDate("1950-01-01"));
private Long getUnixDate(String date){
    DateFormat df = new SimpleDateFormat("yyyy-MM-DD");
    long unix_date=0;
    try {
        unix_date = df.parse(date).getTime() / 1000;
        return unix_date;
    } catch (ParseException e) {
        e.printStackTrace();
        unix_date=1623254400;
        return unix_date;
    }
}

运行之后,效果如下:

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