rudimentary color theme toggle option and some more color fixes

This commit is contained in:
julian 2022-09-21 17:57:59 -06:00
parent 61e9b8715f
commit f5a3fddfe9
7 changed files with 132 additions and 28 deletions

View file

@ -9,7 +9,6 @@ import 'package:stackwallet/models/notification_model.dart';
import 'package:stackwallet/models/trade_wallet_lookup.dart'; import 'package:stackwallet/models/trade_wallet_lookup.dart';
import 'package:stackwallet/services/wallets_service.dart'; import 'package:stackwallet/services/wallets_service.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/logger.dart';
class DB { class DB {
@ -30,6 +29,7 @@ class DB {
static const String boxNameWalletsToDeleteOnStart = "walletsToDeleteOnStart"; static const String boxNameWalletsToDeleteOnStart = "walletsToDeleteOnStart";
static const String boxNamePriceCache = "priceAPIPrice24hCache"; static const String boxNamePriceCache = "priceAPIPrice24hCache";
static const String boxNameDBInfo = "dbInfo"; static const String boxNameDBInfo = "dbInfo";
static const String boxNameTheme = "theme";
String boxNameTxCache({required Coin coin}) => "${coin.name}_txCache"; String boxNameTxCache({required Coin coin}) => "${coin.name}_txCache";
String boxNameSetCache({required Coin coin}) => String boxNameSetCache({required Coin coin}) =>

View file

@ -141,6 +141,19 @@ void main() async {
monero.onStartup(); monero.onStartup();
await Hive.openBox<dynamic>(DB.boxNameTheme);
final colorScheme =
DB.instance.get<dynamic>(boxName: DB.boxNameTheme, key: "colorScheme") as String?;
switch (colorScheme) {
case "dark":
StackTheme.instance.setTheme(ThemeType.dark);
break;
case "light":
default:
StackTheme.instance.setTheme(ThemeType.light);
}
// SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, // SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual,
// overlays: [SystemUiOverlay.bottom]); // overlays: [SystemUiOverlay.bottom]);
await NotificationApi.init(); await NotificationApi.init();
@ -157,8 +170,6 @@ class MyApp extends StatelessWidget {
final localeService = LocaleService(); final localeService = LocaleService();
localeService.loadLocale(); localeService.loadLocale();
StackTheme.instance.setTheme(ThemeType.dark);
return const KeyboardDismisser( return const KeyboardDismisser(
child: MaterialAppWithTheme(), child: MaterialAppWithTheme(),
); );

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:stackwallet/hive/db.dart';
import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
@ -89,6 +90,74 @@ class AppearanceSettingsView extends ConsumerWidget {
}, },
), ),
), ),
const SizedBox(
height: 10,
),
RoundedWhiteContainer(
child: Consumer(
builder: (_, ref, __) {
return RawMaterialButton(
splashColor: StackTheme.instance.color.highlight,
materialTapTargetSize:
MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
onPressed: null,
child: Padding(
padding:
const EdgeInsets.symmetric(vertical: 2),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
"Enabled dark mode",
style: STextStyles.titleBold12,
textAlign: TextAlign.left,
),
Text(
"Requires restart",
style: STextStyles.itemSubtitle,
textAlign: TextAlign.left,
),
],
),
SizedBox(
height: 20,
width: 40,
child: DraggableSwitchButton(
isOn: (DB.instance.get<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme")
as String?) ==
"dark",
onValueChanged: (newValue) {
// StackTheme.instance.setTheme(newValue
// ? ThemeType.dark
// : ThemeType.light);
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value:
StackTheme.instance.theme.name,
);
},
),
)
],
),
),
);
},
),
),
], ],
), ),
), ),

View file

@ -123,7 +123,7 @@ class _RefreshButtonState extends ConsumerState<WalletRefreshButton>
Assets.svg.arrowRotate, Assets.svg.arrowRotate,
width: 24, width: 24,
height: 24, height: 24,
color: StackTheme.instance.color.accentColorDark, color: StackTheme.instance.color.textFavoriteCard,
), ),
), ),
), ),

View file

@ -130,6 +130,8 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
"${_showAvailable ? "Private" : "Public"} Balance", "${_showAvailable ? "Private" : "Public"} Balance",
style: STextStyles.subtitle.copyWith( style: STextStyles.subtitle.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: StackTheme
.instance.color.textFavoriteCard,
), ),
), ),
if (coin != Coin.firo && coin != Coin.firoTestNet) if (coin != Coin.firo && coin != Coin.firoTestNet)
@ -137,6 +139,8 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
"${_showAvailable ? "Available" : "Full"} Balance", "${_showAvailable ? "Available" : "Full"} Balance",
style: STextStyles.subtitle.copyWith( style: STextStyles.subtitle.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: StackTheme
.instance.color.textFavoriteCard,
), ),
), ),
const SizedBox( const SizedBox(
@ -145,7 +149,7 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
SvgPicture.asset( SvgPicture.asset(
Assets.svg.chevronDown, Assets.svg.chevronDown,
color: color:
StackTheme.instance.color.accentColorDark, StackTheme.instance.color.textFavoriteCard,
width: 8, width: 8,
height: 4, height: 4,
), ),
@ -163,6 +167,7 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
)} ${coin.ticker}", )} ${coin.ticker}",
style: STextStyles.pageTitleH1.copyWith( style: STextStyles.pageTitleH1.copyWith(
fontSize: 24, fontSize: 24,
color: StackTheme.instance.color.textFavoriteCard,
), ),
), ),
), ),
@ -174,6 +179,7 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
)} $baseCurrency", )} $baseCurrency",
style: STextStyles.subtitle.copyWith( style: STextStyles.subtitle.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: StackTheme.instance.color.textFavoriteCard,
), ),
), ),
], ],
@ -191,6 +197,8 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
"${_showAvailable ? "Private" : "Public"} Balance", "${_showAvailable ? "Private" : "Public"} Balance",
style: STextStyles.subtitle.copyWith( style: STextStyles.subtitle.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: StackTheme
.instance.color.textFavoriteCard,
), ),
), ),
if (coin != Coin.firo && coin != Coin.firoTestNet) if (coin != Coin.firo && coin != Coin.firoTestNet)
@ -198,6 +206,8 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
"${_showAvailable ? "Available" : "Full"} Balance", "${_showAvailable ? "Available" : "Full"} Balance",
style: STextStyles.subtitle.copyWith( style: STextStyles.subtitle.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: StackTheme
.instance.color.textFavoriteCard,
), ),
), ),
const SizedBox( const SizedBox(
@ -205,10 +215,10 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
), ),
SvgPicture.asset( SvgPicture.asset(
Assets.svg.chevronDown, Assets.svg.chevronDown,
color:
StackTheme.instance.color.accentColorDark,
width: 8, width: 8,
height: 4, height: 4,
color:
StackTheme.instance.color.textFavoriteCard,
), ),
], ],
), ),
@ -223,6 +233,7 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
], ],
style: STextStyles.pageTitleH1.copyWith( style: STextStyles.pageTitleH1.copyWith(
fontSize: 24, fontSize: 24,
color: StackTheme.instance.color.textFavoriteCard,
), ),
), ),
AnimatedText( AnimatedText(
@ -234,6 +245,7 @@ class _WalletSummaryInfoState extends State<WalletSummaryInfo> {
], ],
style: STextStyles.subtitle.copyWith( style: STextStyles.subtitle.copyWith(
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: StackTheme.instance.color.textFavoriteCard,
), ),
), ),
], ],

View file

@ -440,6 +440,10 @@ class _WalletViewState extends ConsumerState<WalletView> {
: Assets.svg.bell, : Assets.svg.bell,
width: 20, width: 20,
height: 20, height: 20,
color: ref.watch(notificationsProvider.select((value) =>
value.hasUnreadNotificationsFor(walletId)))
? null
: StackTheme.instance.color.topNavIconPrimary,
), ),
onPressed: () { onPressed: () {
// reset unread state // reset unread state
@ -544,6 +548,8 @@ class _WalletViewState extends ConsumerState<WalletView> {
children: [ children: [
Expanded( Expanded(
child: TextButton( child: TextButton(
style: StackTheme.instance
.getSecondaryEnabledButtonColor(context),
onPressed: () async { onPressed: () async {
await showDialog<void>( await showDialog<void>(
context: context, context: context,
@ -558,8 +564,9 @@ class _WalletViewState extends ConsumerState<WalletView> {
child: Text( child: Text(
"Cancel", "Cancel",
style: STextStyles.button.copyWith( style: STextStyles.button.copyWith(
color: StackTheme color: StackTheme
.instance.color.accentColorDark), .instance.color.accentColorDark,
),
), ),
), ),
rightButton: TextButton( rightButton: TextButton(
@ -581,8 +588,9 @@ class _WalletViewState extends ConsumerState<WalletView> {
child: Text( child: Text(
"Anonymize funds", "Anonymize funds",
style: STextStyles.button.copyWith( style: STextStyles.button.copyWith(
color: StackTheme color: StackTheme
.instance.color.accentColorDark), .instance.color.buttonTextSecondary,
),
), ),
), ),
), ),

View file

@ -128,25 +128,29 @@ class _FavoriteCardState extends ConsumerState<FavoriteCard> {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row( Expanded(
mainAxisAlignment: MainAxisAlignment.center, child: Row(
children: [ mainAxisAlignment: MainAxisAlignment.center,
Text( crossAxisAlignment: CrossAxisAlignment.start,
ref.watch( children: [
managerProvider.select((value) => value.walletName)), Expanded(
style: STextStyles.itemSubtitle12.copyWith( child: Text(
color: StackTheme.instance.color.textFavoriteCard, ref.watch(managerProvider
.select((value) => value.walletName)),
style: STextStyles.itemSubtitle12.copyWith(
color: StackTheme.instance.color.textFavoriteCard,
),
overflow: TextOverflow.fade,
),
), ),
), SvgPicture.asset(
const Spacer(), Assets.svg.iconFor(coin: coin),
SvgPicture.asset( width: 24,
Assets.svg.iconFor(coin: coin), height: 24,
width: 24, ),
height: 24, ],
), ),
],
), ),
const Spacer(),
FutureBuilder( FutureBuilder(
future: ref.watch( future: ref.watch(
managerProvider.select((value) => value.totalBalance)), managerProvider.select((value) => value.totalBalance)),