Блог

Главная - Вопросы по программированию - Ионный и Углово — ионный дизайн даты и времени на iOS

Ионный и Углово — ионный дизайн даты и времени на iOS

#android #ios #angular #datetime #ionic-framework

Вопрос:

Контекст

Я столкнулся с проблемой с ионной Угловой Конденсатор iOS. Это связано с ion-datetime дизайном компонентов iOS, и, согласно моим исследованиям, существует возможный обходной путь, чтобы соответствовать ему, как на устройствах Android.

Проблема

Проблемы начинаются, когда ion-datetime реализован и применен к устройствам iOS. Если мы хотим, чтобы дизайн этого компонента iOS соответствовал дизайну Android, в документации говорится, что нам нужно передать mode атрибут со значением md . Вот пример HTML:

 <ion-datetime mode="md">/ion-datetime>

И еще один пример как для HTML, так и для TS:

 pickerOptions: any = {
    mode: "md",
};

<ion-datetime [pickerOptions]="pickerOptions"></ion-datetime>

Однако этот документированный подход не дает желаемого результата. Поэтому компонент iOS по — прежнему имеет изогнутое колесо вместо плоского листа. Давайте взглянем на визуальное объяснение.

Визуальное Объяснение

Как объяснялось ранее, устройства iOS и Android теперь должны иметь одинаковый дизайн, потому что мы установили mode атрибут на md . Как мы видим на примере изображения, это явно не так. Дизайн компонентов iOS по-прежнему действует как своего рода изогнутое колесо. По-прежнему сильно отличается от устройства Android.

введите описание изображения здесь

Комментарии:

1. Привет, Гриннекс. Мы довольно строго относимся к разделению вопросов и ответов. Если в будущем у вас возникнет ответ, пожалуйста, сначала напишите вопрос так, как если бы у вас не было ответа, а затем добавьте самостоятельный ответ. Я разделил это, используя опцию Вики-сообщества (см. Ниже), так что все это сделано здесь, если вы не хотите повторно опубликовать ответ для себя (это было бы прекрасно).

Ответ №1:

(Опубликовано от имени автора вопроса, чтобы переместить его в пространство ответов).

Решение этой проблемы довольно простое. Однако это повлияет на дизайн всех ионных компонентов, потому что мы собираемся установить Ionic Module , чтобы все было просто и только md (Дизайн материалов). Поэтому, пожалуйста, имейте в виду, что все, что связано с интерфейсом, будет перезаписано, чтобы иметь дизайн Android. Чтобы реализовать это решение/обходной путь, нам придется просто манипулировать файлом «app.module.ts».

#1 Модуль приложения TS (Ионный проект)

 ...

@NgModule({
    imports: [
        IonicModule.forRoot({
            mode: 'md',
        }),
    ]
})

export class AppModule {}

И это все! ion-datetime Дизайн компонентов iOS теперь станет точно таким же, как дизайн компонентов Android. Пожалуйста, не забывайте, что это приведет к тому, что все ионные компоненты будут перезаписаны с использованием дизайна материала.

Рекомендации

Метки: