是否可以让UIDatePicker与开始和结束时间一起工作？

Question

目前我的UIDatePicker工作如下：

但是我想让它在开始和结束时间如下工作吗？

有没有人在UIDatePicker上完成此自定义？

以这种方式使用UIDatePicker的应用是https://www.zeel.com/

谢谢！

Answer 1

虽然Rikn和Kayla的答案指出了我正确的方向，但他们没有像我在问题中提供的图像一样获得日期，这就是为什么我会把这里放在这里代码我是如何做到的。

结果：

代码：

属性

class ViewController: UIViewController {
  @IBOutlet weak var pickerView: UIPickerView!

  var days = [Date]()
  var startTimes = [Date]()
  var endTimes = [Date]()

  let dayFormatter = DateFormatter()
  let timeFormatter = DateFormatter()

  override func viewDidLoad() {
    super.viewDidLoad()
    dayFormatter.dateFormat = "EE d MMM"
    timeFormatter.timeStyle = .short

    days = setDays()
    startTimes = setStartTimes()
    endTimes = setEndTimes()
  }
}

辅助方法

extension ViewController {
  func getDays(of date: Date) -> [Date] {
    var dates = [Date]()

    let calendar = Calendar.current

    // first date
    var currentDate = date

    // adding 30 days to current date
    let oneMonthFromNow = calendar.date(byAdding: .day, value: 30, to: currentDate)

    // last date
    let endDate = oneMonthFromNow

    while currentDate <= endDate! {
      dates.append(currentDate)
      currentDate = calendar.date(byAdding: .day, value: 1, to: currentDate)!
    }

    return dates
  }

  func getTimes(of date: Date) -> [Date] {
    var times = [Date]()
    var currentDate = date

    currentDate = Calendar.current.date(bySetting: .hour, value: 7, of: currentDate)!
    currentDate = Calendar.current.date(bySetting: .minute, value: 00, of: currentDate)!

    let calendar = Calendar.current

    let interval = 60
    var nextDiff = interval - calendar.component(.minute, from: currentDate) % interval
    var nextDate = calendar.date(byAdding: .minute, value: nextDiff, to: currentDate) ?? Date()

    var hour = Calendar.current.component(.hour, from: nextDate)

    while(hour < 23) {
      times.append(nextDate)

      nextDiff = interval - calendar.component(.minute, from: nextDate) % interval
      nextDate = calendar.date(byAdding: .minute, value: nextDiff, to: nextDate) ?? Date()

      hour = Calendar.current.component(.hour, from: nextDate)
    }

    return times
  }

  func setDays() -> [Date] {
    let today = Date()
    return getDays(of: today)
  }

  func setStartTimes() -> [Date] {
    let today = Date()
    return getTimes(of: today)
  }

  func setEndTimes() -> [Date] {
    let today = Date()
    return getTimes(of: today)
  }

  func getDayString(from: Date) -> String {
    return dayFormatter.string(from: from)
  }

  func getTimeString(from: Date) -> String {
    return timeFormatter.string(from: from)
  }
}

Picker Delegate

extension ViewController: UIPickerViewDelegate, UIPickerViewDataSource {
  func numberOfComponents(in pickerView: UIPickerView) -> Int {
    return 3
  }

  func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
    switch component {
    case 0:
      return days.count
    case 1:
      return startTimes.count
    case 2:
      return endTimes.count
    default:
      return 0
    }
  }

  func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
    var label: UILabel

    if let view = view as? UILabel {
      label = view
    } else {
      label = UILabel()
    }

    label.textColor = .black
    label.textAlignment = .center
    label.font = UIFont.systemFont(ofSize: 15)

    var text = ""

    switch component {
    case 0:
      text = getDayString(from: days[row])
    case 1:
      text = getTimeString(from: startTimes[row])
    case 2:
      text = getTimeString(from: endTimes[row])
    default:
      break
    }

    label.text = text

    return label
  }
}

Answer 2

这是一个关于设计UIPickerView的博客，它几乎完全按照屏幕截图中显示的内容进行操作：

http://codewithchris.com/uipickerview-example/

您需要做的就是编辑选择器视图中显示的数据。

Answer 3

您必须创建自己的UIPickerView并创建自己的列和行。这可以通过将UIPickerView拖到UIViewController并将其设置为dataSource的{​​{1}}和delegate来完成。实施UIPickerView和dataSource协议方法：

delegate

class PickerViewController : UIViewController, UIPickerViewDelegate, UIPickerViewDataSource{ func numberOfComponents(in pickerView: UIPickerView) -> Int { return numberOfColumns } func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int { return rowsInEachColumn } func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? { //set title for each row here depending on component } //or if you want to customize the view of each row, //func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView { //} } 和dataSource类似于delegates。您的UITableView行为与部分相似，而numberOfComponents的行为类似于部分中的行。正如您所料，您将有一个委托方法来告诉您用户选择了哪一行。

numberOfRowsInComponent