From 21d56cf2a2c06dca6f791335f866a45d29b47c2e Mon Sep 17 00:00:00 2001 From: asharghi Date: Fri, 25 Sep 2020 12:29:09 +0200 Subject: [PATCH 1/3] fix(ios): preferredDatePickerStyle property --- packages/core/ui/time-picker/index.d.ts | 12 ++++++++++++ packages/core/ui/time-picker/index.ios.ts | 7 +++---- packages/core/ui/time-picker/time-picker-common.ts | 7 +++++++ 3 files changed, 22 insertions(+), 4 deletions(-) diff --git a/packages/core/ui/time-picker/index.d.ts b/packages/core/ui/time-picker/index.d.ts index ccab54fb2c..4801589d60 100644 --- a/packages/core/ui/time-picker/index.d.ts +++ b/packages/core/ui/time-picker/index.d.ts @@ -54,6 +54,16 @@ export class TimePicker extends View { * Gets or sets the minute interval. */ minuteInterval: number; + + /** + * Gets or set the UIDatePickerStyle of the date picker in iOS 13.4+. Defaults to 0. + * Valid values are numbers: + * - 0: automatic (system picks the concrete style based on the current platform and date picker mode) + * - 1: wheels (the date picker displays as a wheel picker) + * - 2: compact (the date picker displays as a label that when tapped displays a calendar-style editor) + * - 3: inline (the date pickers displays as an inline, editable field) + */ + iosPreferredDatePickerStyle: number; } export const hourProperty: Property; @@ -66,3 +76,5 @@ export const minMinuteProperty: Property; export const timeProperty: Property; export const minuteIntervalProperty: Property; + +export const iosPreferredDatePickerStyleProperty: Property; \ No newline at end of file diff --git a/packages/core/ui/time-picker/index.ios.ts b/packages/core/ui/time-picker/index.ios.ts index f0624e512a..12c7ddd7fb 100644 --- a/packages/core/ui/time-picker/index.ios.ts +++ b/packages/core/ui/time-picker/index.ios.ts @@ -5,9 +5,8 @@ import { Device } from '../../platform'; export * from './time-picker-common'; -const SUPPORT_DATE_PICKER_STYLE = parseFloat(Device.os) >= 14.0; -const SUPPORT_TEXT_COLOR = parseFloat(Device.os) < 14.0; -const DEFAULT_DATE_PICKER_STYLE = 1; +const SUPPORT_DATE_PICKER_STYLE = parseFloat(Device.osVersion) >= 13.4; +const SUPPORT_TEXT_COLOR = parseFloat(Device.osVersion) < 14.0; function getDate(hour: number, minute: number): Date { let components = NSDateComponents.alloc().init(); @@ -36,7 +35,7 @@ export class TimePicker extends TimePickerBase { const picker = UIDatePicker.new(); picker.datePickerMode = UIDatePickerMode.Time; if (SUPPORT_DATE_PICKER_STYLE) { - picker.preferredDatePickerStyle = DEFAULT_DATE_PICKER_STYLE; + picker.preferredDatePickerStyle = this.iosPreferredDatePickerStyle; } return picker; } diff --git a/packages/core/ui/time-picker/time-picker-common.ts b/packages/core/ui/time-picker/time-picker-common.ts index 077973ab39..a00d2bcd7c 100644 --- a/packages/core/ui/time-picker/time-picker-common.ts +++ b/packages/core/ui/time-picker/time-picker-common.ts @@ -98,6 +98,7 @@ export abstract class TimePickerBase extends View implements TimePickerDefinitio public maxHour: number; public minMinute: number; public maxMinute: number; + public iosPreferredDatePickerStyle: number; } TimePickerBase.prototype.recycleNativeView = 'auto'; @@ -204,3 +205,9 @@ export const timeProperty = new Property({ }, }); timeProperty.register(TimePickerBase); + +export const iosPreferredDatePickerStyleProperty = new Property({ + name: 'iosPreferredDatePickerStyle', + defaultValue: 0 +}); +iosPreferredDatePickerStyleProperty.register(TimePickerBase); From 4f1a51f5951646ee2107f6af6b06e8c9322410cb Mon Sep 17 00:00:00 2001 From: asharghi Date: Fri, 25 Sep 2020 22:13:48 +0200 Subject: [PATCH 2/3] fix(ios): datetime preferredDatePickerStyle --- packages/core/ui/date-picker/date-picker-common.ts | 7 +++++++ packages/core/ui/date-picker/index.d.ts | 11 +++++++++++ packages/core/ui/date-picker/index.ios.ts | 7 +++---- 3 files changed, 21 insertions(+), 4 deletions(-) diff --git a/packages/core/ui/date-picker/date-picker-common.ts b/packages/core/ui/date-picker/date-picker-common.ts index 936ee77cb5..f1b7abb084 100644 --- a/packages/core/ui/date-picker/date-picker-common.ts +++ b/packages/core/ui/date-picker/date-picker-common.ts @@ -13,6 +13,7 @@ export class DatePickerBase extends View implements DatePickerDefinition { public maxDate: Date; public minDate: Date; public date: Date; + public iosPreferredDatePickerStyle: number; } DatePickerBase.prototype.recycleNativeView = 'auto'; @@ -60,3 +61,9 @@ export const dateProperty = new Property({ valueConverter: (v) => new Date(v), }); dateProperty.register(DatePickerBase); + +export const iosPreferredDatePickerStyleProperty = new Property({ + name: 'iosPreferredDatePickerStyle', + defaultValue: 0 +}); +iosPreferredDatePickerStyleProperty.register(DatePickerBase); \ No newline at end of file diff --git a/packages/core/ui/date-picker/index.d.ts b/packages/core/ui/date-picker/index.d.ts index b735de5d8f..e255230e49 100644 --- a/packages/core/ui/date-picker/index.d.ts +++ b/packages/core/ui/date-picker/index.d.ts @@ -7,6 +7,7 @@ export const dayProperty: Property; export const dateProperty: Property; export const maxDate: Property; export const minDate: Property; +export const iosPreferredDatePickerStyleProperty: Property; /** * Represents an date picker. @@ -51,4 +52,14 @@ export class DatePicker extends View { * Gets or sets the min date. */ minDate: Date; + + /** + * Gets or set the UIDatePickerStyle of the date picker in iOS 13.4+. Defaults to 0. + * Valid values are numbers: + * - 0: automatic (system picks the concrete style based on the current platform and date picker mode) + * - 1: wheels (the date picker displays as a wheel picker) + * - 2: compact (the date picker displays as a label that when tapped displays a calendar-style editor) + * - 3: inline (the date pickers displays as an inline, editable field) + */ + iosPreferredDatePickerStyle: number; } diff --git a/packages/core/ui/date-picker/index.ios.ts b/packages/core/ui/date-picker/index.ios.ts index f7e1618bb9..118124bd0a 100644 --- a/packages/core/ui/date-picker/index.ios.ts +++ b/packages/core/ui/date-picker/index.ios.ts @@ -5,9 +5,8 @@ import { Device } from '../../platform'; export * from './date-picker-common'; -const SUPPORT_DATE_PICKER_STYLE = parseFloat(Device.os) >= 14.0; -const SUPPORT_TEXT_COLOR = parseFloat(Device.os) < 14.0; -const DEFAULT_DATE_PICKER_STYLE = 1; +const SUPPORT_DATE_PICKER_STYLE = parseFloat(Device.osVersion) >= 13.4; +const SUPPORT_TEXT_COLOR = parseFloat(Device.osVersion) < 14.0; export class DatePicker extends DatePickerBase { private _changeHandler: NSObject; @@ -17,7 +16,7 @@ export class DatePicker extends DatePickerBase { const picker = UIDatePicker.new(); picker.datePickerMode = UIDatePickerMode.Date; if (SUPPORT_DATE_PICKER_STYLE) { - picker.preferredDatePickerStyle = DEFAULT_DATE_PICKER_STYLE; + picker.preferredDatePickerStyle = this.iosPreferredDatePickerStyle; } return picker; } From 118c58d614d3fa4cf9bf331cf4c7492c29275613 Mon Sep 17 00:00:00 2001 From: asharghi Date: Fri, 25 Sep 2020 22:31:49 +0200 Subject: [PATCH 3/3] fix(ios): iosPreferredDatePickerStyle parseInt --- packages/core/ui/date-picker/date-picker-common.ts | 3 ++- packages/core/ui/time-picker/time-picker-common.ts | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/core/ui/date-picker/date-picker-common.ts b/packages/core/ui/date-picker/date-picker-common.ts index f1b7abb084..de41507b10 100644 --- a/packages/core/ui/date-picker/date-picker-common.ts +++ b/packages/core/ui/date-picker/date-picker-common.ts @@ -64,6 +64,7 @@ dateProperty.register(DatePickerBase); export const iosPreferredDatePickerStyleProperty = new Property({ name: 'iosPreferredDatePickerStyle', - defaultValue: 0 + defaultValue: 0, + valueConverter: (v) => parseInt(v), }); iosPreferredDatePickerStyleProperty.register(DatePickerBase); \ No newline at end of file diff --git a/packages/core/ui/time-picker/time-picker-common.ts b/packages/core/ui/time-picker/time-picker-common.ts index a00d2bcd7c..39c02cbae1 100644 --- a/packages/core/ui/time-picker/time-picker-common.ts +++ b/packages/core/ui/time-picker/time-picker-common.ts @@ -208,6 +208,7 @@ timeProperty.register(TimePickerBase); export const iosPreferredDatePickerStyleProperty = new Property({ name: 'iosPreferredDatePickerStyle', - defaultValue: 0 + defaultValue: 0, + valueConverter: (v) => parseInt(v), }); iosPreferredDatePickerStyleProperty.register(TimePickerBase);