How to change the style of the datePicker component ?

Hello, I would like to change the appearance of the datePicker component to customize it, I saw. datePickerStyle (GraphicalDatePickerStyle ()) but it's not what I'm looking for so I would like to customize but I don't know how.

Could someone guide me?
Answered by Claude31 in 673993022
You need to precise your spec a little.

How many days do you want to present ? Only the selected month ?

One way to do :
  • create a scrollView

  • each day is a 2 lines label that you set with the correct day name and number

  • enable user interaction for each label, so that user can tap it

Or you can subclass UISegmentedControl.
Creating images as
  lun
    1

Code Block
class PickerSegmentedControl: UISegmentedControl {
var allImages : [UIImage] = [] // To be set before calling. Must be the right size
func commonInit() {
let numberOfDays = self.numberOfSegments
for i in 0..<numberOfDays where i < allImages.count {
self.setImage(allImages[i], forSegmentAt: i)
}
}
override init(frame: CGRect) {
super.init(frame: frame)
commonInit()
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
commonInit()
}
}

You have several existing styles:
  • CompactDatePickerStyle

  • DefaultDatePickerStyle

  • FieldDatePickerStyle

  • GraphicalDatePickerStyle

  • StepperFieldDatePickerStyle

  • WheelDatePickerStyle

you apply the modifier to the datePicker
.datePickerStyle(WheelDatePickerStyle())

How do you need to customise ? If none of those above styles, you have to create your own picker.

Yes I have already seen .datePickerStyle () and all these styles.
I would like to customize to display the dates on a single line in a horizontal scrollView.

example a bit like that
Code Block
sun mon tue wen thu fri sat sun mon tue wen thu fri sat
1 2 3 4 5 6 7 8 9 10 11 12 .....

Precisely it's for that I would like to create my own picker but I don't know how to do it, where to start.
Accepted Answer
You need to precise your spec a little.

How many days do you want to present ? Only the selected month ?

One way to do :
  • create a scrollView

  • each day is a 2 lines label that you set with the correct day name and number

  • enable user interaction for each label, so that user can tap it

Or you can subclass UISegmentedControl.
Creating images as
  lun
    1

Code Block
class PickerSegmentedControl: UISegmentedControl {
var allImages : [UIImage] = [] // To be set before calling. Must be the right size
func commonInit() {
let numberOfDays = self.numberOfSegments
for i in 0..<numberOfDays where i < allImages.count {
self.setImage(allImages[i], forSegmentAt: i)
}
}
override init(frame: CGRect) {
super.init(frame: frame)
commonInit()
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
commonInit()
}
}

Thank you for your help
How to change the style of the datePicker component ?
 
 
Q