fix(ios) Fixed iOS 14 display error (#76)

Author: alexander-mai

src/datetimepicker.ios.ts

@@ -1,5 +1,6 @@
 import { Color } from "tns-core-modules/color";
 import { View, ios as iosView } from "tns-core-modules/ui/core/view";
+import { device } from "tns-core-modules/platform";
 import {
     DateTimePickerBase, DateTimePickerStyleBase, getCurrentPage,
     DatePickerOptions, TimePickerOptions, PickerOptions
@@ -11,6 +12,10 @@ export class DateTimePickerStyle extends DateTimePickerStyleBase {
 }
 
 export class DateTimePicker extends DateTimePickerBase {
+    private static readonly  SUPPORT_DATE_PICKER_STYLE = parseFloat(device.osVersion) >= 14.0;
+    private static readonly  SUPPORT_TEXT_COLOR = parseFloat(device.osVersion) < 14.0;
+    private static readonly  DEFAULT_DATE_PICKER_STYLE = 1;
+
     public static PICKER_DEFAULT_MESSAGE_HEIGHT = 192;
     public static PICKER_WIDTH_INSETS = 16;
     public static PICKER_WIDTH_PAD = 304;
@@ -43,6 +48,9 @@ export class DateTimePicker extends DateTimePickerBase {
     static _createNativeDatePicker(options: DatePickerOptions): UIDatePicker {
         const pickerView = UIDatePicker.alloc().initWithFrame(CGRectZero);
         pickerView.datePickerMode = UIDatePickerMode.Date;
+        if (this.SUPPORT_DATE_PICKER_STYLE) {
+            (pickerView as any).preferredDatePickerStyle = this.DEFAULT_DATE_PICKER_STYLE;
+        }
         const date = options.date ? options.date : getDateToday();
         pickerView.date = date;
         if (options.maxDate) {
@@ -60,6 +68,9 @@ export class DateTimePicker extends DateTimePickerBase {
     static _createNativeTimePicker(options: TimePickerOptions): UIDatePicker {
         const pickerView = UIDatePicker.alloc().initWithFrame(CGRectZero);
         pickerView.datePickerMode = UIDatePickerMode.Time;
+        if (this.SUPPORT_DATE_PICKER_STYLE) {
+            (pickerView as any).preferredDatePickerStyle = this.DEFAULT_DATE_PICKER_STYLE;
+        }
         const time = options.time ? options.time : getDateNow();
         pickerView.date = time;
         if (options.locale) {
@@ -177,7 +188,9 @@ export class DateTimePicker extends DateTimePickerBase {
             nativeContainer.backgroundColor = backgroundColor.ios;
         }
         if (color) {
-            nativePicker.setValueForKey(color.ios, "textColor");
+            if (this.SUPPORT_TEXT_COLOR) {
+                nativePicker.setValueForKey(color, 'textColor');
+            }
             nativePicker.setValueForKey(false, "highlightsToday");
         }
     }
@@ -243,4 +256,4 @@ export class DateTimePicker extends DateTimePickerBase {
         }
         return null;
     }
-}
+}