Flutterで MaterialApp
Widgetを使うと、 themes
でテーマを設定できます。
Widget build(BuildContext context) {
return new MaterialApp(
...
theme: new ThemeData(
cardColor: Colors.white,
primarySwatch: Colors.blue,
),
);
}
}
この色の指定をカスタムカラーで指定する方法です。
まず theme.dart
を作ります。
import 'package:flutter/material.dart';
final ThemeData themeData = new ThemeData(
brightness: Brightness.light,
cardColor: Colors.white,
dividerColor: Colors.grey[300],
backgroundColor: Colors.grey[100],
primarySwatch: CustomColors.theme[500],
primaryColor: CustomColors.theme[500],
primaryColorBrightness: Brightness.light,
accentColor: CustomColors.accent[500]);
class CustomColors {
CustomColors._(); // this basically makes it so you can instantiate this class
static const Map<int, Color> theme = const <int, Color>{
500: const Color(0xFFFBC812),
600: const Color(0xFFFEAD22),
};
static const Map<int, Color> accent = const <int, Color>{
500: const Color(0xFFF57C00),
};
}
この themeData
を指定するだけです。
import 'theme.dart';
...
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
...
theme: themeData,
);
}
}
以上。