Flutterに'Cannot mix 2018 and 2021 terms in call to TextTheme() constructor.'といわれた際の解決法

この記事は

Flutter開発時に発生した「なんぞ？」となったエラーとその対処のメモです。
たぶん将来的にも同じ問題を踏みそうなのでメモです。

発生したこと

やっていたこと

WidgetBook上でText()のデザインを組んでいたところ、flutterの描画エラーが出力された

エラー内容

エラー文言は"Cannot mix 2018 and 2021 terms in call to TextTheme() constructor."

調査内容

flutterコミュニティにて似たようなログをはっているIssueを発見
https://github.com/flutter/flutter/issues/51698

flutter apiドキュメントにてTextThemeの部分を確認
https://api.flutter.dev/flutter/material/TextTheme/TextTheme.html

assert(
       (displayLarge == null && displayMedium == null && displaySmall == null && headlineMedium == null &&
           headlineSmall == null && titleLarge == null && titleMedium == null && titleSmall == null &&
           bodyLarge == null && bodyMedium == null && bodySmall == null && labelLarge == null && labelSmall == null) ||
       (headline1 == null && headline2 == null && headline3 == null && headline4 == null &&
           headline5 == null && headline6 == null && subtitle1 == null && subtitle2 == null &&
           bodyText1 == null && bodyText2 == null && caption == null && button == null && overline == null),
       'Cannot mix 2018 and 2021 terms in call to TextTheme() constructor.'
     ),

エラーに書いてある通りなのね。
headlineX系の新しいシンボル名とbodyLarge系の古いシンボル名を混在して定義するなということらしい。

ということで自作のTextTheme定義を見に行く。

      textTheme: Typography.dense2018.copyWith(
        ...
        headline5: const TextStyle(
            fontFamily: 'Roboto',
            color: Color(0xff354052),
            fontSize: 18,
            fontWeight: FontWeight.bold),
        headline6: const TextStyle(
            fontFamily: 'Roboto',
            color: Color(0xff354052),
            fontSize: 16,
            fontWeight: FontWeight.bold),
        bodyLarge: const TextStyle(
            fontFamily: 'Roboto',
            color: Color(0xff354052),
            fontSize: 14,
            fontWeight: FontWeight.normal),
        bodyMedium: const TextStyle(
            fontFamily: 'Roboto',
            color: Color(0xff354052),
            fontSize: 12,
            fontWeight: FontWeight.normal),
        bodySmall: const TextStyle(
            fontFamily: 'Roboto',
            color: Color(0xff354052),
            fontSize: 9,
            fontWeight: FontWeight.normal),

やってましたね。手癖でbodyLargeとか書いたけど新旧体系をまぜるなということで。

対処法

体系を変更

• bodyLarge => Subtitle1
• bodyMedium => bodyText1
• bodySmall => bodyText2

無事エラー解消