4.6.201910161041 • Published 5 years ago

@dfeidao/fd-m000004 v4.6.201910161041

Weekly downloads
-
License
MIT
Repository
-
Last release
5 years ago

日历控件

https://dfeidao.gitee.io/widgets-mobile/

Installation

yarn add --dev @dfeidao/fd-m000004

Android修改日历控件主题颜色

开发时,使用@dfeidao/fd-m000004日历控件时,如果需要修改控件的主题颜色,需要以下操作

在项目目录下的 android/app/src/main/res/values/styles.xml 文件添加

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <!-- 添加下面两行-->
    <item name="android:timePickerDialogTheme">@style/Dialog.Theme</item>
    <item name="android:datePickerDialogTheme">@style/Dialog.Theme</item>
</style>

<!-- 添加下面全部-->
 <style name="Dialog.Theme" parent="Theme.AppCompat.Light.Dialog">
     <item name="colorPrimary">#FF0000</item>
     <item name="colorPrimaryDark">#FF0000</item>
     <item name="colorAccent">#FF0000</item>
 </style>

如图:

示例;

属性名属性说明
cancelTextIOSIOS上的取消按钮上的文本
confirmTextIOSIOS上的确认按钮上的文本
customCancelButtonIOSIOS上的取消按钮的自定义组件
customConfirmButtonIOSIOS上的确认按钮的自定义组件
customConfirmButtonWhileInteractingIOS一个用于iOS上的确认按钮的自定义组件,当用户与日期选择器交互时将显示该组件
contentContainerStyleIOSiOS上ReactNativeModal容器的样式
titleStyletitleIOS的自定义样式(默认为'Pick a Date')
confirmTextStyleconfirmTextIOS的自定义样式(默认为'Confirm')
cancelTextStylecancelTextIOS的自定义样式(默认为'Cancel')
neverDisableConfirmIOS不禁用iOS上的确认按钮
customTitleContainerIOSiOS上标题容器的自定义组件
dismissOnBackdropPressIOS取消日期选择/时间选择时,按下背景(iOS)
hideTitleContainerIOS在iOS中隐藏标题容器
date初始化的日期/时间
locale日期选择器区域设置
isVisible设置选择器的可见性
is24Hour设置模式为24小时时间,如果为false,选择器将显示Android上的AM/PM选择器
mode日期选择类型: 'date' 为选择日期,'time' 为选择时间'datetime' 为选择日期和时间'datetime2' android上与datetime效果一致,ios上分两次,date类型一次,time类型一次,最后总时间为两次选择的合并
datePickerModeAndroid在旋转器和日历视图之间切换Android上的日期模式 'spinner''calendar''default';
timePickerModeAndroid在旋转器和时钟视图之间切换Android上的时间模式 'spinner''clock''default';
titleIOSiOS上选择器的标题文本
minimumDate最小日期
maximumDate最大日期
minuteInterval可以选择分钟的间隔 (1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30)
timeZoneOffsetInMinutes时区以分钟为单位偏移。
pickerRefCb返回节点实例
onDateChange日期改变事件
onConfirm用户按下确认事件
onCancel用户按下取消事件
onHideAfterConfirm关闭动画事件

示例

import M004 from '@dfeidao/fd-m000004';

export default function tpl(a: <T>(action: string, ...args: unknown[]) => ((...args: unknown[]) => void), s: (...class_names: string[]) => {}, d: <T>(d: string) => T, fd: IFeidaoAiMobile) {
	return (<View style={{ flex: 1 }}>
		<M004
			isVisible={d('visible')}
			mode={'datetime'}
			onCancel={a('a001')}
			onConfirm={a('a002')}
		/>
	</View>)
}