UIDatePicker

来自于：AC模块工作室立即使用

• Method

open close hide show

论坛示例

为帮助用户更好更快的使用模块，论坛维护了一个示例，示例中包含示例代码、知识点讲解、注意事项等，供您参考。

概述

UIDatePicker 是一个日期选择器，支持年、年月、年月日、年月日时、年月日时分、年月日时分秒、月日、月日时、月日时分、月日时分秒、时分、时分秒、分秒等。也可以自己设置样式:如可设置行高，标题，时间。

open

打开选择器

open({params}, callback(ret, err))

params

type：

• 类型：字符串
• 默认值：无
• 描述：选择器类型
• 取值范围：

 year                     //年份
 yearAndMonth             //年月
 date                     //年月日
 dateHour                 //年月日时
 dateHourMinute           //年月日时分
 dateHourMinuteSecond     //年月日时分秒
 monthAndDay              //月日 
 monthDayAndHour          //月日时
 monthDayHourAndMinute    //月日时分
 monthDayHourMinuteSecond //月日时分秒
 time                     //时分
 timeAndSecond            //时分秒
 minuteAndSecond          //分秒

date：

• 类型：字符串
• 默认值：如果不设置,则为当前时间
• 描述：（可选项）设置当前时间，格式yyyy-MM-dd HH:mm:ss

minDate：

• 类型：字符串
• 默认值：无
• 描述：（可选项）能够选择的最小时间，格式yyyy-MM-dd HH:mm:ss

maxDate：

• 类型：字符串
• 默认值：无
• 描述：（可选项）能够选择的最大时间，格式yyyy-MM-dd HH:mm:ss

title：

• 类型：字符串
• 默认值：无
• 描述：（可选项）显示在选择器上面的标题；

titleStyle：

{
        size: 14,                   //（可选项）数字类型；标题字体大小；默认：20
        color: '#FFFFFF',           //（可选项）字符串类型；b字体颜标题色，支持rgb、rgba、#；默认：#FFFFFF
        ttf:'Alkatip Basma Tom'     //（可选项）字符串类型；默认值：标题字体；（仅iOS支持）
                                    本参数在 iOS 平台上表示字体名称 （必须已在 config 文件内配置 ttf 文件(//docs.apicloud.com/Dev-Guide/app-config-manual#14-1)，并在 widget 包内包含该 ttf 文件）；
}

titleImage：

• 类型：字符串
• 默认值：无
• 描述：（可选项）显示在选择器上面的标题图片，支持widget://，fs://；与title互斥，只能存在一个

rowHeight：

• 类型：数字
• 描述：（可选项）设置选择器的行高
• 默认值：40

styles：

• 类型：JSON 对象
• 描述：（可选项）模块各部分的样式
• 内部字段：

{
    bg: 'rgba(0,0,0,0)',     //（可选项）字符串类型；模块背景，支持 rgb、rgba、#；
    headerViewBackgroundColor: 'rgba(0,0,0,0)',     //（可选项）字符串类型；设置头部的背景颜色，支持 rgb、rgba、#；
    lineBackgroundColor: 'rgba(0,0,0,0)',     //（可选项）字符串类型；设置线条的颜色，支持 rgb、rgba、#；
    item:{                   //（可选项）JSON对象；item 样式；默认值见内部字段
      normal: '#f00',     //（可选项）字符串类型；常态字体色，支持 rgb、rgba、#；
      normalFont: 14            //（可选项）数字类型；常态字体大小，；默认值：14
      selected: '#000079',   //（可选项）字符串类型；选中后的字体色，支持 rgb、rgba、#；
      selectedFont: 17            //（可选项）数字类型；选中后字体大小，；默认值：17
      cancelBtn:{
           cancelButtonTextColor: '#1E1E1E',   //（可选项）字符串类型；设置取消按钮的字体颜色，支持 rgb、rgba、#；默认值：#1E1E1E
         cancelButtonText: 'cancel' ,         //（可选项）字符串类型；设置取消按钮的字，；默认值：'cancel'
         cancelButtonFont:17                  //（可选项）数字类型；设置取消按钮的字体大小，；默认值：17
         cancelButtonImage:''                 //（可选项）字符串类型；设置取消按钮的图片，与cancelButtonText互斥，只能存在一个
    },
    confirmBtn:{
        confirmButtonTextColor: '#1E1E1E',   //（可选项）字符串类型；设置确定按钮的字体颜色，支持 rgb、rgba、#；默认值：#1E1E1E
        confirmButtonText: 'confirm' ,         //（可选项）字符串类型；设置确定按钮的字，；默认值：'confirm'
        confirmButtonFont:17                  //（可选项）数字类型；设置确定按钮的字体大小，；默认值：17
        confirmButtonImage:''                 //（可选项）字符串类型；设置确定按钮的图片，与confirmButtonText互斥，只能存在一个
    }
    }
}

cyclic：

• 类型：布尔类型
• 描述：（可选项）是否可循环滑动
• 默认：false

hideIndicator

• 类型：布尔类型
• 描述：（可选项）是否隐藏单位（年月日时分秒）
• 默认：false

fixedOn：

• 类型：字符串类型
• 描述：（可选项）模块视图添加到指定 frame 的名字（只指 frame，传 window 无效）
• 默认：模块依附于当前 window

fixed:

• 类型：布尔
• 描述：（可选项）模块是否随所属 window 或 frame 滚动
• 默认值：true（不随之滚动）

callback(ret, err)

ret：

• 类型：JSON 对象
• 内部字段：

{
    eventType:‘submit’/'cancle'        //字符串类型  确定返回‘submit’  取消返回'cancle'（点击取消或点击空白区域均按取消 返回）
    year:2000,                  //年
    month:1,                    //月
    day:1,                      //日
    hour:12,                    //时
    minute:00                   //分
    seconds:08                  //秒
}

示例代码

var UIDatePicker = api.require('UIDatePicker');
UIDatePicker.open({
   type: 'timeAndSecond',
   rowHeight:40,
   maxDate:'2034-05-01 12:30:08',
   minDate:'2004-05-01 12:30:08',
   title: '选择时间',
   titleStyle:{
       size: 14,                   //（可选项）数字类型；标题字体大小；默认：20
        color: '#FFFFFF',           //（可选项）字符串类型；b字体颜标题色，支持rgb、rgba、#；默认：#FFFFFF
        ttf:'Alkatip Basma Tom'     //（可选项）字符串类型；默认值：标题字体；
   },
    styles: {
            bg: 'rgba(0,0,0,0)', 
           headerViewBackgroundColor:'rgba(0,0,0,0)',
           lineBackgroundColor: 'rgba(0,0,0,0)',    
    item:{                
         normal: '#f00',
            normalFont: 14,      
         selected: '#000079',   
         selectedFont: 17,               
         cancelBtn:{
               cancelButtonTextColor: '#1E1E1E',  
             cancelButtonText: 'cancel' ,         
             cancelButtonFont:17                     
         },
         confirmBtn:{
            confirmButtonTextColor: '#1E1E1E',  
             confirmButtonText: 'confirm' ,         
             confirmButtonFont:17                 
            },
    }
    },
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

close

关闭选择器

close()

示例代码

var UIDatePicker = api.require('UIDatePicker');
UIDatePicker.close();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

hide

隐藏选择器

hide()

示例代码

var UIDatePicker = api.require('UIDatePicker');
UIDatePicker.hide();

补充说明

隐藏选择器，并没有从内存里清除

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

show

显示已隐藏的选择器

show()

示例代码

var UIDatePicker = api.require('UIDatePicker');
UIDatePicker.show();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

论坛示例

为帮助用户更好更快的使用模块，论坛维护了一个示例，示例中包含示例代码、知识点讲解、注意事项等，供您参考。