如何在UIAlertController的UITextField中添加UIDatePicker组件？

现有代码核心问题 #

• toDoAlert是按钮点击方法内的局部变量，全局的dateChangeEvent方法无法访问，会触发编译错误
• 日期选择变更时直接使用date.description输出，和初始化时的DateFormatter格式不统一，显示样式混乱
• 日期变更时错将第一个（任务名称）输入框的内容修改为日期，不符合业务逻辑

完整修正代码 #

首先在你的类中声明两个全局属性：

// 类顶部声明属性
var setDatePicker = UIDatePicker()
var toDoAlert: UIAlertController?

其余方法实现：

override func viewDidLoad() {
    super.viewDidLoad()
    // 可按需设置选择器样式，iOS14+支持.inline/.wheels等样式
    if #available(iOS 13.4, *) {
        setDatePicker.preferredDatePickerStyle = .wheels
    }
    self.setDatePicker.addTarget(self, action: #selector(self.dateChangeEvent), for: .valueChanged)
}

@IBAction func addNewTaskButtonAction(_ sender: Any) {
    // 赋值给类属性，方便跨方法访问
    self.toDoAlert = UIAlertController(title: "添加待办", message: "新增一条待办任务", preferredStyle: .alert)
    // 第一个文本框：输入任务名称
    toDoAlert?.addTextField { textField in
        textField.placeholder = "请输入任务名称"
    }
    // 第二个文本框：选择截止日期
    toDoAlert?.addTextField { textField in
       textField.inputView = self.setDatePicker
        
       let toolBar = UIToolbar()
       toolBar.barStyle = .default
       toolBar.isTranslucent = true
       toolBar.isUserInteractionEnabled = true
       toolBar.sizeToFit()
        
       let doneButton = UIBarButtonItem(title: "完成", style: .done, target: self, action: #selector(self.onClickDoneButton))
        toolBar.setItems([doneButton], animated: true)
        textField.inputAccessoryView = toolBar
        
        let dateFormatter = DateFormatter()
        dateFormatter.dateStyle = .medium
        dateFormatter.timeStyle = .medium
        textField.text = dateFormatter.string(from: self.setDatePicker.date)
   }
    // 新增确认和取消按钮
    let confirmAction = UIAlertAction(title: "确认添加", style: .default) { [weak self] _ in
        guard let self = self,
              let taskName = self.toDoAlert?.textFields?[0].text,
              !taskName.isEmpty,
              let taskDate = self.toDoAlert?.textFields?[1].text else { return }
        // 这里处理新增待办逻辑，插入到你的UITableView数据源中刷新列表即可
        print("新增任务：\(taskName)，截止时间：\(taskDate)")
    }
    let cancelAction = UIAlertAction(title: "取消", style: .cancel)
    toDoAlert?.addAction(confirmAction)
    toDoAlert?.addAction(cancelAction)
    
    self.present(toDoAlert!, animated: true)
}

@objc func onClickDoneButton() {
    self.view.endEditing(true)
}

@objc private func dateChangeEvent(_ dataPicker: UIDatePicker){
    let dateFormatter = DateFormatter()
    dateFormatter.dateStyle = .medium
    dateFormatter.timeStyle = .medium
    // 修改第二个文本框（日期选择框）的内容
    toDoAlert?.textFields?[1].text = dateFormatter.string(from: dataPicker.date)
}

效果说明 #

• 点击新增按钮弹出弹窗，第一个输入框输入任务名称，第二个输入框点击自动弹出日期选择器
• 滑动日期选择器时，输入框内容会实时同步格式化后的日期
• 点击工具栏的完成按钮收起选择器，点击确认按钮即可拿到任务名称和选中的日期，插入到待办列表刷新UITableView即可

内容的提问来源于stack exchange，提问作者BetYx