はじめに

Flutterのパッケージでtable_calendarというものを最近使ってアプリ開発をしているのですが、見た目のカスタマイズが複雑でやりにくい上に日本語の記事が少ないようなので、自分が実装するついでにやり方をまとめてみます。

実装前の画面と実装後の画面

実装前の画面です。
月と曜日の表示が英語になっているので、今回はそれを日本語で表示したいと思います。

実装後です。
月のところの表記と、曜日のところの表記が日本語になっていることがわかると思います。
それではやっていきましょう！！

ステップ１

まずはTableCalendar()の中でlocaleというものを指定してあげましょう。

TableCalendar(
    shouldFillViewport: true, //カレンダーの大きさを変えれるようにする奴、今回は気にしない
    locale: 'ja_JP' //　👈こちらの行を追加
),

これを指定してあげることで、ローカル、つまりどの言語を使用するか指定することができます。
しかし、Flutterが標準で用意してある、TableCalendar()には日本語対応されてないようなので、それを解決するために次のステップにいきましょう。

ステップ２

まずはpubspec.yamlファイルにintlというものを追加します。
これは、
メッセージの翻訳、複数形と性別、日付/番号のフォーマットと解析、双方向テキストなど、国際化とローカリゼーションの機能を提供します。 dart packages　より引用。
要はここでは言語対応させるために必要なパッケージです。

dependencies:
  flutter:
    sdk: flutter

  table_calendar: ^3.0.4
  intl: ^0.17.0 //この行を追加。インデントに注意してください。

intlのバージョンについてはこちらを確認して最新のものをお使いください。
そして追加したら、pubspec.yamlファイルの上にあるPub getボタンを押して読み込んであげてください。

ステップ３

main.dartファイルに記述を追加していきましょう。

import 'package:intl/date_symbol_data_local.dart'; //intlインポートする

void main() {
  //runApp(const MyApp());  
  initializeDateFormatting('ja').then((_) => runApp(MyApp())); //上の記述をこちらに変更します
}

自分はinitializeDateFormatting('ja')じゃなくて、initializeDateFormatting()という記述でも実装することができました。
正確には書いた方が良さそうなので書いときましょう。

これで完了です！！

最後に

intlパッケージを使うことで簡単にtable_calendarの表示を日本語に対応させることができました。