在文本字段点击上显示日期选择器

Posted

技术标签:

【中文标题】在文本字段点击上显示日期选择器【英文标题】:Show datepicker on textfield tap 【发布时间】:2012-10-01 11:00:38 【问题描述】:

我对 ios 很陌生,所以很明显,当我尝试按照这个解决方案 Display datepicker on tapping on textfield 解决我的问题时,我错过了一些概念。

我在一个名为 DatepickerAppDelegate 的类中有接口和实现,但我在这里迷路了:

“在 XIB 中,拉出一个 UIToolbar 和一个 UIDatePicker,但不要将其附加到视图。适当地连接出口。dateChanged:响应日期选择器中的更改和 doneEditing:在完成时调用单击工具栏中的按钮。将它们也连接起来。方法实现如下。"

我读过一些关于 XIB 的文章,但我使用的是故事板,所以我想我没有。另外,我不确定我应该如何在不将元素附加到我的视图控制器的情况下拉出元素(我正在尝试,但是当我释放鼠标按钮时,该工具会飞回工具栏),我没有甚至不明白为什么我需要一个 UIToolbar。

最后,如何将我的文本字段连接到 datepicker 委托?

有人可以帮我吗?

更新:

其实很简单,我只需要:

datePicker = [[UIDatePicker alloc] init];
datePicker.datePickerMode = UIDatePickerModeDate;
[datePicker addTarget:self action:@selector(datePickerValueChanged:) forControlEvents:UIControlEventValueChanged];

self.birthday.inputView = datePicker;

【问题讨论】:

【参考方案1】:

UIResponderUITextField 继承自 defines a property called inputView。此属性(UIView *)可以定义一个视图,当UIResponder 成为第一响应者时,该视图将而不是键盘显示。

因此,如果您希望在点击 textField 时出现 UIDatePicker(即,您将该 textField 作为第一响应者),那么您可以天真地说:

UIDatePicker *datePicker = [[UIDatePicker alloc] init...];
... configure datePicker ...

[myTextField setInputView:datePicker];

现在,当您的UITextField 被点击时,将显示UIDatePicker

但是

你会想做更多的事情,因为你需要处理不同的方向和不同的习语。

但这是基本思想。

(如果您想要在UIDatePicker 上方的工具栏,这就是inputAccessoryView 属性的用途...)

【讨论】:

我根据这个答案写了一个开源类STADateField。【参考方案2】:

在 viewDidLoad 中 ViewController.m

- (void)viewDidLoad 
    [super viewDidLoad];

    UIDatePicker *datePicker = [[UIDatePicker alloc]init];
    [datePicker setDate:[NSDate date]];
    datePicker.datePickerMode = UIDatePickerModeDate;
    [datePicker addTarget:self action:@selector(dateTextField:) forControlEvents:UIControlEventValueChanged];
    [txtFieldBranchYear setInputView:datePicker];

在你的 ViewController 中添加一个方法

-(void) dateTextField:(id)sender

    UIDatePicker *picker = (UIDatePicker*)txtFieldBranchYear.inputView;
    [picker setMaximumDate:[NSDate date]];
    NSDateFormatter *dateFormat = [[NSDateFormatter alloc] init];
    NSDate *eventDate = picker.date;
    [dateFormat setDateFormat:@"dd/MM/yyyy"];

    NSString *dateString = [dateFormat stringFromDate:eventDate];
    txtFieldBranchYear.text = [NSString stringWithFormat:@"%@",dateString];

txtFieldBranchYear 是UITextField的一个出口

【讨论】:

很好的答案。只是一个简化:txtFieldBranchYear.text = dateString; 也应该完成这项工作。【参考方案3】:

在您的视图中添加一个 datepicker 视图和 uitoolbarview。 例如

CGFloat toolbarHeight = 44.f;
CGFloat datePickerHeight = 140.f;
CGFloat containerViewHeight = toolbarHeight+datePickerHeight;
//create container view for datepicker and toolbar
UIView *containerView = [[UIVIew alloc] initWithFrame:CGRectMake(0.f, [self.view bounds].size.height+containerViewHeight, [self.view bounds].size.width, containerViewHeight)];

//after init toolbar set the frame
toolBar.frame = CGRectMake(0.f,0.f,containerView.frame.size.width, toolbarHeight];
//then add on toolbar button save and release it after add

//after init datePicker set the frame
datePicker.frame = CGRectMake(0.f, toolbarHeight, containerView.frame.size.width, datePickerHeight);

//add datePicker and toolBar to containerView
[containerView addSubview: toolBar];
[containerView addSubview: datePicker];

[toolBar release];
[datePicker release];

//add containerView to main view

[self.view addSubview: containerView];
[containerView release];

因此,当视图确实加载时,它们将被隐藏,竞争者视图的 Y 位于您的视图框架之外。

现在你应该分配 UITextFieldDelegate 的属性委托

textfield.delegate = self;

在委托 textFieldDidBeginEditing 的方法中,请参阅UITextFieldDelegate,您应该触发将显示您的 datePicker 和工具栏的方法。 如果您有许多 textFields 来定义哪个被选中,请使用 tag 属性,它是整数,您可以使用 switch 代替许多 if 条件。

要显示您的 datePicker 和工具栏,您应该更改 containerView 框架的 Y。 以下是如何做到这一点

CGRect containerViewFrame = containerView.frame;
containerViewFrame.y -=containerViewHeight;
containerView.frame = containerViewFrame;

隐藏只是加上 containerViewHeight 变量。 您可以使用 UIViewAnimations 用一些动画来显示它。例如 UIViewAnimationCurveEaseInOut

【讨论】:

以上是关于在文本字段点击上显示日期选择器的主要内容,如果未能解决你的问题,请参考以下文章

日期选择器之外的键盘

点击日期字段时如何调出日期选择器?

日期选择器在文本字段 iOS 8 上崩溃

如何以酥脆的形式在日期字段上显示日期选择器日历?

获取报告后通过 jquery 日期选择器保留输入值

按 esc 后无法打开日期选择器