CAKE-207 | changed Themes class; removed isDarkTheme from settings store and screens; added currentTheme to settings store; changed SwitcherListItem to PickerListItem for themes in the settings_view_model.dart; created item_from_theme.dart; changed currentDarkTheme property on currentTheme in the preferences_key.dart; applied themes to keyboard bar color in the exchange_page.dart, receive_page.dart, send_page.dart and send_template_page.dart; applied itemFromTheme() to new_wallet_page.dart, new_wallet_type_page.dart, pre_seed_page.dart, wallet_seed_page.dart, seed_language_page.dart, welcome_page.dart, base_page.dart and main.dart

This commit is contained in:
OleksandrSobol 2020-12-10 19:53:40 +02:00
parent c20d57e9a9
commit 3053c0f3fb
18 changed files with 575 additions and 432 deletions

View file

@ -0,0 +1,17 @@
import 'package:cake_wallet/themes.dart';
import 'package:flutter/material.dart';
dynamic itemFromTheme({
@required Themes currentTheme,
@required Map<Themes, dynamic> items}) {
switch (currentTheme) {
case Themes.light:
return items[Themes.light];
case Themes.bright:
return items[Themes.bright];
case Themes.dark:
return items[Themes.dark];
default:
return items[Themes.light];
}
}

View file

@ -9,7 +9,7 @@ class PreferencesKey {
static const shouldSaveRecipientAddressKey = 'save_recipient_address';
static const allowBiometricalAuthenticationKey =
'allow_biometrical_authentication';
static const currentDarkTheme = 'dark_theme';
static const currentTheme = 'current_theme';
static const displayActionListModeKey = 'display_list_mode';
static const currentPinLength = 'current_pin_length';
static const currentLanguageCode = 'language_code';

View file

@ -1,3 +1,5 @@
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:cake_wallet/themes.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:hive/hive.dart';
@ -123,16 +125,20 @@ class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
final settingsStore = getIt.get<AppStore>().settingsStore;
if (settingsStore.theme == null) {
settingsStore.isDarkTheme = false;
}
final currentTheme = settingsStore.currentTheme ?? Themes.light;
final Map<Themes, Brightness> items = {
Themes.light: Brightness.dark,
Themes.bright: Brightness.dark,
Themes.dark: Brightness.light
};
final statusBarColor = Colors.transparent;
final statusBarBrightness =
settingsStore.isDarkTheme ? Brightness.light : Brightness.dark;
itemFromTheme(currentTheme: currentTheme, items: items) as Brightness
?? Brightness.dark;
final statusBarIconBrightness =
settingsStore.isDarkTheme ? Brightness.light : Brightness.dark;
itemFromTheme(currentTheme: currentTheme, items: items) as Brightness
?? Brightness.dark;
final authenticationStore = getIt.get<AuthenticationStore>();
final initialRoute = authenticationStore.state == AuthenticationState.denied
? Routes.disclaimer

View file

@ -43,6 +43,7 @@ class Palette {
static const Color alizarinRed = Color.fromRGBO(233, 45, 45, 1.0);
static const Color moderateSlateBlue = Color.fromRGBO(129, 93, 251, 1.0);
static const Color brightOrange = Color.fromRGBO(255, 102, 0, 1.0);
static const Color dullGray = Color.fromRGBO(98, 98, 98, 1.0);
// FIXME: Rename.
static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);
@ -94,6 +95,7 @@ class PaletteDark {
static const Color deepVioletBlue = Color.fromRGBO(52, 66, 104, 1.0);
static const Color lightPurpleBlue = Color.fromRGBO(120, 133, 170, 1.0);
static const Color indicatorVioletBlue = Color.fromRGBO(59, 72, 119, 1.0);
static const Color granite = Color.fromRGBO(48, 51, 60, 1.0);
// FIXME: Rename.
static const Color eee = Color.fromRGBO(236, 239, 245, 1.0);

View file

@ -1,3 +1,5 @@
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:cake_wallet/themes.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/palette.dart';
@ -9,13 +11,19 @@ enum AppBarStyle { regular, withShadow, transparent }
abstract class BasePage extends StatelessWidget {
BasePage()
: _scaffoldKey = GlobalKey<ScaffoldState>(),
_closeButtonImage = Image.asset('assets/images/close_button.png'),
_closeButtonImageDarkTheme =
Image.asset('assets/images/close_button_dark_theme.png');
: _scaffoldKey = GlobalKey<ScaffoldState>();
final GlobalKey<ScaffoldState> _scaffoldKey;
final Image _closeButtonImage;
final Image _closeButtonImageDarkTheme;
static final Image closeButtonImage =
Image.asset('assets/images/close_button.png');
static final Image closeButtonImageDarkTheme =
Image.asset('assets/images/close_button_dark_theme.png');
final Map<Themes, Image> buttonItems = {
Themes.light: closeButtonImage,
Themes.bright: closeButtonImage,
Themes.dark: closeButtonImageDarkTheme
};
String get title => null;
@ -37,7 +45,7 @@ abstract class BasePage extends StatelessWidget {
Widget Function(BuildContext, Widget) get rootWrapper => null;
bool get isDarkTheme => getIt.get<SettingsStore>().isDarkTheme;
Themes get currentTheme => getIt.get<SettingsStore>().currentTheme;
void onOpenEndDrawer() => _scaffoldKey.currentState.openEndDrawer();
@ -52,7 +60,8 @@ abstract class BasePage extends StatelessWidget {
color: titleColor ?? Theme.of(context).primaryTextTheme.title.color,
size: 16,);
final _closeButton =
isDarkTheme ? _closeButtonImageDarkTheme : _closeButtonImage;
itemFromTheme(currentTheme: currentTheme, items: buttonItems) as Image
?? closeButtonImage;
return SizedBox(
height: 37,
@ -88,8 +97,7 @@ abstract class BasePage extends StatelessWidget {
Widget floatingActionButton(BuildContext context) => null;
ObstructingPreferredSizeWidget appBar(BuildContext context) {
final appBarColor =
isDarkTheme ? backgroundDarkColor : backgroundLightColor;
final appBarColor = _setBackgroundColor();
switch (appBarStyle) {
case AppBarStyle.regular:
@ -131,10 +139,11 @@ abstract class BasePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final _backgroundColor = _setBackgroundColor();
final root = Scaffold(
key: _scaffoldKey,
backgroundColor:
isDarkTheme ? backgroundDarkColor : backgroundLightColor,
backgroundColor: _backgroundColor,
resizeToAvoidBottomPadding: resizeToAvoidBottomPadding,
extendBodyBehindAppBar: extendBodyBehindAppBar,
endDrawer: endDrawer,
@ -144,4 +153,17 @@ abstract class BasePage extends StatelessWidget {
return rootWrapper?.call(context, root) ?? root;
}
Color _setBackgroundColor() {
switch (currentTheme) {
case Themes.light:
return backgroundLightColor;
case Themes.bright:
return backgroundLightColor;
case Themes.dark:
return backgroundDarkColor;
default:
return backgroundLightColor;
}
}
}

View file

@ -95,9 +95,8 @@ class ExchangePage extends BasePage {
return KeyboardActions(
config: KeyboardActionsConfig(
keyboardActionsPlatform: KeyboardActionsPlatform.IOS,
keyboardBarColor: isDarkTheme
? Color.fromRGBO(48, 51, 60, 1.0)
: Color.fromRGBO(98, 98, 98, 1.0),
keyboardBarColor: Theme.of(context).accentTextTheme.body2
.backgroundColor,
nextFocus: false,
actions: [
KeyboardActionsItem(

View file

@ -1,6 +1,4 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/routes.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:cake_wallet/utils/show_pop_up.dart';
import 'package:mobx/mobx.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
@ -16,23 +14,37 @@ import 'package:cake_wallet/src/screens/seed_language/widgets/seed_language_pick
import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
import 'package:cake_wallet/core/execution_state.dart';
import 'package:cake_wallet/view_model/wallet_new_vm.dart';
import 'package:cake_wallet/themes.dart';
import 'package:cake_wallet/entities/item_from_theme.dart';
class NewWalletPage extends BasePage {
NewWalletPage(this._walletNewVM);
final WalletNewVM _walletNewVM;
static final walletNameImage = Image.asset('assets/images/wallet_name.png');
static final walletNameLightImage =
Image.asset('assets/images/wallet_name_light.png');
final Map<Themes, Image> items = {
Themes.light: walletNameLightImage,
Themes.bright: walletNameLightImage,
Themes.dark: walletNameImage
};
@override
String get title => S.current.new_wallet;
@override
Widget body(BuildContext context) => WalletNameForm(_walletNewVM);
Widget body(BuildContext context) => WalletNameForm(_walletNewVM,
itemFromTheme(currentTheme: currentTheme, items: items) as Image
?? walletNameLightImage);
}
class WalletNameForm extends StatefulWidget {
WalletNameForm(this._walletNewVM);
WalletNameForm(this._walletNewVM, this.walletImage);
final WalletNewVM _walletNewVM;
final Image walletImage;
@override
_WalletNameFormState createState() => _WalletNameFormState(_walletNewVM);
@ -43,9 +55,6 @@ class _WalletNameFormState extends State<WalletNameForm> {
static const aspectRatioImage = 1.22;
final walletNameImage = Image.asset('assets/images/wallet_name.png');
final walletNameLightImage =
Image.asset('assets/images/wallet_name_light.png');
final _formKey = GlobalKey<FormState>();
final _languageSelectorKey = GlobalKey<SeedLanguageSelectorState>();
ReactionDisposer _stateReaction;
@ -78,10 +87,6 @@ class _WalletNameFormState extends State<WalletNameForm> {
@override
Widget build(BuildContext context) {
final walletImage = getIt.get<SettingsStore>().isDarkTheme
? walletNameImage
: walletNameLightImage;
return Container(
padding: EdgeInsets.only(top: 24),
child: ScrollableWithBottomSection(
@ -92,7 +97,7 @@ class _WalletNameFormState extends State<WalletNameForm> {
padding: EdgeInsets.only(left: 12, right: 12),
child: AspectRatio(
aspectRatio: aspectRatioImage,
child: FittedBox(child: walletImage, fit: BoxFit.fill)),
child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)),
),
Padding(
padding: EdgeInsets.only(top: 24),

View file

@ -1,6 +1,5 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:cake_wallet/entities/wallet_type.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:cake_wallet/generated/i18n.dart';
@ -8,6 +7,7 @@ import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
import 'package:cake_wallet/src/screens/new_wallet/widgets/select_button.dart';
import 'package:cake_wallet/themes.dart';
class NewWalletTypePage extends BasePage {
NewWalletTypePage({this.onTypeSelected, this.isNewWallet = true});
@ -15,6 +15,15 @@ class NewWalletTypePage extends BasePage {
final void Function(BuildContext, WalletType) onTypeSelected;
final bool isNewWallet;
static final walletTypeImage = Image.asset('assets/images/wallet_type.png');
static final walletTypeLightImage =
Image.asset('assets/images/wallet_type_light.png');
final Map<Themes, Image> items = {
Themes.light: walletTypeLightImage,
Themes.bright: walletTypeLightImage,
Themes.dark: walletTypeImage
};
@override
String get title => isNewWallet
? S.current.new_wallet
@ -22,13 +31,18 @@ class NewWalletTypePage extends BasePage {
@override
Widget body(BuildContext context) =>
WalletTypeForm(onTypeSelected: onTypeSelected);
WalletTypeForm(
onTypeSelected: onTypeSelected,
walletImage:
itemFromTheme(currentTheme: currentTheme, items: items) as Image
?? walletTypeLightImage);
}
class WalletTypeForm extends StatefulWidget {
WalletTypeForm({this.onTypeSelected});
WalletTypeForm({this.onTypeSelected, this.walletImage});
final void Function(BuildContext, WalletType) onTypeSelected;
final Image walletImage;
@override
WalletTypeFormState createState() => WalletTypeFormState();
@ -41,8 +55,6 @@ class WalletTypeFormState extends State<WalletTypeForm> {
Image.asset('assets/images/monero_logo.png', height: 24, width: 24);
final bitcoinIcon =
Image.asset('assets/images/bitcoin.png', height: 24, width: 24);
final walletTypeImage = Image.asset('assets/images/wallet_type.png');
final walletTypeLightImage = Image.asset('assets/images/wallet_type_light.png');
WalletType selected;
List<WalletType> types;
@ -55,9 +67,6 @@ class WalletTypeFormState extends State<WalletTypeForm> {
@override
Widget build(BuildContext context) {
final walletImage = getIt.get<SettingsStore>().isDarkTheme
? walletTypeImage : walletTypeLightImage;
return Container(
padding: EdgeInsets.only(top: 24),
child: ScrollableWithBottomSection(
@ -69,7 +78,7 @@ class WalletTypeFormState extends State<WalletTypeForm> {
padding: EdgeInsets.only(left: 12, right: 12),
child: AspectRatio(
aspectRatio: aspectRatioImage,
child: FittedBox(child: walletImage, fit: BoxFit.fill)),
child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)),
),
Padding(
padding: EdgeInsets.only(top: 48),

View file

@ -74,9 +74,8 @@ class ReceivePage extends BasePage {
return KeyboardActions(
config: KeyboardActionsConfig(
keyboardActionsPlatform: KeyboardActionsPlatform.IOS,
keyboardBarColor: isDarkTheme
? Color.fromRGBO(48, 51, 60, 1.0)
: Color.fromRGBO(98, 98, 98, 1.0),
keyboardBarColor: Theme.of(context).accentTextTheme.body2
.backgroundColor,
nextFocus: false,
actions: [
KeyboardActionsItem(

View file

@ -1,16 +1,22 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:cake_wallet/routes.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/themes.dart';
class PreSeedPage extends BasePage {
static final imageLight = Image.asset('assets/images/pre_seed_light.png');
static final imageDark = Image.asset('assets/images/pre_seed_dark.png');
final Map<Themes, Image> items = {
Themes.light: imageLight,
Themes.bright: imageLight,
Themes.dark: imageDark
};
@override
Widget leading(BuildContext context) => null;
@ -20,7 +26,8 @@ class PreSeedPage extends BasePage {
@override
Widget body(BuildContext context) {
final image =
getIt.get<SettingsStore>().isDarkTheme ? imageDark : imageLight;
itemFromTheme(currentTheme: currentTheme, items: items) as Image
?? imageLight;
return WillPopScope(
onWillPop: () async => false,

View file

@ -1,7 +1,6 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:cake_wallet/utils/show_bar.dart';
import 'package:cake_wallet/utils/show_pop_up.dart';
import 'package:flutter/cupertino.dart';
@ -13,12 +12,18 @@ import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/view_model/wallet_seed_view_model.dart';
import 'package:cake_wallet/themes.dart';
class WalletSeedPage extends BasePage {
WalletSeedPage(this.walletSeedViewModel, {@required this.isNewWalletCreated});
static final imageLight = Image.asset('assets/images/crypto_lock_light.png');
static final imageDark = Image.asset('assets/images/crypto_lock.png');
final Map<Themes, Image> items = {
Themes.light: imageLight,
Themes.bright: imageLight,
Themes.dark: imageDark
};
@override
String get title => S.current.seed_title;
@ -84,7 +89,8 @@ class WalletSeedPage extends BasePage {
@override
Widget body(BuildContext context) {
final image =
getIt.get<SettingsStore>().isDarkTheme ? imageDark : imageLight;
itemFromTheme(currentTheme: currentTheme, items: items) as Image
?? imageLight;
return WillPopScope(onWillPop: () async => false, child: Container(
padding: EdgeInsets.all(24),

View file

@ -1,6 +1,5 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:cake_wallet/src/widgets/seed_language_selector.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
@ -9,23 +8,39 @@ import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
import 'package:cake_wallet/src/screens/seed_language/widgets/seed_language_picker.dart';
import 'package:cake_wallet/themes.dart';
class SeedLanguage extends BasePage {
SeedLanguage({this.onConfirm});
final Function(BuildContext, String) onConfirm;
static final walletNameImage = Image.asset('assets/images/wallet_name.png');
static final walletNameLightImage =
Image.asset('assets/images/wallet_name_light.png');
final Map<Themes, Image> items = {
Themes.light: walletNameLightImage,
Themes.bright: walletNameLightImage,
Themes.dark: walletNameImage
};
@override
String get title => S.current.wallet_list_restore_wallet;
@override
Widget body(BuildContext context) => SeedLanguageForm(onConfirm: onConfirm);
Widget body(BuildContext context) =>
SeedLanguageForm(
onConfirm: onConfirm,
walletImage:
itemFromTheme(currentTheme: currentTheme, items: items) as Image
?? walletNameLightImage);
}
class SeedLanguageForm extends StatefulWidget {
SeedLanguageForm({this.onConfirm});
SeedLanguageForm({this.onConfirm, this.walletImage});
final Function(BuildContext, String) onConfirm;
final Image walletImage;
@override
SeedLanguageFormState createState() => SeedLanguageFormState();
@ -33,18 +48,10 @@ class SeedLanguageForm extends StatefulWidget {
class SeedLanguageFormState extends State<SeedLanguageForm> {
static const aspectRatioImage = 1.22;
final walletNameImage = Image.asset('assets/images/wallet_name.png');
final walletNameLightImage =
Image.asset('assets/images/wallet_name_light.png');
final _languageSelectorKey = GlobalKey<SeedLanguageSelectorState>();
@override
Widget build(BuildContext context) {
final walletImage = getIt.get<SettingsStore>().isDarkTheme
? walletNameImage
: walletNameLightImage;
return Container(
padding: EdgeInsets.only(top: 24),
child: ScrollableWithBottomSection(
@ -55,7 +62,8 @@ class SeedLanguageFormState extends State<SeedLanguageForm> {
padding: EdgeInsets.only(left: 12, right: 12),
child: AspectRatio(
aspectRatio: aspectRatioImage,
child: FittedBox(child: walletImage, fit: BoxFit.fill)),
child: FittedBox(child: widget.walletImage,
fit: BoxFit.fill)),
),
Padding(
padding: EdgeInsets.only(top: 40),

View file

@ -83,9 +83,8 @@ class SendPage extends BasePage {
return KeyboardActions(
config: KeyboardActionsConfig(
keyboardActionsPlatform: KeyboardActionsPlatform.IOS,
keyboardBarColor: isDarkTheme
? Color.fromRGBO(48, 51, 60, 1.0)
: Color.fromRGBO(98, 98, 98, 1.0),
keyboardBarColor: Theme.of(context).accentTextTheme.body2
.backgroundColor,
nextFocus: false,
actions: [
KeyboardActionsItem(

View file

@ -49,9 +49,8 @@ class SendTemplatePage extends BasePage {
return KeyboardActions(
config: KeyboardActionsConfig(
keyboardActionsPlatform: KeyboardActionsPlatform.IOS,
keyboardBarColor: isDarkTheme
? Color.fromRGBO(48, 51, 60, 1.0)
: Color.fromRGBO(98, 98, 98, 1.0),
keyboardBarColor: Theme.of(context).accentTextTheme.body2
.backgroundColor,
nextFocus: false,
actions: [
KeyboardActionsItem(

View file

@ -1,15 +1,21 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:cake_wallet/entities/item_from_theme.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/routes.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/themes.dart';
class WelcomePage extends BasePage {
static const aspectRatioImage = 1.25;
final welcomeImageLight = Image.asset('assets/images/welcome_light.png');
final welcomeImageDark = Image.asset('assets/images/welcome.png');
static final welcomeImageLight = Image.asset('assets/images/welcome_light.png');
static final welcomeImageDark = Image.asset('assets/images/welcome.png');
final Map<Themes, Image> items = {
Themes.light: welcomeImageLight,
Themes.bright: welcomeImageLight,
Themes.dark: welcomeImageDark
};
@override
Widget build(BuildContext context) {
@ -23,10 +29,9 @@ class WelcomePage extends BasePage {
@override
Widget body(BuildContext context) {
final welcomeImage = getIt
.get<SettingsStore>()
.isDarkTheme
? welcomeImageDark : welcomeImageLight;
final welcomeImage =
itemFromTheme(currentTheme: currentTheme, items: items) as Image
?? welcomeImageLight;
final newWalletImage = Image.asset('assets/images/new_wallet.png',
height: 12,

View file

@ -28,7 +28,7 @@ abstract class SettingsStoreBase with Store {
@required BalanceDisplayMode initialBalanceDisplayMode,
@required bool initialSaveRecipientAddress,
@required bool initialAllowBiometricalAuthentication,
@required bool initialDarkTheme,
@required Themes initialTheme,
@required int initialPinLength,
@required String initialLanguageCode,
// @required String initialCurrentLocale,
@ -40,7 +40,7 @@ abstract class SettingsStoreBase with Store {
balanceDisplayMode = initialBalanceDisplayMode;
shouldSaveRecipientAddress = initialSaveRecipientAddress;
allowBiometricalAuthentication = initialAllowBiometricalAuthentication;
isDarkTheme = initialDarkTheme;
currentTheme = initialTheme;
pinCodeLength = initialPinLength;
languageCode = initialLanguageCode;
currentNode = nodes[WalletType.monero];
@ -65,9 +65,9 @@ abstract class SettingsStoreBase with Store {
shouldSaveRecipientAddress));
reaction(
(_) => isDarkTheme,
(bool isDarkTheme) => sharedPreferences.setBool(
PreferencesKey.currentDarkTheme, isDarkTheme));
(_) => currentTheme,
(Themes theme) => sharedPreferences.setInt(
PreferencesKey.currentTheme, theme.serialize()));
reaction(
(_) => allowBiometricalAuthentication,
@ -111,7 +111,7 @@ abstract class SettingsStoreBase with Store {
bool allowBiometricalAuthentication;
@observable
bool isDarkTheme;
Themes currentTheme;
@observable
int pinCodeLength;
@ -120,7 +120,7 @@ abstract class SettingsStoreBase with Store {
Node currentNode;
@computed
ThemeData get theme => isDarkTheme ? Themes.darkTheme : Themes.lightTheme;
ThemeData get theme => currentTheme.themeData;
@observable
String languageCode;
@ -154,8 +154,8 @@ abstract class SettingsStoreBase with Store {
final allowBiometricalAuthentication = sharedPreferences
.getBool(PreferencesKey.allowBiometricalAuthenticationKey) ??
false;
final savedDarkTheme =
sharedPreferences.getBool(PreferencesKey.currentDarkTheme) ?? false;
final savedTheme = Themes.deserialize(
raw: sharedPreferences.getInt(PreferencesKey.currentTheme) ?? 0);
final actionListDisplayMode = ObservableList<ActionListDisplayMode>();
actionListDisplayMode.addAll(deserializeActionlistDisplayModes(
sharedPreferences.getInt(PreferencesKey.displayActionListModeKey) ??
@ -188,7 +188,7 @@ abstract class SettingsStoreBase with Store {
initialBalanceDisplayMode: currentBalanceDisplayMode,
initialSaveRecipientAddress: shouldSaveRecipientAddress,
initialAllowBiometricalAuthentication: allowBiometricalAuthentication,
initialDarkTheme: savedDarkTheme,
initialTheme: savedTheme,
actionlistDisplayMode: actionListDisplayMode,
initialPinLength: pinLength,
initialLanguageCode: savedLanguageCode);

View file

@ -1,353 +1,408 @@
import 'package:flutter/material.dart';
import 'palette.dart';
import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/entities/enumerable_item.dart';
class Themes {
class Themes extends EnumerableItem<int> with Serializable<int> {
const Themes({String title, int raw})
: super(title: title, raw: raw);
static const all = [
Themes.light,
Themes.bright,
Themes.dark,
];
static const light = Themes(title: 'Light', raw: 0);
static const bright = Themes(title: 'Bright', raw: 1);
static const dark = Themes(title: 'Dark', raw: 2);
static Themes deserialize({int raw}) {
switch (raw) {
case 0:
return light;
case 1:
return bright;
case 2:
return dark;
default:
return null;
}
}
ThemeData get themeData {
switch (this) {
case Themes.light:
return lightTheme;
case Themes.bright:
return lightTheme;
case Themes.dark:
return darkTheme;
default:
return null;
}
}
@override
String toString() {
switch (this) {
case Themes.light:
return 'Light';
case Themes.bright:
return 'Bright';
case Themes.dark:
return 'Dark';
default:
return '';
}
}
static final ThemeData lightTheme = ThemeData(
fontFamily: 'Lato',
brightness: Brightness.light,
backgroundColor: Colors.white,
accentColor: Palette.blueCraiola, // first gradient color
scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color
primaryColor: Palette.redHat, // third gradient color
buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page
indicatorColor: Colors.white.withOpacity(0.5), // page indicator
hoverColor: Colors.white, // amount hint text (receive page)
dividerColor: Palette.paleBlue,
hintColor: Palette.gray,
textTheme: TextTheme(
title: TextStyle(
color: Colors.white, // sync_indicator text
backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator
decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator
fontFamily: 'Lato',
brightness: Brightness.light,
backgroundColor: Colors.white,
accentColor: Palette.blueCraiola, // first gradient color
scaffoldBackgroundColor: Palette.pinkFlamingo, // second gradient color
primaryColor: Palette.redHat, // third gradient color
buttonColor: Colors.white.withOpacity(0.2), // action buttons on dashboard page
indicatorColor: Colors.white.withOpacity(0.5), // page indicator
hoverColor: Colors.white, // amount hint text (receive page)
dividerColor: Palette.paleBlue,
hintColor: Palette.gray,
textTheme: TextTheme(
title: TextStyle(
color: Colors.white, // sync_indicator text
backgroundColor: Colors.white.withOpacity(0.2), // synced sync_indicator
decorationColor: Colors.white.withOpacity(0.15), // not synced sync_indicator
),
caption: TextStyle(
color: Palette.shineOrange, // not synced light
decorationColor: Colors.white, // filter icon
),
overline: TextStyle(
color: Colors.white.withOpacity(0.2), // filter button
backgroundColor: Colors.white.withOpacity(0.5), // date section row
decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows)
),
subhead: TextStyle(
color: Colors.white.withOpacity(0.2), // address button border
decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget)
),
headline: TextStyle(
color: Colors.white, // qr code
decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page)
),
display1: TextStyle(
color: PaletteDark.lightBlueGrey, // icons color (receive page)
decorationColor: Palette.lavender, // icons background (receive page)
),
display2: TextStyle(
color: Palette.darkBlueCraiola, // text color of tiles (receive page)
decorationColor: Colors.white // background of tiles (receive page)
),
display3: TextStyle(
color: Colors.white, // text color of current tile (receive page),
//decorationColor: Palette.blueCraiola // background of current tile (receive page)
decorationColor: Palette.moderateSlateBlue // background of current tile (receive page)
),
display4: TextStyle(
color: Palette.violetBlue, // text color of tiles (account list)
decorationColor: Colors.white // background of tiles (account list)
),
subtitle: TextStyle(
color: Palette.moderateSlateBlue, // text color of current tile (account list)
decorationColor: Colors.white // background of current tile (account list)
),
body1: TextStyle(
color: Palette.moderatePurpleBlue, // scrollbar thumb
decorationColor: Palette.periwinkleCraiola // scrollbar background
),
body2: TextStyle(
color: Palette.moderateLavender, // menu header
decorationColor: Colors.white, // menu background
)
),
caption: TextStyle(
color: Palette.shineOrange, // not synced light
decorationColor: Colors.white, // filter icon
primaryTextTheme: TextTheme(
title: TextStyle(
color: Palette.darkBlueCraiola, // title color
backgroundColor: Palette.wildPeriwinkle // textfield underline
),
caption: TextStyle(
color: PaletteDark.pigeonBlue, // secondary text
decorationColor: Palette.wildLavender // menu divider
),
overline: TextStyle(
color: Palette.darkGray, // transaction/trade details titles
decorationColor: Colors.white.withOpacity(0.5), // placeholder
),
subhead: TextStyle(
color: Palette.blueCraiola, // first gradient color (send page)
decorationColor: Palette.pinkFlamingo // second gradient color (send page)
),
headline: TextStyle(
color: Colors.white.withOpacity(0.5), // text field border color (send page)
decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page)
),
display1: TextStyle(
color: Colors.white.withOpacity(0.2), // text field button color (send page)
decorationColor: Colors.white // text field button icon color (send page)
),
display2: TextStyle(
color: Colors.white.withOpacity(0.5), // estimated fee (send page)
decorationColor: Palette.shadowWhite // template dotted border (send page)
),
display3: TextStyle(
color: Palette.darkBlueCraiola, // template new text (send page)
decorationColor: Palette.shadowWhite // template background color (send page)
),
display4: TextStyle(
color: Palette.darkBlueCraiola, // template title (send page)
decorationColor: Palette.niagara // receive amount text (exchange page)
),
subtitle: TextStyle(
color: Palette.blueCraiola, // first gradient color top panel (exchange page)
decorationColor: Palette.pinkFlamingo // second gradient color top panel (exchange page)
),
body1: TextStyle(
color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page)
decorationColor: Palette.pinkFlamingo.withOpacity(0.7) // second gradient color bottom panel (exchange page)
),
body2: TextStyle(
color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page)
decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page)
)
),
overline: TextStyle(
color: Colors.white.withOpacity(0.2), // filter button
backgroundColor: Colors.white.withOpacity(0.5), // date section row
decorationColor: Colors.white.withOpacity(0.2) // icons (transaction and trade rows)
focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page)
accentTextTheme: TextTheme(
title: TextStyle(
color: Colors.white, // picker background
backgroundColor: Palette.periwinkleCraiola, // picker divider
decorationColor: Colors.white // dialog background
),
caption: TextStyle(
color: Palette.moderateLavender, // container (confirm exchange)
backgroundColor: Palette.moderateLavender, // button background (confirm exchange)
decorationColor: Palette.darkBlueCraiola, // text color (information page)
),
subtitle: TextStyle(
color: Palette.darkBlueCraiola, // QR code (exchange trade page)
backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page)
//decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page)
decorationColor: Palette.moderateSlateBlue // crete new wallet button background (wallet list page)
),
headline: TextStyle(
color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page)
backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page)
decorationColor: Colors.white // restore wallet button text color (wallet list page)
),
subhead: TextStyle(
color: Palette.darkGray, // titles color (filter widget)
backgroundColor: Palette.periwinkle, // divider color (filter widget)
decorationColor: Colors.white // checkbox background (filter widget)
),
overline: TextStyle(
color: Palette.wildPeriwinkle, // checkbox bounds (filter widget)
decorationColor: Colors.white, // menu subname
),
display1: TextStyle(
color: Palette.blueCraiola, // first gradient color (menu header)
decorationColor: Palette.pinkFlamingo // second gradient color(menu header)
),
display2: TextStyle(
color: Palette.shadowWhite, // action button color (address text field)
decorationColor: Palette.darkGray // hint text (seed widget)
),
display3: TextStyle(
color: Palette.darkGray, // hint text (new wallet page)
decorationColor: Palette.periwinkleCraiola // underline (new wallet page)
),
display4: TextStyle(
color: Palette.darkGray, // switch background (settings page)
),
body1: TextStyle(
color: Palette.darkGray, // indicators (PIN code)
decorationColor: Palette.darkGray // switch (PIN code)
),
body2: TextStyle(
color: Palette.moderateSlateBlue, // primary buttons, alert right buttons
decorationColor: Palette.brightOrange, // alert left button,
backgroundColor: Palette.dullGray // keyboard bar color
),
),
subhead: TextStyle(
color: Colors.white.withOpacity(0.2), // address button border
decorationColor: Colors.white.withOpacity(0.4), // copy button (qr widget)
),
headline: TextStyle(
color: Colors.white, // qr code
decorationColor: Colors.white.withOpacity(0.5), // bottom border of amount (receive page)
),
display1: TextStyle(
color: PaletteDark.lightBlueGrey, // icons color (receive page)
decorationColor: Palette.lavender, // icons background (receive page)
),
display2: TextStyle(
color: Palette.darkBlueCraiola, // text color of tiles (receive page)
decorationColor: Colors.white // background of tiles (receive page)
),
display3: TextStyle(
color: Colors.white, // text color of current tile (receive page),
//decorationColor: Palette.blueCraiola // background of current tile (receive page)
decorationColor: Palette.moderateSlateBlue // background of current tile (receive page)
),
display4: TextStyle(
color: Palette.violetBlue, // text color of tiles (account list)
decorationColor: Colors.white // background of tiles (account list)
),
subtitle: TextStyle(
color: Palette.moderateSlateBlue, // text color of current tile (account list)
decorationColor: Colors.white // background of current tile (account list)
),
body1: TextStyle(
color: Palette.moderatePurpleBlue, // scrollbar thumb
decorationColor: Palette.periwinkleCraiola // scrollbar background
),
body2: TextStyle(
color: Palette.moderateLavender, // menu header
decorationColor: Colors.white, // menu background
)
),
primaryTextTheme: TextTheme(
title: TextStyle(
color: Palette.darkBlueCraiola, // title color
backgroundColor: Palette.wildPeriwinkle // textfield underline
),
caption: TextStyle(
color: PaletteDark.pigeonBlue, // secondary text
decorationColor: Palette.wildLavender // menu divider
),
overline: TextStyle(
color: Palette.darkGray, // transaction/trade details titles
decorationColor: Colors.white.withOpacity(0.5), // placeholder
),
subhead: TextStyle(
color: Palette.blueCraiola, // first gradient color (send page)
decorationColor: Palette.pinkFlamingo // second gradient color (send page)
),
headline: TextStyle(
color: Colors.white.withOpacity(0.5), // text field border color (send page)
decorationColor: Colors.white.withOpacity(0.5), // text field hint color (send page)
),
display1: TextStyle(
color: Colors.white.withOpacity(0.2), // text field button color (send page)
decorationColor: Colors.white // text field button icon color (send page)
),
display2: TextStyle(
color: Colors.white.withOpacity(0.5), // estimated fee (send page)
decorationColor: Palette.shadowWhite // template dotted border (send page)
),
display3: TextStyle(
color: Palette.darkBlueCraiola, // template new text (send page)
decorationColor: Palette.shadowWhite // template background color (send page)
),
display4: TextStyle(
color: Palette.darkBlueCraiola, // template title (send page)
decorationColor: Palette.niagara // receive amount text (exchange page)
),
subtitle: TextStyle(
color: Palette.blueCraiola, // first gradient color top panel (exchange page)
decorationColor: Palette.pinkFlamingo // second gradient color top panel (exchange page)
),
body1: TextStyle(
color: Palette.blueCraiola.withOpacity(0.7), // first gradient color bottom panel (exchange page)
decorationColor: Palette.pinkFlamingo.withOpacity(0.7) // second gradient color bottom panel (exchange page)
),
body2: TextStyle(
color: Colors.white.withOpacity(0.5), // text field border on top panel (exchange page)
decorationColor: Colors.white.withOpacity(0.5), // text field border on bottom panel (exchange page)
)
),
focusColor: Colors.white.withOpacity(0.2), // text field button (exchange page)
accentTextTheme: TextTheme(
title: TextStyle(
color: Colors.white, // picker background
backgroundColor: Palette.periwinkleCraiola, // picker divider
decorationColor: Colors.white // dialog background
),
caption: TextStyle(
color: Palette.moderateLavender, // container (confirm exchange)
backgroundColor: Palette.moderateLavender, // button background (confirm exchange)
decorationColor: Palette.darkBlueCraiola, // text color (information page)
),
subtitle: TextStyle(
color: Palette.darkBlueCraiola, // QR code (exchange trade page)
backgroundColor: Palette.wildPeriwinkle, // divider (exchange trade page)
//decorationColor: Palette.blueCraiola // crete new wallet button background (wallet list page)
decorationColor: Palette.moderateSlateBlue // crete new wallet button background (wallet list page)
),
headline: TextStyle(
color: Palette.moderateLavender, // first gradient color of wallet action buttons (wallet list page)
backgroundColor: Palette.moderateLavender, // second gradient color of wallet action buttons (wallet list page)
decorationColor: Colors.white // restore wallet button text color (wallet list page)
),
subhead: TextStyle(
color: Palette.darkGray, // titles color (filter widget)
backgroundColor: Palette.periwinkle, // divider color (filter widget)
decorationColor: Colors.white // checkbox background (filter widget)
),
overline: TextStyle(
color: Palette.wildPeriwinkle, // checkbox bounds (filter widget)
decorationColor: Colors.white, // menu subname
),
display1: TextStyle(
color: Palette.blueCraiola, // first gradient color (menu header)
decorationColor: Palette.pinkFlamingo // second gradient color(menu header)
),
display2: TextStyle(
color: Palette.shadowWhite, // action button color (address text field)
decorationColor: Palette.darkGray // hint text (seed widget)
),
display3: TextStyle(
color: Palette.darkGray, // hint text (new wallet page)
decorationColor: Palette.periwinkleCraiola // underline (new wallet page)
),
display4: TextStyle(
color: Palette.darkGray, // switch background (settings page)
),
body1: TextStyle(
color: Palette.darkGray, // indicators (PIN code)
decorationColor: Palette.darkGray // switch (PIN code)
),
body2: TextStyle(
color: Palette.moderateSlateBlue, // primary buttons, alert right buttons
decorationColor: Palette.brightOrange // alert left button
),
),
cardColor: Palette.moderateSlateBlue // bottom button (action list)
cardColor: Palette.moderateSlateBlue // bottom button (action list)
);
static final ThemeData darkTheme = ThemeData(
fontFamily: 'Lato',
brightness: Brightness.dark,
backgroundColor: PaletteDark.backgroundColor,
accentColor: PaletteDark.backgroundColor, // first gradient color
scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color
primaryColor: PaletteDark.backgroundColor, // third gradient color
buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page
indicatorColor: PaletteDark.cyanBlue, // page indicator
hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page)
dividerColor: PaletteDark.dividerColor,
hintColor: PaletteDark.pigeonBlue, // menu
textTheme: TextTheme(
title: TextStyle(
color: PaletteDark.wildBlue, // sync_indicator text
backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator
decorationColor: PaletteDark.oceanBlue // not synced sync_indicator
fontFamily: 'Lato',
brightness: Brightness.dark,
backgroundColor: PaletteDark.backgroundColor,
accentColor: PaletteDark.backgroundColor, // first gradient color
scaffoldBackgroundColor: PaletteDark.backgroundColor, // second gradient color
primaryColor: PaletteDark.backgroundColor, // third gradient color
buttonColor: PaletteDark.nightBlue, // action buttons on dashboard page
indicatorColor: PaletteDark.cyanBlue, // page indicator
hoverColor: PaletteDark.cyanBlue, // amount hint text (receive page)
dividerColor: PaletteDark.dividerColor,
hintColor: PaletteDark.pigeonBlue, // menu
textTheme: TextTheme(
title: TextStyle(
color: PaletteDark.wildBlue, // sync_indicator text
backgroundColor: PaletteDark.lightNightBlue, // synced sync_indicator
decorationColor: PaletteDark.oceanBlue // not synced sync_indicator
),
caption: TextStyle(
color: PaletteDark.orangeYellow, // not synced light
decorationColor: PaletteDark.wildBlue, // filter icon
),
overline: TextStyle(
color: PaletteDark.oceanBlue, // filter button
backgroundColor: PaletteDark.darkCyanBlue, // date section row
decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows)
),
subhead: TextStyle(
color: PaletteDark.nightBlue, // address button border
decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget)
),
headline: TextStyle(
color: PaletteDark.lightBlueGrey, // qr code
decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page)
),
display1: TextStyle(
color: Colors.white, // icons color (receive page)
decorationColor: PaletteDark.distantNightBlue, // icons background (receive page)
),
display2: TextStyle(
color: Colors.white, // text color of tiles (receive page)
decorationColor: PaletteDark.nightBlue // background of tiles (receive page)
),
display3: TextStyle(
color: Palette.blueCraiola, // text color of current tile (receive page)
decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page)
),
display4: TextStyle(
color: Colors.white, // text color of tiles (account list)
decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list)
),
subtitle: TextStyle(
color: Palette.blueCraiola, // text color of current tile (account list)
decorationColor: PaletteDark.darkNightBlue // background of current tile (account list)
),
body1: TextStyle(
color: PaletteDark.wildBlueGrey, // scrollbar thumb
decorationColor: PaletteDark.violetBlue // scrollbar background
),
body2: TextStyle(
color: PaletteDark.deepPurpleBlue, // menu header
decorationColor: PaletteDark.deepPurpleBlue, // menu background
)
),
caption: TextStyle(
color: PaletteDark.orangeYellow, // not synced light
decorationColor: PaletteDark.wildBlue, // filter icon
primaryTextTheme: TextTheme(
title: TextStyle(
color: Colors.white, // title color
backgroundColor: PaletteDark.darkOceanBlue // textfield underline
),
caption: TextStyle(
color: PaletteDark.darkCyanBlue, // secondary text
decorationColor: PaletteDark.darkOceanBlue // menu divider
),
overline: TextStyle(
color: PaletteDark.lightBlueGrey, // transaction/trade details titles
decorationColor: Colors.grey, // placeholder
),
subhead: TextStyle(
color: PaletteDark.darkNightBlue, // first gradient color (send page)
decorationColor: PaletteDark.darkNightBlue // second gradient color (send page)
),
headline: TextStyle(
color: PaletteDark.lightVioletBlue, // text field border color (send page)
decorationColor: PaletteDark.darkCyanBlue, // text field hint color (send page)
),
display1: TextStyle(
color: PaletteDark.buttonNightBlue, // text field button color (send page)
decorationColor: PaletteDark.gray // text field button icon color (send page)
),
display2: TextStyle(
color: Colors.white, // estimated fee (send page)
decorationColor: PaletteDark.darkCyanBlue // template dotted border (send page)
),
display3: TextStyle(
color: PaletteDark.darkCyanBlue, // template new text (send page)
decorationColor: PaletteDark.darkVioletBlue // template background color (send page)
),
display4: TextStyle(
color: PaletteDark.cyanBlue, // template title (send page)
decorationColor: PaletteDark.darkCyanBlue // receive amount text (exchange page)
),
subtitle: TextStyle(
color: PaletteDark.wildVioletBlue, // first gradient color top panel (exchange page)
decorationColor: PaletteDark.wildVioletBlue // second gradient color top panel (exchange page)
),
body1: TextStyle(
color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page)
decorationColor: PaletteDark.darkNightBlue // second gradient color bottom panel (exchange page)
),
body2: TextStyle(
color: PaletteDark.blueGrey, // text field border on top panel (exchange page)
decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page)
)
),
overline: TextStyle(
color: PaletteDark.oceanBlue, // filter button
backgroundColor: PaletteDark.darkCyanBlue, // date section row
decorationColor: PaletteDark.wildNightBlue // icons (transaction and trade rows)
focusColor: PaletteDark.moderateBlue, // text field button (exchange page)
accentTextTheme: TextTheme(
title: TextStyle(
color: PaletteDark.nightBlue, // picker background
backgroundColor: PaletteDark.dividerColor, // picker divider
decorationColor: PaletteDark.darkNightBlue // dialog background
),
caption: TextStyle(
color: PaletteDark.nightBlue, // container (confirm exchange)
backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange)
decorationColor: Palette.darkLavender, // text color (information page)
),
subtitle: TextStyle(
//color: PaletteDark.lightBlueGrey, // QR code (exchange trade page)
color: Colors.white, // QR code (exchange trade page)
backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page)
decorationColor: Colors.white // crete new wallet button background (wallet list page)
),
headline: TextStyle(
color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page)
backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page)
decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page)
),
subhead: TextStyle(
color: Colors.white, // titles color (filter widget)
backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget)
decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget)
),
overline: TextStyle(
color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget)
decorationColor: PaletteDark.darkCyanBlue, // menu subname
),
display1: TextStyle(
color: PaletteDark.deepPurpleBlue, // first gradient color (menu header)
decorationColor: PaletteDark.deepPurpleBlue // second gradient color(menu header)
),
display2: TextStyle(
color: PaletteDark.nightBlue, // action button color (address text field)
decorationColor: PaletteDark.darkCyanBlue // hint text (seed widget)
),
display3: TextStyle(
color: PaletteDark.cyanBlue, // hint text (new wallet page)
decorationColor: PaletteDark.darkGrey // underline (new wallet page)
),
display4: TextStyle(
color: PaletteDark.deepVioletBlue, // switch background (settings page)
),
body1: TextStyle(
color: PaletteDark.indicatorVioletBlue, // indicators (PIN code)
decorationColor: PaletteDark.lightPurpleBlue // switch (PIN code)
),
body2: TextStyle(
color: Palette.blueCraiola, // primary buttons, alert right buttons
decorationColor: Palette.alizarinRed, // alert left button
backgroundColor: PaletteDark.granite // keyboard bar color
),
),
subhead: TextStyle(
color: PaletteDark.nightBlue, // address button border
decorationColor: PaletteDark.lightBlueGrey, // copy button (qr widget)
),
headline: TextStyle(
color: PaletteDark.lightBlueGrey, // qr code
decorationColor: PaletteDark.darkGrey, // bottom border of amount (receive page)
),
display1: TextStyle(
color: Colors.white, // icons color (receive page)
decorationColor: PaletteDark.distantNightBlue, // icons background (receive page)
),
display2: TextStyle(
color: Colors.white, // text color of tiles (receive page)
decorationColor: PaletteDark.nightBlue // background of tiles (receive page)
),
display3: TextStyle(
color: Palette.blueCraiola, // text color of current tile (receive page)
decorationColor: PaletteDark.lightOceanBlue // background of current tile (receive page)
),
display4: TextStyle(
color: Colors.white, // text color of tiles (account list)
decorationColor: PaletteDark.darkOceanBlue // background of tiles (account list)
),
subtitle: TextStyle(
color: Palette.blueCraiola, // text color of current tile (account list)
decorationColor: PaletteDark.darkNightBlue // background of current tile (account list)
),
body1: TextStyle(
color: PaletteDark.wildBlueGrey, // scrollbar thumb
decorationColor: PaletteDark.violetBlue // scrollbar background
),
body2: TextStyle(
color: PaletteDark.deepPurpleBlue, // menu header
decorationColor: PaletteDark.deepPurpleBlue, // menu background
)
),
primaryTextTheme: TextTheme(
title: TextStyle(
color: Colors.white, // title color
backgroundColor: PaletteDark.darkOceanBlue // textfield underline
),
caption: TextStyle(
color: PaletteDark.darkCyanBlue, // secondary text
decorationColor: PaletteDark.darkOceanBlue // menu divider
),
overline: TextStyle(
color: PaletteDark.lightBlueGrey, // transaction/trade details titles
decorationColor: Colors.grey, // placeholder
),
subhead: TextStyle(
color: PaletteDark.darkNightBlue, // first gradient color (send page)
decorationColor: PaletteDark.darkNightBlue // second gradient color (send page)
),
headline: TextStyle(
color: PaletteDark.lightVioletBlue, // text field border color (send page)
decorationColor: PaletteDark.darkCyanBlue, // text field hint color (send page)
),
display1: TextStyle(
color: PaletteDark.buttonNightBlue, // text field button color (send page)
decorationColor: PaletteDark.gray // text field button icon color (send page)
),
display2: TextStyle(
color: Colors.white, // estimated fee (send page)
decorationColor: PaletteDark.darkCyanBlue // template dotted border (send page)
),
display3: TextStyle(
color: PaletteDark.darkCyanBlue, // template new text (send page)
decorationColor: PaletteDark.darkVioletBlue // template background color (send page)
),
display4: TextStyle(
color: PaletteDark.cyanBlue, // template title (send page)
decorationColor: PaletteDark.darkCyanBlue // receive amount text (exchange page)
),
subtitle: TextStyle(
color: PaletteDark.wildVioletBlue, // first gradient color top panel (exchange page)
decorationColor: PaletteDark.wildVioletBlue // second gradient color top panel (exchange page)
),
body1: TextStyle(
color: PaletteDark.darkNightBlue, // first gradient color bottom panel (exchange page)
decorationColor: PaletteDark.darkNightBlue // second gradient color bottom panel (exchange page)
),
body2: TextStyle(
color: PaletteDark.blueGrey, // text field border on top panel (exchange page)
decorationColor: PaletteDark.moderateVioletBlue, // text field border on bottom panel (exchange page)
)
),
focusColor: PaletteDark.moderateBlue, // text field button (exchange page)
accentTextTheme: TextTheme(
title: TextStyle(
color: PaletteDark.nightBlue, // picker background
backgroundColor: PaletteDark.dividerColor, // picker divider
decorationColor: PaletteDark.darkNightBlue // dialog background
),
caption: TextStyle(
color: PaletteDark.nightBlue, // container (confirm exchange)
backgroundColor: PaletteDark.deepVioletBlue, // button background (confirm exchange)
decorationColor: Palette.darkLavender, // text color (information page)
),
subtitle: TextStyle(
//color: PaletteDark.lightBlueGrey, // QR code (exchange trade page)
color: Colors.white, // QR code (exchange trade page)
backgroundColor: PaletteDark.deepVioletBlue, // divider (exchange trade page)
decorationColor: Colors.white // crete new wallet button background (wallet list page)
),
headline: TextStyle(
color: PaletteDark.distantBlue, // first gradient color of wallet action buttons (wallet list page)
backgroundColor: PaletteDark.distantNightBlue, // second gradient color of wallet action buttons (wallet list page)
decorationColor: Palette.darkBlueCraiola // restore wallet button text color (wallet list page)
),
subhead: TextStyle(
color: Colors.white, // titles color (filter widget)
backgroundColor: PaletteDark.darkOceanBlue, // divider color (filter widget)
decorationColor: PaletteDark.wildVioletBlue.withOpacity(0.3) // checkbox background (filter widget)
),
overline: TextStyle(
color: PaletteDark.wildVioletBlue, // checkbox bounds (filter widget)
decorationColor: PaletteDark.darkCyanBlue, // menu subname
),
display1: TextStyle(
color: PaletteDark.deepPurpleBlue, // first gradient color (menu header)
decorationColor: PaletteDark.deepPurpleBlue // second gradient color(menu header)
),
display2: TextStyle(
color: PaletteDark.nightBlue, // action button color (address text field)
decorationColor: PaletteDark.darkCyanBlue // hint text (seed widget)
),
display3: TextStyle(
color: PaletteDark.cyanBlue, // hint text (new wallet page)
decorationColor: PaletteDark.darkGrey // underline (new wallet page)
),
display4: TextStyle(
color: PaletteDark.deepVioletBlue, // switch background (settings page)
),
body1: TextStyle(
color: PaletteDark.indicatorVioletBlue, // indicators (PIN code)
decorationColor: PaletteDark.lightPurpleBlue // switch (PIN code)
),
body2: TextStyle(
color: Palette.blueCraiola, // primary buttons, alert right buttons
decorationColor: Palette.alizarinRed // alert left button
),
),
cardColor: PaletteDark.darkNightBlue // bottom button (action list)
cardColor: PaletteDark.darkNightBlue // bottom button (action list)
);
}

View file

@ -1,4 +1,5 @@
import 'package:cake_wallet/src/screens/pin_code/pin_code_widget.dart';
import 'package:cake_wallet/themes.dart';
import 'package:flutter/cupertino.dart';
import 'package:mobx/mobx.dart';
import 'package:package_info/package_info.dart';
@ -106,11 +107,12 @@ abstract class SettingsViewModelBase with Store {
setAllowBiometricalAuthentication(value);
}
}),
SwitcherListItem(
title: S.current.settings_dark_mode,
value: () => _settingsStore.isDarkTheme,
onValueChange: (_, bool value) =>
_settingsStore.isDarkTheme = value)
PickerListItem(
title: 'Color theme',
items: Themes.all,
selectedItem: () => theme,
onItemSelected: (Themes theme) =>
_settingsStore.currentTheme = theme)
],
[
LinkListItem(
@ -186,6 +188,9 @@ abstract class SettingsViewModelBase with Store {
bool get allowBiometricalAuthentication =>
_settingsStore.allowBiometricalAuthentication;
@computed
Themes get theme => _settingsStore.currentTheme;
final Map<String, String> itemHeaders;
List<List<SettingsListItem>> sections;
final SettingsStore _settingsStore;