Флаттер Материал в Купертино вопросы трансформации

Question

Я работаю над проектом, который почти на 80% выполнен. Весь мой проект сделан на материале дизайна. Сейчас я пытаюсь переместить тему пользовательского интерфейса Купертино для Android и IOS.

Поскольку я пытаюсь перейти от Material design к Cupertino UI, я сталкиваюсь с множеством проблем, особенно в следующих областях:

1. TextFormField: я не могу найти TextFormField в дизайне Купертино для использования с формами...
2. Валидатор: Как проверить CupertinoTextField, так как нет метода валидатора
3. App Drawer: прямо сейчас у меня есть App Drawer. Когда я перехожу к дизайну пользовательского интерфейса Cuprtino для IOS и Android, я должен оставить App Drawer?
4. Как я могу дать ширину кнопки Купертино?
5. ListTitle вызывает исключение, когда я пытаюсь перейти на Cuprtio. Исключение составляет "Конкретный виджет, который не смог найти предка материала, был: ListTitle"

Кроме того, как я могу смешать виджет не Cuprtino на странице CupertinoPageScaffold?

Спасибо за ваше время

Answer 1

1. TextFormField: я не могу найти TextFormField в дизайне Купертино для использования с формами...
2. Валидатор: Как проверить CupertinoTextField, так как нет метода валидатора

Нет никаких TextField с проверкой и методами формы в Купертино. В разработке для iOS вы должны написать свой собственный код проверки формы и вызвать их соответствующим образом. Это не исключение и во Флаттере. Одним из типичных подходов было бы создание внутреннего _FormData класс для хранения вашего TextEditingController для каждого CupertinoTextField затем подтвердите их в своем CupertinoButton "s onPressed Перезвоните.

3. App Drawer: прямо сейчас у меня есть App Drawer. Когда я перехожу к дизайну пользовательского интерфейса Cuprtino для IOS и Android, я должен оставить App Drawer?

Снова, Drawer виджет существует только в дизайне материалов. Все ящики, которые вы можете увидеть в различных приложениях для iOS на рынке, изготовлены на заказ UIView сделано сторонними поставщиками. В Руководстве по интерфейсу Apple Apple четко указано, что

Избегайте использования ящиков. Ящики редко используются в современных приложениях, и их использование не рекомендуется. Панели, всплывающие окна, боковые панели и разделенные виды предпочтительны для отображения содержимого дополнительного окна.

Вы можете рассмотреть возможность использования CupertinoPageScaffold или же CupertinoTabScaffold в зависимости от ваших требований к дизайну.

4. Как я могу дать ширину кнопки Купертино?

Вы можете обернуть CupertinoButton с Container, SizedBox или же FractionallySizedBox,

Container(
    width: 300 // or whatever width you want,
    child: CupertinoButton(
        child: Text('Submit'),
        color: Theme.of(context).primaryColor,
        onPressed: () {
            // Write your callback here
        },
    ),
)

или же

SizedBox(
    width: 300 // or whatever you want,
    child: CupertinoButton(
        child: Text('Submit'),
        color: Theme.of(context).primaryColor,
        onPressed: () {
            // Write your callback here
        },
    ),
)

или же

FractionallySizedBox(
    widthFactor: 0.5 // or whatever you want,
    child: CupertinoButton(
        child: Text('Submit'),
        color: Theme.of(context).primaryColor,
        onPressed: () {
            // Write your callback here
        },
    ),
)

В общем, Container должен сделать свое дело. Если вы заверните CupertinoButton в Flex виджет (такой как ListView, Column), вы можете использовать SizedBox или же FractionallySizedBox, Вы можете обратиться к документации API SizedBox а также FractionallySizedBox

5. ListTitle вызывает исключение, когда я пытаюсь перейти на Cuprtio. Исключение составляет "Конкретный виджет, который не смог найти предка материала, был: ListTitle"

Как говорится в журнале ошибок:

В дизайне материала большинство виджетов концептуально "печатаются" на листе материала. В библиотеке материалов Flutter этот материал представлен виджетом материалов. Например, виджет "Материал" отображает всплески чернил. По этой причине многие виджеты библиотеки материалов требуют наличия виджета "Материал" в дереве над ними. Чтобы представить виджет "Материал", вы можете либо напрямую включить его, либо использовать виджет, который содержит сам материал, например Card, Dialog, Drawer, или же Scaffold,

Я думаю, вы пытаетесь использовать ListTile (который является виджетом Материал) в CupertinoPageScaffold или же CupertinoTabView, которые, очевидно, виджеты Купертино. Вот как я это решил:

Material(
    type: MaterialType.transparency,
    child: ListTile(
        ...
    )
)