iOS中使用UIDatePicker制作时间选择器的实例教程

时间:2022-09-19 22:57:14

uidatepicker的创建
uidatepicker是一个可以用来选择或者设置日期的控件,不过它是像转轮一样的控件,而且是苹果专门为日历做好的控件,如下图所示:

iOS中使用UIDatePicker制作时间选择器的实例教程

除了uidatepicker控件,还有一种更通用的转轮形的控件:uipickerview,只不过uidatepicker控件显示的就是日 历,而uipickerview控件中显示的内容需要我们自己用代码设置。本篇文章简单介绍uidatepicker控件,后边的文章会介绍 uipickerview。

1、运行xcode ,新建一个single view application,名称为uidatepicker test,其他设置如下图所示:

iOS中使用UIDatePicker制作时间选择器的实例教程

2、单击viewcontroller.xib,打开interface builder。拖一个uidatepicker控件到视图上:

iOS中使用UIDatePicker制作时间选择器的实例教程

3、然后拖一个按钮在视图上,并修改按钮名称为select:

iOS中使用UIDatePicker制作时间选择器的实例教程

单击按钮后,弹出一个alert,用于显示用户所作选择。

4、创建映射:打开assistant editor,选中uidatepicker控件,按住control,拖到viewcontroller.h中:

iOS中使用UIDatePicker制作时间选择器的实例教程

新建一个outlet,名称为datepicker:

iOS中使用UIDatePicker制作时间选择器的实例教程

然后以同样的方式为按钮建立一个action映射,名称为buttonpressed,事件类型为默认的touch up inside。

5、选中uidatepicker控件,打开attribute inspector,在其中设置maximum date比如我们这里设为2100-12-31:

iOS中使用UIDatePicker制作时间选择器的实例教程

 


实例
而今天我们要做的时间选取器成品具体效果如下:

iOS中使用UIDatePicker制作时间选择器的实例教程

我们自定义一个lgdatepickerview,在lgdatepickerview里面实现。

背景半透明:

背景是半透明的,点击的灰色背景的时候,时间选取器消失。在lgdatepickerview初始化方法里,代码如下:

复制代码 代码如下:

- (id)init
{
    self = [super init];
    if (self) {
  //背景半透明,绑定取消方法
    uicontrol *control = [[uicontrol alloc] initwithframe:screen_bounds];
    control.backgroundcolor = [uicolor colorwithred:0.0/255.0 green:0.0/255.0 blue:0.0/255.0 alpha:0.5f];
    [self addsubview:control];
    [control addtarget:self action:@selector(actioncancel:) forcontrolevents:uicontroleventtouchupinside];    
     }
    return self;
}


绑定的actioncancel方法:

复制代码 代码如下:

- (void)actioncancel:(id)sender
{
    [self removefromsuperview];
}


确定取消按钮:

 

看到上面的确定取消按钮,你会怎么做,写一个uiview上面放两个uibutton。这样做也是可以实现的。我们还可以用uitoolbar。在lgdatepickerview初始化方法里加上下面这段代码:

复制代码 代码如下:

 // toolbar
uitoolbar *toolbar = [[uitoolbar alloc] initwithframe:cgrectmake(0, screen.height - 250, screen.width, 50)];
toolbar.autoresizingmask = uiviewautoresizingflexibletopmargin | uiviewautoresizingflexiblewidth;
uibarbuttonitem *itemcanceldone = [[uibarbuttonitem alloc] initwithtitle:@"确定" style:uibarbuttonitemstyleplain target:self action:@selector(actionconfirm:)];
uibarbuttonitem *itemcancel = [[uibarbuttonitem alloc] initwithtitle:@"取消" style:uibarbuttonitemstyleplain target:self action:@selector(actioncancel:)];
uibarbuttonitem *space = [[uibarbuttonitem alloc] initwithbarbuttonsystemitem:uibarbuttonsystemitemflexiblespace target:nil action:nil];
[toolbar setitems:[nsarray arraywithobjects:itemcancel,space,itemcanceldone, nil]];
[control addsubview:toolbar];


actioncancel上面已经实现了。下面实现actionconfirm方法。它有什么作用呢?

 

点击的时候获取到时间,然后通过代理代理出去。
时间选取器消失:

复制代码 代码如下:

  - (void)actionconfirm:(id)sender
  {
      if ([self.delegate respondstoselector:@selector(datepickerview:didselecttime:)]) {
          [self.delegate datepickerview:self didselecttime:self.datepicker.date];
      }
      [self removefromsuperview];
  }


代理方法:

 

在lgdatepickerview.h

复制代码 代码如下:


@protocol lgdatepickerviewdelegate <nsobject>

 

- (void)datepickerview:(lgdatepickerview *)datepicker didselecttime:(nsdate *)time;

@end


创建uidatepicker:

 

在lgdatepickerview.h定义一个全局变量

 

复制代码 代码如下:

@property (nonatomic, strong) uidatepicker *datepicker;


在lgdatepickerview初始化方法里加上下面这段代码:

复制代码 代码如下:

uidatepicker *datepicker = [[uidatepicker alloc] init];
datepicker.backgroundcolor = [uicolor whitecolor];
datepicker.datepickermode = uidatepickermodecountdowntimer;
datepicker.date = [nsdate date];
datepicker.frame = cgrectmake(0, screen.height - 200, screen.width, 220);
[control addsubview:datepicker];
self.datepicker = datepicker;


使用lgdatepickerview

 

使用起来很简单,创建一下,然后加载self.view上面即可:

复制代码 代码如下:

    lgdatepickerview *datepicker = [[lgdatepickerview alloc] init];
    datepicker.delegate = self;
    datepicker.datepicker.date = [nsdate date];
    datepicker.frame = self.view.bounds;
    [self.view addsubview:datepicker];