dynamic themed icons

This commit is contained in:
julian 2022-09-23 08:33:44 -06:00
parent 28f84fe8ad
commit c3612d0d89
17 changed files with 88 additions and 62 deletions

View file

@ -51,7 +51,6 @@ import 'package:stackwallet/services/notifications_api.dart';
import 'package:stackwallet/services/notifications_service.dart';
import 'package:stackwallet/services/trade_service.dart';
import 'package:stackwallet/services/wallets.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/db_version_migration.dart';
import 'package:stackwallet/utilities/enums/backup_frequency_type.dart';
@ -145,17 +144,6 @@ void main() async {
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":
Assets.theme = ThemeType.dark;
break;
case "light":
default:
Assets.theme = ThemeType.light;
}
// SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual,
// overlays: [SystemUiOverlay.bottom]);
@ -360,6 +348,18 @@ class _MaterialAppWithThemeState extends ConsumerState<MaterialAppWithTheme>
@override
void initState() {
final colorScheme = DB.instance
.get<dynamic>(boxName: DB.boxNameTheme, key: "colorScheme") as String?;
ThemeType themeType;
switch (colorScheme) {
case "dark":
themeType = ThemeType.dark;
break;
case "light":
default:
themeType = ThemeType.light;
}
loadingCompleter = Completer();
WidgetsBinding.instance.addObserver(this);
// load locale and prefs
@ -373,7 +373,7 @@ class _MaterialAppWithThemeState extends ConsumerState<MaterialAppWithTheme>
WidgetsBinding.instance.addPostFrameCallback((_) async {
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
Assets.theme! == ThemeType.dark ? DarkColors() : LightColors());
themeType == ThemeType.dark ? DarkColors() : LightColors());
if (Platform.isAndroid) {
// fetch open file if it exists

View file

@ -107,7 +107,7 @@ class ContactPopUp extends ConsumerWidget {
child: contact.id == "default"
? Center(
child: SvgPicture.asset(
Assets.svg.stackIcon,
Assets.svg.stackIcon(context),
width: 20,
),
)

View file

@ -108,11 +108,11 @@ class _TradeDetailsViewState extends ConsumerState<TradeDetailsView> {
case ChangeNowTransactionStatus.Sending:
case ChangeNowTransactionStatus.Refunded:
case ChangeNowTransactionStatus.Verifying:
return Assets.svg.txExchangePending;
return Assets.svg.txExchangePending(context);
case ChangeNowTransactionStatus.Finished:
return Assets.svg.txExchange;
return Assets.svg.txExchange(context);
case ChangeNowTransactionStatus.Failed:
return Assets.svg.txExchangeFailed;
return Assets.svg.txExchangeFailed(context);
}
}

View file

@ -143,7 +143,7 @@ class _HomeViewState extends ConsumerState<HomeView> {
GestureDetector(
onTap: _hiddenOptions,
child: SvgPicture.asset(
Assets.svg.stackIcon,
Assets.svg.stackIcon(context),
width: 24,
height: 24,
),
@ -174,7 +174,7 @@ class _HomeViewState extends ConsumerState<HomeView> {
icon: SvgPicture.asset(
ref.watch(notificationsProvider
.select((value) => value.hasUnreadNotifications))
? Assets.svg.bellNew
? Assets.svg.bellNew(context)
: Assets.svg.bell,
width: 20,
height: 20,

View file

@ -110,7 +110,7 @@ class _IntroViewState extends State<IntroView> {
width: 130,
height: 130,
child: SvgPicture.asset(
Assets.svg.stackIcon,
Assets.svg.stackIcon(context),
),
),
const Spacer(

View file

@ -9,7 +9,8 @@ class TxIcon extends StatelessWidget {
static const Size size = Size(32, 32);
String _getAssetName(bool isCancelled, bool isReceived, bool isPending) {
String _getAssetName(
bool isCancelled, bool isReceived, bool isPending, BuildContext context) {
if (!isReceived && transaction.subType == "mint") {
if (isCancelled) {
return Assets.svg.anonymizeFailed;
@ -22,20 +23,20 @@ class TxIcon extends StatelessWidget {
if (isReceived) {
if (isCancelled) {
return Assets.svg.receiveCancelled;
return Assets.svg.receiveCancelled(context);
}
if (isPending) {
return Assets.svg.receivePending;
return Assets.svg.receivePending(context);
}
return Assets.svg.receive;
return Assets.svg.receive(context);
} else {
if (isCancelled) {
return Assets.svg.sendCancelled;
return Assets.svg.sendCancelled(context);
}
if (isPending) {
return Assets.svg.sendPending;
return Assets.svg.sendPending(context);
}
return Assets.svg.send;
return Assets.svg.send(context);
}
}
@ -52,6 +53,7 @@ class TxIcon extends StatelessWidget {
transaction.isCancelled,
txIsReceived,
!transaction.confirmedStatus,
context,
),
width: size.width,
height: size.height,

View file

@ -178,7 +178,7 @@ class WalletNavigationBar extends StatelessWidget {
children: [
const Spacer(),
SvgPicture.asset(
Assets.svg.exchange,
Assets.svg.exchange(context),
width: 24,
height: 24,
),

View file

@ -436,7 +436,7 @@ class _WalletViewState extends ConsumerState<WalletView> {
icon: SvgPicture.asset(
ref.watch(notificationsProvider.select((value) =>
value.hasUnreadNotificationsFor(walletId)))
? Assets.svg.bellNew
? Assets.svg.bellNew(context)
: Assets.svg.bell,
width: 20,
height: 20,

View file

@ -54,7 +54,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
width: _width == expandedWidth ? 70 : 32,
height: _width == expandedWidth ? 70 : 32,
child: SvgPicture.asset(
Assets.svg.stackIcon,
Assets.svg.stackIcon(context),
),
),
const SizedBox(

View file

@ -40,7 +40,7 @@ class _MyStackViewState extends ConsumerState<MyStackView> {
width: 32,
height: 32,
child: SvgPicture.asset(
Assets.svg.stackIcon,
Assets.svg.stackIcon(context),
),
),
const SizedBox(

View file

@ -1,12 +1,12 @@
import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/theme/color_theme.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
abstract class Assets {
static const svg = _SVG();
static const png = _PNG();
static const lottie = _ANIMATIONS();
static const socials = _SOCIALS();
static ThemeType? theme;
}
class _SOCIALS {
@ -21,11 +21,39 @@ class _SOCIALS {
class _SVG {
const _SVG();
String bellNew(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/bell-new.svg";
String stackIcon(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/stack-icon1.svg";
String exchange(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/exchange-2.svg";
String buy(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/buy-coins-icon.svg";
String receive(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-icon-receive.svg";
String receivePending(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-icon-receive-pending.svg";
String receiveCancelled(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-icon-receive-failed.svg";
String send(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-icon-send.svg";
String sendPending(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-icon-send-pending.svg";
String sendCancelled(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-icon-send-failed.svg";
String txExchange(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-exchange-icon.svg";
String txExchangePending(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-exchange-icon-pending.svg";
String txExchangeFailed(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-exchange-icon-failed.svg";
String get plus => "assets/svg/plus.svg";
String get gear => "assets/svg/gear.svg";
String get bell => "assets/svg/bell.svg";
String get bellNew => "assets/svg/${Assets.theme!.name}/bell-new.svg";
String get stackIcon => "assets/svg/${Assets.theme!.name}/stack-icon1.svg";
String get arrowLeft => "assets/svg/arrow-left-fa.svg";
String get star => "assets/svg/star.svg";
String get copy => "assets/svg/copy-fa.svg";
@ -37,8 +65,6 @@ class _SVG {
String get bars => "assets/svg/bars.svg";
String get filter => "assets/svg/filter.svg";
String get pending => "assets/svg/pending.svg";
String get exchange => "assets/svg/${Assets.theme!.name}/exchange-2.svg";
String get buy => "assets/svg/${Assets.theme!.name}/buy-coins-icon.svg";
String get radio => "assets/svg/signal-stream.svg";
String get arrowRotate => "assets/svg/arrow-rotate.svg";
String get arrowRotate2 => "assets/svg/arrow-rotate2.svg";
@ -92,28 +118,9 @@ class _SVG {
String get anonymizePending => "assets/svg/tx-icon-anonymize-pending.svg";
String get anonymizeFailed => "assets/svg/tx-icon-anonymize-failed.svg";
String get receive => "assets/svg/${Assets.theme!.name}/tx-icon-receive.svg";
String get receivePending =>
"assets/svg/${Assets.theme!.name}/tx-icon-receive-pending.svg";
String get receiveCancelled =>
"assets/svg/${Assets.theme!.name}/tx-icon-receive-failed.svg";
String get send => "assets/svg/${Assets.theme!.name}/tx-icon-send.svg";
String get sendPending =>
"assets/svg/${Assets.theme!.name}/tx-icon-send-pending.svg";
String get sendCancelled =>
"assets/svg/${Assets.theme!.name}/tx-icon-send-failed.svg";
String get ellipse1 => "assets/svg/Ellipse-43.svg";
String get ellipse2 => "assets/svg/Ellipse-42.svg";
String get txExchange =>
"assets/svg/${Assets.theme!.name}/tx-exchange-icon.svg";
String get txExchangePending =>
"assets/svg/${Assets.theme!.name}/tx-exchange-icon-pending.svg";
String get txExchangeFailed =>
"assets/svg/${Assets.theme!.name}/tx-exchange-icon-failed.svg";
String get bitcoin => "assets/svg/coin_icons/Bitcoin.svg";
String get bitcoincash => "assets/svg/coin_icons/Bitcoincash.svg";
String get dogecoin => "assets/svg/coin_icons/Dogecoin.svg";

View file

@ -8,6 +8,8 @@ enum ThemeType {
}
abstract class StackColorTheme {
ThemeType get themeType;
Color get background;
Color get overlay;

View file

@ -2,6 +2,9 @@ import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/theme/color_theme.dart';
class DarkColors extends StackColorTheme {
@override
ThemeType get themeType => ThemeType.dark;
@override
Color get background => const Color(0xFF2A2D34);
@override

View file

@ -2,6 +2,9 @@ import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/theme/color_theme.dart';
class LightColors extends StackColorTheme {
@override
ThemeType get themeType => ThemeType.light;
@override
Color get background => const Color(0xFFF7F7F7);
@override

View file

@ -4,6 +4,8 @@ import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/theme/color_theme.dart';
class StackColors extends ThemeExtension<StackColors> {
final ThemeType themeType;
final Color background;
final Color overlay;
@ -168,6 +170,7 @@ class StackColors extends ThemeExtension<StackColors> {
final Color myStackContactIconBG;
StackColors({
required this.themeType,
required this.background,
required this.overlay,
required this.accentColorBlue,
@ -299,6 +302,7 @@ class StackColors extends ThemeExtension<StackColors> {
factory StackColors.fromStackColorTheme(StackColorTheme colorTheme) {
return StackColors(
themeType: colorTheme.themeType,
background: colorTheme.background,
overlay: colorTheme.overlay,
accentColorBlue: colorTheme.accentColorBlue,
@ -433,6 +437,7 @@ class StackColors extends ThemeExtension<StackColors> {
@override
ThemeExtension<StackColors> copyWith({
ThemeType? themeType,
Color? background,
Color? overlay,
Color? accentColorBlue,
@ -562,6 +567,7 @@ class StackColors extends ThemeExtension<StackColors> {
Color? myStackContactIconBG,
}) {
return StackColors(
themeType: themeType ?? this.themeType,
background: background ?? this.background,
overlay: overlay ?? this.overlay,
accentColorBlue: accentColorBlue ?? this.accentColorBlue,
@ -737,6 +743,7 @@ class StackColors extends ThemeExtension<StackColors> {
}
return StackColors(
themeType: other.themeType,
background: Color.lerp(
background,
other.background,

View file

@ -92,7 +92,7 @@ class _AddressBookCardState extends ConsumerState<AddressBookCard> {
child: contact.id == "default"
? Center(
child: SvgPicture.asset(
Assets.svg.stackIcon,
Assets.svg.stackIcon(context),
width: 20,
),
)

View file

@ -19,7 +19,7 @@ class TradeCard extends ConsumerWidget {
final ExchangeTransaction trade;
final VoidCallback onTap;
String _fetchIconAssetForStatus(String statusString) {
String _fetchIconAssetForStatus(String statusString, BuildContext context) {
ChangeNowTransactionStatus? status;
try {
if (statusString.toLowerCase().startsWith("waiting")) {
@ -38,11 +38,11 @@ class TradeCard extends ConsumerWidget {
case ChangeNowTransactionStatus.Sending:
case ChangeNowTransactionStatus.Refunded:
case ChangeNowTransactionStatus.Verifying:
return Assets.svg.txExchangePending;
return Assets.svg.txExchangePending(context);
case ChangeNowTransactionStatus.Finished:
return Assets.svg.txExchange;
return Assets.svg.txExchange(context);
case ChangeNowTransactionStatus.Failed:
return Assets.svg.txExchangeFailed;
return Assets.svg.txExchangeFailed(context);
}
}
@ -62,7 +62,9 @@ class TradeCard extends ConsumerWidget {
child: Center(
child: SvgPicture.asset(
_fetchIconAssetForStatus(
trade.statusObject?.status.name ?? trade.statusString),
trade.statusObject?.status.name ?? trade.statusString,
context,
),
width: 32,
height: 32,
),