Flutter: 標準テキストの色の指定方法(Theme.ofの指定方法)が分からない
結論:Theme.of(context).textTheme.bodyText1!.color
2022/5/2 Flutter エラー・バグ日記
「Theme.of(context).」を使って、標準テキストにデフォルトで設定されている色の指定方法が分からず、解決に苦労した(エラーやバグの話ではないが、備忘として記録)。
テーマの変更(「ThemeData」の「primarySwatch」や「brightness」の変更)に柔軟に対応するため、極力、文字やWidgetの色は、直接的に指定しないよう心がけている。
例えば、押せない状態のボタンのテキストに、「Colors.grey」を設定すると、ダークモードのときには別の色を設定する必要が出てくるが、「Theme.of(context).disabledColor」と設定しておけば、ダークモードのときには自動で反転した色を設定してくれる。
今回、ある条件を満たせば、テキストの表示色を「disabledColor」にし、満たさないときは標準テキストのデフォルト色のまま、となるよう設定しようとした。
しかし、「Theme.of(context).」と打って、コード補完機能で指定できる色を調べたところ、標準テキスト色を表すようなプロパティは見つけられなかった(プロパティの一覧は、こちらの公式ページに記載がある)。
「Theme.of(context).shadowColor」とすれば、黒文字にすることはできるが、ダークモードのときも黒文字になってしまう。。。
あまりニーズがないためか、日本語・英語で調べても情報が見つからない。
試行錯誤の末、いったん標準テキストのテーマを指定した上で、その「color」プロパティにアクセスする、という方法で実現できた。
具体的には、以下のとおり。
Theme.of(context).textTheme.bodyText1!.color
こちらの公式ページに、「TextTheme」クラスのプロパティ一覧が掲載されており、「bodyText1」が標準テキストのプロパティであることが分かる。
※こちらのMaterial Designの公式ページにある「Body 1」に相当すると思われる。
いったん「textTheme」を経由する方法は、フォントサイズなどにも応用できるので、活用しどころは他にもありそう。
\一般的なエラー対処法をまとめた記事はこちら/
リリースしたアプリ(全てFlutterで開発)
個人アプリ開発で役立ったもの
おすすめの学習教材
\超初心者向けでオススメな元Udemyの講座/
\キャンペーン時を狙えば安価で網羅的な内容が学べる(日本語訳あり)/
\Gitの基礎について無料で学べる/
おすすめの学習書籍
\実用的。image_pickerに関してかなり助けられた/
\Dartの基礎文法を素早くインプットできる/