跳至主要內容
目錄

CupertinoTabBar 需要 Localizations 父元件

目錄

摘要

#

CupertinoTabBar 的實例必須有 Localizations 父元件，才能提供本地化的 Semantics 提示。嘗試在沒有本地化的情況下實例化 CupertinoTabBar 會導致類似以下的斷言：

CupertinoTabBar requires a Localizations parent in order to provide an appropriate Semantics hint
for tab indexing. A CupertinoApp provides the DefaultCupertinoLocalizations, or you can
instantiate your own Localizations.
'package:flutter/src/cupertino/bottom_tab_bar.dart':
Failed assertion: line 213 pos 7: 'localizations != null'

背景

#

為了支援本地化的語義資訊，CupertinoTabBar 需要本地化。

在此變更之前，提供給 CupertinoTabBar 的 Semantics 提示是一個硬編碼的字串「tab, $index of $total」。語義提示的內容也從原始字串更新為英文的「Tab $index of $total」。

如果您的 CupertinoTabBar 在 CupertinoApp 的範圍內，則 DefaultCupertinoLocalizations 已被實例化，並且可能適合您的需求，無需對現有程式碼進行更改。

如果您的 CupertinoTabBar 不在 CupertinoApp 內，您可以使用 Localizations widget 提供您選擇的本地化。

遷移指南

#

如果您看到 'localizations != null' 斷言錯誤，請確保您的 CupertinoTabBar 正在接收地區資訊。

遷移前的程式碼

dart
import 'package:flutter/cupertino.dart';

void main() => runApp(Foo());

class Foo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MediaQuery(
      data: const MediaQueryData(),
      child: CupertinoTabBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.add_circled),
            label: 'Tab 1',
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.add_circled_solid),
            label: 'Tab 2',
          ),
        ],
        currentIndex: 1,
      ),
    );
  }
}

遷移後的程式碼 (透過 CupertinoApp 提供本地化)

dart
import 'package:flutter/cupertino.dart';

void main() => runApp(Foo());

class Foo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoApp(
      home: CupertinoTabBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.add_circled),
            label: 'Tab 1',
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.add_circled_solid),
            label: 'Tab 2',
          ),
        ],
        currentIndex: 1,
      ),
    );
  }
}

遷移後的程式碼 (透過使用 Localizations widget 提供本地化)

dart
import 'package:flutter/cupertino.dart';

void main() => runApp(Foo());

class Foo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Localizations(
      locale: const Locale('en', 'US'),
      delegates: <LocalizationsDelegate<dynamic>>[
        DefaultWidgetsLocalizations.delegate,
        DefaultCupertinoLocalizations.delegate,
      ],
      child: MediaQuery(
        data: const MediaQueryData(),
        child: CupertinoTabBar(
          items: const <BottomNavigationBarItem>[
            BottomNavigationBarItem(
              icon: Icon(CupertinoIcons.add_circled),
              label: 'Tab 1',
            ),
            BottomNavigationBarItem(
              icon: Icon(CupertinoIcons.add_circled_solid),
              label: 'Tab 2',
            ),
          ],
          currentIndex: 1,
        ),
      ),
    );
  }
}

時間軸

#

於版本中發布: 1.18.0-9.0.pre
於穩定版本中: 1.20.0

參考資料

#

API 文件

相關的 PR

除非另有說明，否則本網站上的文件反映了 Flutter 的最新穩定版本。 頁面最後更新於 2024-04-04。 檢視原始碼 或 回報問題。