-
-
Save mikemimik/5ac2fa98fe6d132098603c1bd40263d5 to your computer and use it in GitHub Desktop.
| import 'package:flutter/material.dart'; | |
| import 'theme.dart' as Theme; | |
| void main() { | |
| runApp( | |
| new MaterialApp( | |
| title: 'CompanyApp', | |
| color: Theme.CompanyColors.blue[500], | |
| theme: Theme.CompanyThemeData, | |
| home: new Scaffold( | |
| appBar: new AppBar( | |
| title: new Text('CompanyApp') | |
| ), | |
| body: new Center( | |
| child: new Container( | |
| child: new Text('CompanyApp') | |
| ) | |
| ), | |
| ) | |
| ) | |
| ); | |
| } |
| /** | |
| * Creating custom color palettes is part of creating a custom app. The idea is to create | |
| * your class of custom colors, in this case `CompanyColors` and then create a `ThemeData` | |
| * object with those colors you just defined. | |
| * | |
| * Resource: | |
| * A good resource would be this website: http://mcg.mbitson.com/ | |
| * You simply need to put in the colour you wish to use, and it will generate all shades | |
| * for you. Your primary colour will be the `500` value. | |
| * | |
| * Colour Creation: | |
| * In order to create the custom colours you need to create a `Map<int, Color>` object | |
| * which will have all the shade values. `const Color(0xFF...)` will be how you create | |
| * the colours. The six character hex code is what follows. If you wanted the colour | |
| * #114488 or #D39090 as primary colours in your theme, then you would have | |
| * `const Color(0x114488)` and `const Color(0xD39090)`, respectively. | |
| * | |
| * Usage: | |
| * In order to use this newly created theme or even the colours in it, you would just | |
| * `import` this file in your project, anywhere you needed it. | |
| * `import 'path/to/theme.dart';` | |
| */ | |
| import 'package:flutter/material.dart'; | |
| final ThemeData CompanyThemeData = new ThemeData( | |
| brightness: Brightness.light, | |
| primarySwatch: CompanyColors.blue, | |
| primaryColor: CompanyColors.blue[500], | |
| primaryColorBrightness: Brightness.light, | |
| accentColor: CompanyColors.green[500], | |
| accentColorBrightness: Brightness.light | |
| ); | |
| class CompanyColors { | |
| CompanyColors._(); // this basically makes it so you can instantiate this class | |
| static const Map<int, Color> blue = const <int, Color> { | |
| 50: const Color(/* some hex code */), | |
| 100: const Color(/* some hex code */), | |
| 200: const Color(/* some hex code */), | |
| 300: const Color(/* some hex code */), | |
| 400: const Color(/* some hex code */), | |
| 500: const Color(/* some hex code */), | |
| 600: const Color(/* some hex code */), | |
| 700: const Color(/* some hex code */), | |
| 800: const Color(/* some hex code */), | |
| 900: const Color(/* some hex code */) | |
| }; | |
| static const Map<int, Color> green = const <int, Color> { | |
| 50: const Color(/* some hex code */), | |
| 100: const Color(/* some hex code */), | |
| 200: const Color(/* some hex code */), | |
| 300: const Color(/* some hex code */), | |
| 400: const Color(/* some hex code */), | |
| 500: const Color(/* some hex code */), | |
| 600: const Color(/* some hex code */), | |
| 700: const Color(/* some hex code */), | |
| 800: const Color(/* some hex code */), | |
| 900: const Color(/* some hex code */) | |
| }; | |
| } |
I'm using this syntax:
static const _blackPrimaryValue = 0xFF000000;
static const MaterialColor black = const MaterialColor(
_blackPrimaryValue,
const <int, Color>{
50: const Color(0xFFe0e0e0),
100: const Color(0xFFb3b3b3),
200: const Color(0xFF808080),
300: const Color(0xFF4d4d4d),
400: const Color(0xFF262626),
500: const Color(_blackPrimaryValue),
600: const Color(0xFF000000),
700: const Color(0xFF000000),
800: const Color(0xFF000000),
900: const Color(0xFF000000),
},
);
Also getting the same error as dawidhyzy.
Also getting the same error as dawidhyzy.
I'm getting error that
primarySwatch: CompanyColors.blue,needs to be in MaterialColor type.
First day of Flutter, but I believe you could pass the following in:
primarySwatch: MaterialColor(CompanyColors.blue[50].value, CompanyColors.blue),
Instead of
primarySwatch: CompanyColors.blue,
Also getting the same error as dawidhyzy.
I'm getting error that
primarySwatch: CompanyColors.blue,needs to be in MaterialColor type.First day of Flutter, but I believe you could pass the following in:
primarySwatch: MaterialColor(CompanyColors.blue[50].value, CompanyColors.blue),
Instead of
primarySwatch: CompanyColors.blue,
You're a freaking rock star! Thanks
Good job, thank you man. May be you know how can use custom fonts like this colors?
I'm getting error that
primarySwatch: CompanyColors.blue,needs to be in MaterialColor type.