UIDatepicker日期选择框的使用与日期键盘的定义

小咪咪 2022-08-19 08:52 230阅读 0赞

第一部分：日期选择框的简单使用

1.1 选择iPhone屏幕

![Center][]

1.2 拖进一个UIPickerView日期选择框

![Center 1][]

运行后发现全是英文显示 如下图所示：

![Center 2][]

1.3  打开storyboard对应的属性设置，设置Mode属性可以设置日期选择框的样式，设置Locale本地化属性设置可以设置它的语言为中文显示，如下图所示：

![Center 3][]

1.4 拖线添加组件属性，也可以手动设置日期选择框的样式，如下所示：

![Center 4][]

![Center 5][]

可以手动打印所有的本地化标示符

![Center 6][]

打印本地化标示符和手动代码设置本地化显示的代码如下：

//
    //  ViewController.m
    //  04.日期选择框与键盘处理
    //
    //  Created by 刘刘勋 on 16/1/3.
    //  Copyright © 2016年 aaaaa. All rights reserved.
    //
    
    #import "ViewController.h"
    
    @interface ViewController ()
    @property (weak, nonatomic) IBOutlet UIDatePicker *datePicker;
    
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
       
        
        // 设置日期控制的本地化
        
        // 打印所有的本地化标示符
        NSLog(@"%@",[NSLocale availableLocaleIdentifiers]);
        self.datePicker.locale = [[NSLocale alloc] initWithLocaleIdentifier:@"zh"];
    }
    
    - (void)didReceiveMemoryWarning {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    
    @end

第二部分：设置日期选择器为输入框的弹出键盘，即弹出日期键盘。实现步骤具体如下：

2.1 首先拖进一个输入框

![Center 7][]

2.1 需要手动创建一个UIDatePicker组件来作为输入框的日期选择键盘。注意：必须是手动代码或XIB创建，否则的话如果使用拖进当前View的日期选择器作为输入框的键盘会提示父控制器错误。设置textField的输入键盘 需要设置它的inputView属性。截图如下：

![Center 8][]

2.2 涉及工具条UIToolbar，先做测试，一般往工具条内拖进Item时默认是从左往右排列的如下所示：

![Center 9][]

为了能改变Item的位置，需要使用弹簧组件进行布控。在搜索组件时搜索 UIbar  就会出现相关的弹簧组件，其中，Fixed Space Bar Button Item：表示定长弹簧，可以设置它的长度来拉开两个Item之间的间距；Flexible Space Bar Button Item 表示带有自动拉伸功能的弹簧，可以自动根据屏幕设置Item居左或具有。步骤如下：

![Center 10][]

加弹簧后的运行效果如下：

![Center 11][]

2.25 如果手动代码实现工具栏的以上布局，并将工具条作为键盘的辅助工具条，需要以下几个过程，注意以下几点：

定长/拉伸弹簧和事件Item的创建都属于UIBarButtonItem类型，事件Item的创建使用\[\[UIBarButtonItem alloc\] initWithTitle:@"XXX" style:UIBarButtonItemStylePlain target: action\] 方法。弹性弹簧的代码创建使用 \[\[UIBarButtonItem alloc\] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target: action: \]方法，而定长弹簧的代码创建使用\[\[UIBarButtonItem alloc\] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target: action: \]方法。 另外需要注意的是手动代码创建定长弹簧后需要设置弹簧的宽度 .width =    最后必不可少的一步就是需要将创建好的所有Item按顺序添加到工具条的items数组中。具体如下：

![Center 12][]

另外设置textField的辅助工具条的属性是inputAccessoryView。

2.3 新建一个继承于UIToolbar的类，使用XIB实现工具条

![Center 13][]

2.4 新建XIB对工具条进行描述

![Center 14][]

2.5 因为绑定的是继承于UIToolbar的自定义类，而XIB中是默认继承于View的，所以要将其删除重新拖进一个UIToolbar组件，如下所示：

![Center 15][]

2.6 往UIToolbar组件内拖进 相应的Item和弹簧，与上面相同，并与创建的自定义组件类进行绑定如下所示：

![Center 16][]

2.7 绑定后 即可拖线实现响应的Item事件。

![Center 17][]

2.8 因为单独抽取了出来，要想在控制器内响应Item的事件，需要使用代理进行通知。在自定义的类中添加协议，一般情况下，与自定义控件相关的协议中的方法参数都要包含此控件（以便在控制器中修改自定义控件的属性）和 内部的Item或Button（便于根据Tag值对不同的Item进行事件处理）

![Center 18][]

2.9 需要注意的是在为自定义控件设置遵循协议的代理属性（id类型）时，不要将代理名称和父类中的代理属性名重合，否则会造成混乱。如下所示：

![Center 19][]

判断代理属性是否实现了协议方法，避免出错：

![Center 20][]

剩余步骤如下：

![Center 21][]

![Center 22][]

运行结果如下：

![Center 23][]

工程如下：

自定义工具条 CZKeyboardToolbar.h

//
    //  CZKeyboardToolbar.h
    //  DatePicker(键盘)
    //
    //  Created by 刘刘勋 on 16/1/3.
    //  Copyright © 2016年 aaaaa. All rights reserved.
    //
    
    #import <UIKit/UIKit.h>
    @class CZKeyboardToolbar;
    @protocol CZKeyboardToolbarDelegate <NSObject>
    
    @optional
    -(void)keyboardToolbar:(CZKeyboardToolbar *)toolbar btnSelected:(UIBarButtonItem *)item;
    
    @end
    
    @interface CZKeyboardToolbar : UIToolbar
    
    +(instancetype)toolbar;
    
    @property (weak, nonatomic) id <CZKeyboardToolbarDelegate> kbDelegate; // 键盘的代理
    
    @end

CZKeyboardToolbar.m

//
    //  CZKeyboardToolbar.m
    //  DatePicker(键盘)
    //
    //  Created by 刘刘勋 on 16/1/3.
    //  Copyright © 2016年 aaaaa. All rights reserved.
    //
    
    #import "CZKeyboardToolbar.h"
    
    @interface CZKeyboardToolbar()
    
    @end
    
    @implementation CZKeyboardToolbar
    
    +(instancetype)toolbar{
        return [[[NSBundle mainBundle] loadNibNamed:@"CZKeyboardToolbar" owner:nil options:nil] lastObject];
    
    }
    - (IBAction)itemBtnClick:(id)sender {
        
        // 判断代理方法有没有实现
        if ([self.kbDelegate respondsToSelector:@selector(keyboardToolbar:btnSelected:)]) {
            [self.kbDelegate keyboardToolbar:self btnSelected:sender];
        }
    }
    @end

viewController.m

//
    //  ViewController.m
    //  DatePicker(键盘)
    //
    //  Created by 刘刘勋 on 16/1/3.
    //  Copyright © 2016年 aaaaa. All rights reserved.
    //
    
    #import "ViewController.h"
    #import "CZKeyboardToolbar.h"
    
    @interface ViewController ()<CZKeyboardToolbarDelegate>
    
    @property(nonatomic, strong)UIDatePicker *datepicker;
    @property (weak, nonatomic) IBOutlet UITextField *textField;
    
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
       
        // 创建一个datePicker
        self.datepicker = [[UIDatePicker alloc] init];
        
        // 本地化
        self.datepicker.locale = [[NSLocale alloc] initWithLocaleIdentifier:@"zh"];
        
        // 日期控件的格式
        self.datepicker.datePickerMode = UIDatePickerModeDate;
        
        // 设置textField的键盘
        self.textField.inputView = self.datepicker;
        
        CZKeyboardToolbar *toolbar = [CZKeyboardToolbar toolbar];
        toolbar.kbDelegate = self;
        
        // 设置textField的辅助工具条
        self.textField.inputAccessoryView = toolbar;
        
    }
    
    
    #pragma mark- 自定义辅助工具条的代理方法
    -(void)keyboardToolbar:(CZKeyboardToolbar *)toolbar btnSelected:(UIBarButtonItem *)item
    {
        NSLog(@"XXXXXX");
        
        if (item.tag == 2) {
            // 获取日期显示在textField
            NSDate *date = self.datepicker.date;
            NSLog(@"%@", date);
            
            // 日期转字符串
            NSDateFormatter *formatter = [[NSDateFormatter alloc] init];
            
            // 设置日期格式
            formatter.dateFormat = @"yyyy-MM-dd";
            
            NSString *dateStr = [formatter stringFromDate:date];
            
            self.textField.text = dateStr;
    
        }
       
    }
    
    /*
       代码创建的toolbar
     */
    -(void)codeForToolbar{
    
        // 代码创建UIToolbar
        UIToolbar *toolbar = [[UIToolbar alloc] init];
        toolbar.backgroundColor = [UIColor grayColor];
        
        // 屏幕宽度
        CGFloat screenW = [[UIScreen mainScreen] bounds].size.width;
        toolbar.bounds = CGRectMake(0, 0, screenW, 44);
        
        UIBarButtonItem *previousBtn = [[UIBarButtonItem alloc] initWithTitle:@"上一个" style:UIBarButtonItemStylePlain target:self action:nil];
        UIBarButtonItem *nextBtn = [[UIBarButtonItem alloc] initWithTitle:@"下一个" style:UIBarButtonItemStylePlain target:self action:nil];
        UIBarButtonItem *doneBtn = [[UIBarButtonItem alloc] initWithTitle:@"done" style:UIBarButtonItemStylePlain target:self action:nil];
        
        // 固定长度的按钮——不可拉伸的弹簧
        UIBarButtonItem *fixedItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
        
        // 代码实现要设置宽度
        fixedItem.width = 20;
        
        // 可拉伸的弹簧组件
        UIBarButtonItem *flexibleItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
        
        // 往UIToolbar里添加按钮
        toolbar.items = @[previousBtn,fixedItem,nextBtn,flexibleItem,doneBtn];
    
    
    }
    - (void)didReceiveMemoryWarning {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    
    @end

[Center]: /images/20220731/af6b250b69304382bd9b988f91ff8701.png
[Center 1]: /images/20220731/a7c8227cfe3241fe987848d905e87009.png
[Center 2]: /images/20220731/c4cb2f1ca361475b8b0f4c5a2788e4ae.png
[Center 3]: /images/20220731/0d3db37adbc7485db89aaa429c110d36.png
[Center 4]: /images/20220731/aa5df58f6bf64c158a4d719a8ea7953e.png
[Center 5]: /images/20220731/ddaeaddcd5d548c1b0706f28f078e4e0.png
[Center 6]: /images/20220731/65aee8d6dedb4772be7ec07d5a0968ab.png
[Center 7]: /images/20220731/b8b742517de048bdbe38e0e4a2224120.png
[Center 8]: /images/20220731/a2015b64d7e34cd399b0ae8ccec42a28.png
[Center 9]: /images/20220731/c2050aca8915499784be4d4d3e6b344e.png
[Center 10]: /images/20220731/58e33fa1ad2a455d8df762be473cca8c.png
[Center 11]: /images/20220731/7eaf9d8d15a0404d87cb8bb9255e4c53.png
[Center 12]: /images/20220731/239d575818254acfb52ef98604c68f92.png
[Center 13]: /images/20220731/3cab8f1e38dd4a698fd59b5d5982b9c7.png
[Center 14]: /images/20220731/22e8ad58046b481eaf1179ff13d4dc6f.png
[Center 15]: /images/20220731/a61d6aa8170c4155b4611c37bfb8b4c7.png
[Center 16]: /images/20220731/851facbc55b241a5b33c9ec43981f73f.png
[Center 17]: /images/20220731/0a5fa0125b9d4b539666add105473963.png
[Center 18]: /images/20220731/a906296cd4ff481f92bf8d91f7d9489f.png
[Center 19]: /images/20220731/79b2d7a786de45d893bc7597a6306832.png
[Center 20]: /images/20220731/e33cfa8a64814d3c84c2dc0e91e66bc0.png
[Center 21]: /images/20220731/2e34607419ed4f928361bdf33e7b6720.png
[Center 22]: /images/20220731/97fc8cf466f44488825e10407b0e133b.png
[Center 23]: /images/20220731/668dab341f4d4f1aa11bfddf81282489.png