本頭條核心宗旨
歡迎來到「技術剛剛好」作者，「技術剛剛好」是個人維護，每天至少更新一篇Flutter技術文章，實時為大家播報Flutter最新消息。如果你剛好也在關注Flutter這門技術，那就跟我一起學習進步吧，你的贊，收藏，轉發是對我個人最大的支持，維護不易，歡迎關注。
技術剛剛好經歷
近幾年，移動端跨平臺開發技術層出不窮，從Facebook家的ReactNative，到阿里家WEEX，前端技術在移動端跨平臺開發中大展身手，技術剛剛好作為一名Android開發，經歷了從Reactjs到Vuejs的不斷學習。而在2018年，我們的主角變成了Flutter，這是Goolge開源的一個移動端跨平臺解決方案，可以快速開發精美的移動App。希望跟大家一起學習，一起進步！
本文核心要點
Theme Widget可以為Material APP 定義主題數據（ThemeData），Material組件庫裡很多Widget都使用了主題數據，如導航欄顏色、標題字體、Icon樣式等。Theme內會使用InheritedWidget來為其子樹Widget共享樣式數據。
DEMO
main.dart文件解說
<code>import 'package:flutter/material.dart';void main() { runApp(MaterialApp( debugShowCheckedModeBanner: false, home: MyHome(), // Set the theme's primary color, accent color, //這段代碼是關鍵 theme: ThemeData( primarySwatch: Colors.green,//設置顏色 accentColor: Colors.lightGreenAccent,// // Set background color backgroundColor: Colors.black12, ), ));}class MyHome extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( // AppBar appBar: AppBar( // AppBar Title title: Text("Using Theme"), ), body: Container( // Another way to set the background color decoration: BoxDecoration(color: Colors.black87), child: Center( child: Container( // use the theme accent color as background color for this widget color: Theme.of(context).accentColor, child: Text( 'Hello World!', // Set text style as per theme style: Theme.of(context).textTheme.title, ), ), ), ), floatingActionButton: Theme( // override the accent color of theme for this widget only data: Theme.of(context).copyWith( colorScheme: Theme.of(context).colorScheme.copyWith(secondary: Colors.pinkAccent), ), child: FloatingActionButton( onPressed: null, child: Icon(Icons.add), ), ), ); }}/<code>
primarySwatch
flutter的主題（build下面的theme）中有個主題顏色（primarySwatch）：
目前的主題顏色(primarySwatch)只有下面幾個值可以選擇，其他的暫不支持:
red,
pink,
purple,
deepPurple,
indigo,
blue,
lightBlue,
cyan,
teal,
green,
lightGreen,
lime,
yellow,
amber,
orange,
deepOrange,
brown,
blueGrey,
如果我要把主題色改成白色，或者黑色的話，用上面的就會報錯啦，因為在primarySwatch中的顏色是調用 MaterialColor這種顏色類，內部會有一個主色，一個map存儲固定的幾種主色周邊的顏色。
primaryColor：如果要把頂部導航欄和狀態欄的顏色修改成黑色或者白色，需要用到這個屬性：
謝謝觀看技術剛剛好的文章，技術剛剛好是個人維護，每天至少更新一篇Flutter技術文章，實時為大家播報Flutter最新消息。如果你剛好也在關注Flutter這門技術，那就跟我一起學習進步吧，你的贊，收藏，轉發是對我個人最大的支持，維護不易，歡迎關注。