如何在 flutter 中覆蓋 MaterialApp 的主題

Question

我正在嘗試使用主題小部件來覆蓋特定容器的主題樣式。

在這里，我將所有文本小部件的正文文本顏色設置為白色。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        textTheme: TextTheme(
          bodyText2: TextStyle(
            color: Colors.white
          )
        )
      ),
      initialRoute: Home.id,
      routes: {
        Home.id: (context) => Home()
      },
    );
  }
}

現在我正在嘗試為此容器內的所有文本小部件設置黑色，但它仍在獲取 Material 應用小部件中設置的白色。

class NewTask extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return GestureDetector(
          onTap: (){
            Navigator.pop(context);
          },
          child: Theme(
            data: ThemeData(
                textTheme: TextTheme(
                    bodyText2: TextStyle(
                        color: Colors.black,
                    )
                )
            ),
            child: Container(
              child: Column(
                children: [
                  Text(
                    "New Task",
                  )
                ],
              ),
            ),
          )
        );
      }
    }

我能夠通過將 Container 小部件包裝在 Builder 方法中並設置來使其工作

TextStyle(
color: Theme.of(context).textTheme.bodyText2.color
),

但是，如果我在這個容器中有多個文本小部件，這似乎需要做很多工作，我不明白出了什么問題，或者這不是主題小部件的工作方式。

謝謝

Answer 1

來自包含給定上下文的最近主題實例的數據。

主題 class 文檔

當您調用Theme.of(context)時，您NewTask.build的上下文。 與此上下文關聯的Theme object 將是MaterialApp.theme 。 因此，要使用Theme小部件提供的ThemeData ，您可以使用Builder或將Theme及其后代提取到新的StatelessWidget或如果需要， StatefulWidget

Builder小部件本質上將其后代包裝在StatelessWidget中，並提供build方法作為回調。