lightTheme property
-------------------------- Light Theme -------------------------------------------- ///
Implementation
static ThemeData lightTheme = ThemeData(
/// Brightness
brightness: Brightness.light,
/// Primary Color
primaryColor: Color(0xff3C4EC5),
scaffoldBackgroundColor: Color(0xffffffff),
canvasColor: Colors.transparent,
/// AppBar Theme
appBarTheme: AppBarTheme(
backgroundColor: Color(0xffffffff),
iconTheme: IconThemeData(color: Color(0xff495057)),
actionsIconTheme: IconThemeData(color: Color(0xff495057))),
/// Card Theme
cardTheme: CardTheme(color: Color(0xfff0f0f0)),
cardColor: Color(0xfff0f0f0),
/// Floating Action Theme
floatingActionButtonTheme: FloatingActionButtonThemeData(
backgroundColor: Color(0xff3C4EC5),
splashColor: Color(0xffeeeeee).withAlpha(100),
highlightElevation: 8,
elevation: 4,
focusColor: Color(0xff3C4EC5),
hoverColor: Color(0xff3C4EC5),
foregroundColor: Color(0xffeeeeee)),
/// Divider Theme
dividerTheme: DividerThemeData(color: Color(0xffe8e8e8), thickness: 1),
dividerColor: Color(0xffe8e8e8),
/// Bottom AppBar Theme
bottomAppBarTheme:
BottomAppBarTheme(color: Color(0xffeeeeee), elevation: 2),
/// Tab bar Theme
tabBarTheme: TabBarTheme(
unselectedLabelColor: Color(0xff495057),
labelColor: Color(0xff3d63ff),
indicatorSize: TabBarIndicatorSize.label,
indicator: UnderlineTabIndicator(
borderSide: BorderSide(color: Color(0xff3d63ff), width: 2.0),
),
),
/// CheckBox theme
checkboxTheme: CheckboxThemeData(
checkColor: MaterialStateProperty.all(Color(0xffeeeeee)),
fillColor: MaterialStateProperty.all(Color(0xff3C4EC5)),
),
/// Radio theme
radioTheme: RadioThemeData(
fillColor: MaterialStateProperty.all(Color(0xff3C4EC5)),
),
///Switch Theme
switchTheme: SwitchThemeData(
trackColor: MaterialStateProperty.resolveWith((state) {
const Set<MaterialState> interactiveStates = <MaterialState>{
MaterialState.pressed,
MaterialState.hovered,
MaterialState.focused,
MaterialState.selected,
};
if (state.any(interactiveStates.contains)) {
return Color(0xffabb3ea);
}
return null;
}),
thumbColor: MaterialStateProperty.resolveWith((state) {
const Set<MaterialState> interactiveStates = <MaterialState>{
MaterialState.pressed,
MaterialState.hovered,
MaterialState.focused,
MaterialState.selected,
};
if (state.any(interactiveStates.contains)) {
return Color(0xff3C4EC5);
}
return null;
}),
),
/// Slider Theme
sliderTheme: SliderThemeData(
activeTrackColor: Color(0xff3d63ff),
inactiveTrackColor: Color(0xff3d63ff).withAlpha(140),
trackShape: RoundedRectSliderTrackShape(),
trackHeight: 4.0,
thumbColor: Color(0xff3d63ff),
thumbShape: RoundSliderThumbShape(enabledThumbRadius: 10.0),
overlayShape: RoundSliderOverlayShape(overlayRadius: 24.0),
tickMarkShape: RoundSliderTickMarkShape(),
inactiveTickMarkColor: Colors.red[100],
valueIndicatorShape: PaddleSliderValueIndicatorShape(),
valueIndicatorTextStyle: TextStyle(
color: Color(0xffeeeeee),
),
),
/// Other Colors
splashColor: Colors.white.withAlpha(100),
indicatorColor: Color(0xffeeeeee),
highlightColor: Color(0xffeeeeee), colorScheme: ColorScheme.fromSeed(
seedColor: Color(0xff3C4EC5), brightness: Brightness.light).copyWith(background: Color(0xffffffff)).copyWith(error: Color(0xfff0323c)),
);