Как последовательно применить «TextScaler» Flutter ко всем (встроенным Flutter) виджетам? Или масштабировать весь рендеринг по всему миру?
Я новичок во Flutter и стремлюсь использовать его в первую очередь для создания настольного приложения (Linux, Win, Mac) с версиями для планшетов/веб из той же кодовой базы в будущем, а не в настоящем.
Что ж, простое стартовое приложение, основанное на документации, в моей системе KDE (1920x1200, экран 14 дюймов) имеет слишком маленькие размеры шрифта, отображаемые по умолчанию, кроме заголовка на панели приложения:
Стандартные вещи начального уровня: это корневой StatelessWidget, возвращающий build a MaterialApp с home: Scaffold(...), который имеет appBar: AppBar(...), body: Text(...) и bottomNavigationBar: BottomNavigationBar(...). На данный момент настройки размера шрифта не применяются. Давайте проигнорируем непоследовательные размеры шрифта нижней навигационной панели (я думаю, это должно быть чье-то задумано), но сосредоточимся на том факте, что по сравнению с остальной частью настройки рабочего стола KDE размеры шрифтов Text и BottomNavigationBar, по крайней мере, слишком велики. крошечный.
Теперь моя идея заключалась в том, чтобы иметь в приложении единый параметр масштабирования текста, который мог бы установить пользователь и который автоматически применялся бы ко всем представлениям текста всеми встроенными виджетами рендеринга текста Flutter. Основываясь на исследованиях, я подумал, что использование TextScaler вот так поможет:
Widget build(BuildContext context) {
TextScaler textScaler = const TextScaler.linear(2.0); // later user-settable
// ... setup `MaterialApp materialApp` with children here...
return MediaQuery(
data: MediaQuery.of(context).copyWith(textScaler: textScaler),
child: materialApp,
);
но результат странный:
- Кнопки нижней навигационной панели, очевидно, не применяют родительский TextScaler
- Заголовок панели приложения масштабировался лишь немного, но не «2x», только
Textмасштабировался правильно «2x».
Тот же результат, если родительский элемент MediaQuery не MaterialApp, а его home: Scaffold(...), кстати.
Кто-нибудь знает, как масштабировать «по всем направлениям» без точной настройки всех отдельных параметров FontSize?
(Если подумать, даже одношаговый механизм «масштабировать не только текст, но и все, изображения, значки и т. д.» был бы для меня подходящим — возможно, даже предпочтительнее, учитывая все обстоятельства).
Ответы 1
После попытки воспроизвести ту же проблему мне удалось ее исправить, убедившись, что виджет MediaQuery охватывает весь MaterialApp.
Widget build(BuildContext context) {
TextScaler textScaler = const TextScaler.linear(1.1);
return MediaQuery(
data: MediaQuery.of(context).copyWith(textScaler: textScaler),
child: const MaterialApp(home: MyWidget()),
);
}
MyWidget содержит Scaffold, который имеет appBar и abottomNavigationBar. На всех из них влияют textScaler:
Большое спасибо за то, что придумали этот подход и опробовали его, Ахмад! Любопытно, я последовал этой идее в своей системе, но здесь она работала для строки заголовка и текста, но не для
BottomNavigationBarItem. Но также работает для добавленного мнойNavigationDrawer, который заменит нижнюю панель. Думаю, тогда я буду играть на слух, компонент за компонентом... =)