关于harmonyos:311HarmonyOS鸿蒙开发组件TimePicker

3.11【HarmonyOS鸿蒙开发】组件TimePicker

作者：韩茹
公司：程序咖（北京）科技有限公司
鸿蒙巴士专栏作家

TimePicker次要供用户抉择工夫。

一、反对的XML属性

TimePicker的共有XML属性继承自：StackLayout

TimePicker的自有XML属性见下表：

属性名称	中文形容	取值	取值阐明	应用案例
am_pm_order	上午下午排列程序	0	示意am/pm列靠工夫选择器起始端显示。	ohos:am_pm_order="0"
		1	示意am/pm列靠工夫选择器完结端显示。	ohos:am_pm_order="1"
		2	示意am/pm列靠工夫选择器左侧显示。	ohos:am_pm_order="2"
		3	示意am/pm列靠工夫选择器右侧显示。	ohos:am_pm_order="3"
mode_24_hour	是否24小时制显示	boolean类型	能够间接设置true/false，也能够援用boolean资源。	ohos:mode_24_hour="true" ohos:mode_24_hour="$boolean:true"
hour	显示小时	integer类型	能够间接设置整型数值，也能够援用integer资源。小时取值范畴必须在0~23。	ohos:hour="23" ohos:hour="$integer:hour"
minute	显示分钟	integer类型	能够间接设置整型数值，也能够援用integer资源。分钟取值范畴必须在0~59。	ohos:minute="59" ohos:minute="$integer:minute"
second	显示秒	integer类型	能够间接设置整型数值，也能够援用integer资源。秒钟取值范畴必须在0~59。	ohos:second="59" ohos:second="$integer:second"
normal_text_color	勾销选中文本的色彩	color类型	能够间接设置色值，也能够援用color资源。	ohos:normal_text_color="#FFFFFFFF" ohos:normal_text_color="$color:black"
selected_text_color	选中文本的色彩	color类型	能够间接设置色值，也能够援用color资源。	ohos:selected_text_color="#FF45A5FF" ohos:selected_text_color="$color:black"
operated_text_color	操作项的文本色彩	color类型	能够间接设置色值，也能够援用color资源。	ohos:operated_text_color="#A8FFFFFF" ohos:operated_text_color="$color:black"
normal_text_size	勾销选中文本的大小	float类型	示意尺寸的float类型。能够是浮点数值，其默认单位为px；也能够是带px/vp/fp单位的浮点数值；也能够援用float资源。	ohos:normal_text_size="30" ohos:normal_text_size="16fp" ohos:normal_text_size="$float:size_value"
selected_text_size	选中文本的大小	float类型	示意尺寸的float类型。能够是浮点数值，其默认单位为px；也能够是带px/vp/fp单位的浮点数值；也能够援用float资源。	ohos:selected_text_size="30" ohos:selected_text_size="16fp" ohos:selected_text_size="$float:size_value"
selected_normal_text_margin_ratio	已选文本边距与失常文本边距的比例	float类型	能够间接设置浮点数值，也能够援用float浮点数资源。取值需>0.0f，默认值为1.0f。	ohos:selected_normal_text_margin_ratio="0.5" ohos:selected_normal_text_margin_ratio="$float:ratio"
selector_item_num	显示的项数	integer类型	能够间接设置整型数值，也能够援用integer资源。	ohos:selector_item_num="3" ohos:selector_item_num="$integer:num"
shader_color	着色器色彩	color类型	能够间接设置色值，也能够援用color资源。	ohos:shader_color="#A8FFFFFF"ohos:shader_color="$color:black"
text_am	上午文本	string类型	能够间接设置文本字串，也能够援用string资源。	ohos:text_am="8:00:00"ohos:text_am="$string:am"
text_pm	下午文本	string类型	能够间接设置文本字串，也能够援用string资源。	ohos:text_pm="22:00:00"ohos:text_pm="$string:pm"
top_line_element	选中项的顶行	Element类型	可间接配置色值，也可援用color资源或援用media/graphic下的图片资源。	ohos:top_line_element="#FFFFFFFF" ohos:top_line_element="$color:black"<br />ohos:top_line_element="$media:media_src" ohos:top_line_element="$graphic:graphic_src"
bottom_line_element	选中项的底线	Element类型	可间接配置色值，也可援用color资源或援用media/graphic下的图片资源。	ohos:bottom_line_element="#FFFFFFFF" ohos:bottom_line_element="$color:black"<br />ohos:bottom_line_element="$media:media_src" ohos:bottom_line_element="$graphic:graphic_src"
wheel_mode_enabled	抉择轮是否绕行	boolean类型	能够间接设置true/false，也能够援用boolean资源。	ohos:wheel_mode_enabled="false" ohos:wheel_mode_enabled="$boolean:false"

二、应用TimePicker

1、创立TimePicker

<TimePicker        ohos:id="$+id:time_picker"        ohos:height="match_content"        ohos:width="match_parent"        ohos:background_element="#22ff0000"        />

创立一个默认的TimePicker的成果

2、获取工夫

    TimePicker timePicker = (TimePicker) findComponentById(ResourceTable.Id_time_picker);    int hour = timePicker.getHour();    int minute = timePicker.getMinute();    int second = timePicker.getSecond();    System.out.println("hour:"+hour+",minute:"+minute+",second:"+second);

运行后果：

3、设置工夫

  timePicker.setHour(19);  timePicker.setMinute(18);  timePicker.setSecond(12);

设置工夫成果：

4、响应工夫扭转事件

timePicker.setTimeChangedListener(new TimePicker.TimeChangedListener() {            @Override            public void onTimeChanged(TimePicker timePicker, int hour, int minute, int second) {                new ToastDialog(getContext())                        .setText("工夫："+hour+":"+minute+":"+second)                        .show();            }        });

运行成果：

三、显示款式配置

1、设置字体属性

设置未选中字体的色彩和大小：

<TimePicker    ...    ohos:normal_text_color="#007DFF"    ohos:normal_text_size="20fp"/>

设置未选中字体的色彩和大小的成果：

设置选中字体的色彩和大小

<TimePicker    ...    ohos:selected_text_color="#007DFF"    ohos:selected_text_size="20fp"/>

设置选中字体的色彩和大小成果：

设置操作项文本色彩

<TimePicker    ...    ohos:operated_text_color="#FF00FF"/>

操作项文本色彩设置成果

2、设置TimePicker中所选文本边距与一般文本边距的比例

<TimePicker    ...    ohos:selected_normal_text_margin_ratio="10"/>

选中与未选中文本距离成果

3、设置选中工夫的高低边框

<TimePicker    ...    ohos:bottom_line_element="#00BFFF"/>

设置高低区域分割线色彩成果

4、设置着色器色彩

<TimePicker    ...    ohos:shader_color="#00BFFF"/>

5、设置12小时制下显示款式

AM/PM默认置于左侧，如需位于左边：

<TimePicker    ...    ohos:am_pm_order="1"/>

设置AM/PM位于左边显示的成果

四、范畴抉择设置

1、设置暗藏或显示时分秒

暗藏小时的显示

timePicker.showHour(false);

小时不显示成果：

暗藏分钟

timePicker.showMinute(false);

暗藏分钟成果

暗藏秒

timePicker.showSecond(false);

暗藏秒成果

2、设置TimePicker的selector是否能够滑动

设置小时selector无奈滚动抉择

timePicker.enableHour(false);

小时selector无奈滚动抉择成果

设置分钟selector无奈滚动

timePicker.enableMinute(false);

分钟selector固定无奈抉择成果

设置秒selector无奈滚动

timePicker.enableSecond(false);

秒selector无奈滚动抉择成果