状況
iOSでもAndroidでも、端末本体の設定で文字サイズを大きくしたり小さくしたりすることが出来ますが、端末の文字サイズ設定を変更していると、レイアウトが崩れてしまうことが多々あります。
本来文字サイズに合わせて表示させるべきなんですが、どうしてもレイアウト構成上難しい箇所があり、固定にしたい場所が生じてしまいました。
Androidで言う、文字サイズをdp
指定しちゃうみたいなことが出来ないかなと思って調べた結果です。
環境など
ツールなど | バージョンなど |
---|---|
MacBook Air Early2015 | macOS Mojave 10.14.6 |
Android Studio | 3.6.1 |
Java | 1.8.0_131 |
Flutter | 1.12.13+hotfix.9 |
Dart | 2.7.2 |
Xcode | 11.3.1 |
解決策
Text
ウィジェットのパラメータtextScaleFactor
に1.0
を渡せば固定されます。
このパラメータを指定していないときは、MediaQuery.textScaleFactorOf
が使用されます。端末の文字サイズを変更しているとこの値が変わるんですね。よって端末の文字サイズ設定に応じてフォントサイズが変わっているわけです。
そこに1.0
を渡してしまえば、フォントサイズが固定されることになります。
Text(
'なんらかのタイトル',
style: TextStyle(fontSize: 14),
textScaleFactor: 1.0,
),
flutter_screenutilというパッケージもあるようですが、上記の方法の方が簡単かと思います。
参考サイトなど