Ecosystem/stack_wallet
1
0
Fork 0
mirror of https://github.com/cypherstack/stack_wallet.git synced 2025-01-23 19:05:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

desktop theme fixes

Browse source
This commit is contained in:
julian 2022-12-01 10:10:18 -06:00
parent 3ff0e9dd81
commit 1d764c13e9
13 changed files with 562 additions and 699 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
lib/pages_desktop_specific/desktop_home_view.dart
View file

@ -6,8 +6,8 @@ import 'package:stackwallet/pages_desktop_specific/desktop_menu.dart';
import 'package:stackwallet/pages_desktop_specific/my_stack_view/my_stack_view.dart';
import 'package:stackwallet/pages_desktop_specific/notifications/desktop_notifications_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/desktop_settings_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/support_and_about_view/desktop_about_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/support_and_about_view/desktop_support_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/desktop_about_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/desktop_support_view.dart';
import 'package:stackwallet/providers/desktop/current_desktop_menu_item.dart';
import 'package:stackwallet/providers/global/auto_swb_service_provider.dart';
import 'package:stackwallet/providers/global/notifications_provider.dart';
@ -32,13 +32,13 @@ class DesktopHomeView extends ConsumerStatefulWidget {
}
class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> {
final GlobalKey key = GlobalKey<NavigatorState>();
final GlobalKey myStackViewNavKey = GlobalKey<NavigatorState>();
late final Navigator myStackViewNav;
@override
void initState() {
myStackViewNav = Navigator(
key: key,
key: myStackViewNavKey,
onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: MyStackView.routeName,
);
@ -87,7 +87,7 @@ class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> {
void onMenuSelectionWillChange(DesktopMenuItemId newKey) {
if (prev == DesktopMenuItemId.myStack && prev == newKey) {
Navigator.of(key.currentContext!)
Navigator.of(myStackViewNavKey.currentContext!)
.popUntil(ModalRoute.withName(MyStackView.routeName));
if (ref.read(currentWalletIdProvider.state).state != null) {
final managerProvider = ref

112
lib/pages_desktop_specific/desktop_menu.dart
View file

@ -138,22 +138,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
children: [
DesktopMenuItem(
duration: duration,
icon: SvgPicture.asset(
Assets.svg.walletDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.myStack ==
ref
.watch(currentDesktopMenuItemProvider.state)
.state
? Theme.of(context)
.extension<StackColors>()!
.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopMyStackIcon(),
label: "My Stack",
value: DesktopMenuItemId.myStack,
onChanged: updateSelectedMenuItem,
@ -164,22 +149,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
),
DesktopMenuItem(
duration: duration,
icon: SvgPicture.asset(
Assets.svg.exchangeDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.exchange ==
ref
.watch(currentDesktopMenuItemProvider.state)
.state
? Theme.of(context)
.extension<StackColors>()!
.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopExchangeIcon(),
label: "Exchange",
value: DesktopMenuItemId.exchange,
onChanged: updateSelectedMenuItem,
@ -201,22 +171,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
),
DesktopMenuItem(
duration: duration,
icon: SvgPicture.asset(
Assets.svg.addressBookDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.addressBook ==
ref
.watch(currentDesktopMenuItemProvider.state)
.state
? Theme.of(context)
.extension<StackColors>()!
.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopAddressBookIcon(),
label: "Address Book",
value: DesktopMenuItemId.addressBook,
onChanged: updateSelectedMenuItem,
@ -227,22 +182,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
),
DesktopMenuItem(
duration: duration,
icon: SvgPicture.asset(
Assets.svg.gear,
width: 20,
height: 20,
color: DesktopMenuItemId.settings ==
ref
.watch(currentDesktopMenuItemProvider.state)
.state
? Theme.of(context)
.extension<StackColors>()!
.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopSettingsIcon(),
label: "Settings",
value: DesktopMenuItemId.settings,
onChanged: updateSelectedMenuItem,
@ -253,22 +193,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
),
DesktopMenuItem(
duration: duration,
icon: SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
color: DesktopMenuItemId.support ==
ref
.watch(currentDesktopMenuItemProvider.state)
.state
? Theme.of(context)
.extension<StackColors>()!
.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopSupportIcon(),
label: "Support",
value: DesktopMenuItemId.support,
onChanged: updateSelectedMenuItem,
@ -279,22 +204,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
),
DesktopMenuItem(
duration: duration,
icon: SvgPicture.asset(
Assets.svg.aboutDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.about ==
ref
.watch(currentDesktopMenuItemProvider.state)
.state
? Theme.of(context)
.extension<StackColors>()!
.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopAboutIcon(),
label: "About",
value: DesktopMenuItemId.about,
onChanged: updateSelectedMenuItem,
@ -304,15 +214,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
DesktopMenuItem(
duration: duration,
labelLength: 123,
icon: SvgPicture.asset(
Assets.svg.exitDesktop,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
),
icon: const DesktopExitIcon(),
label: "Exit",
value: 7,
onChanged: (_) {

148
lib/pages_desktop_specific/desktop_menu_item.dart
View file

@ -15,18 +15,51 @@ class DMIController {
}
}
class DesktopNotificationsIcon extends ConsumerStatefulWidget {
class DesktopMyStackIcon extends ConsumerWidget {
const DesktopMyStackIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.walletDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.myStack ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopExchangeIcon extends ConsumerWidget {
const DesktopExchangeIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.exchangeDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.exchange ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopNotificationsIcon extends ConsumerWidget {
const DesktopNotificationsIcon({Key? key}) : super(key: key);
@override
ConsumerState<DesktopNotificationsIcon> createState() =>
_DesktopNotificationsIconState();
}
class _DesktopNotificationsIconState
extends ConsumerState<DesktopNotificationsIcon> {
@override
Widget build(BuildContext context) {
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
ref.watch(notificationsProvider
.select((value) => value.hasUnreadNotifications))
@ -48,6 +81,103 @@ class _DesktopNotificationsIconState
}
}
class DesktopAddressBookIcon extends ConsumerWidget {
const DesktopAddressBookIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.addressBookDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.addressBook ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopSettingsIcon extends ConsumerWidget {
const DesktopSettingsIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.gear,
width: 20,
height: 20,
color: DesktopMenuItemId.settings ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopSupportIcon extends ConsumerWidget {
const DesktopSupportIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
color: DesktopMenuItemId.support ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopAboutIcon extends ConsumerWidget {
const DesktopAboutIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.aboutDesktop,
width: 20,
height: 20,
color: DesktopMenuItemId.about ==
ref.watch(currentDesktopMenuItemProvider.state).state
? Theme.of(context).extension<StackColors>()!.accentColorDark
: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopExitIcon extends ConsumerWidget {
const DesktopExitIcon({Key? key}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return SvgPicture.asset(
Assets.svg.exitDesktop,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark
.withOpacity(0.8),
);
}
}
class DesktopMenuItem<T> extends ConsumerStatefulWidget {
const DesktopMenuItem({
Key? key,

53
lib/pages_desktop_specific/my_stack_view/my_stack_view.dart
View file

@ -27,29 +27,9 @@ class _MyStackViewState extends ConsumerState<MyStackView> {
return Background(
child: Column(
children: [
DesktopAppBar(
const DesktopAppBar(
isCompactHeight: true,
leading: Row(
children: [
const SizedBox(
width: 24,
),
SizedBox(
width: 32,
height: 32,
child: SvgPicture.asset(
Assets.svg.stackIcon(context),
),
),
const SizedBox(
width: 12,
),
Text(
"My Stack",
style: STextStyles.desktopH3(context),
)
],
),
leading: DesktopMyStackTitle(),
),
Expanded(
child: hasWallets ? const MyWallets() : const EmptyWallets(),
@ -59,3 +39,32 @@ class _MyStackViewState extends ConsumerState<MyStackView> {
);
}
}
class DesktopMyStackTitle extends StatelessWidget {
const DesktopMyStackTitle({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Row(
children: [
const SizedBox(
width: 24,
),
SizedBox(
width: 32,
height: 32,
child: SvgPicture.asset(
Assets.svg.stackIcon(context),
),
),
const SizedBox(
width: 12,
),
Text(
"My Stack",
style: STextStyles.desktopH3(context),
)
],
);
}
}

37
lib/pages_desktop_specific/settings/desktop_settings_view.dart
View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/advanced_settings/advanced_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/appearance_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/backup_and_restore/backup_and_restore_settings.dart';
@ -7,7 +8,6 @@ import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/curren
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/language_settings/language_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/nodes_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/security_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/settings_menu.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/syncing_preferences_settings.dart';
import 'package:stackwallet/route_generator.dart';
import 'package:stackwallet/utilities/text_styles.dart';
@ -26,7 +26,6 @@ class DesktopSettingsView extends ConsumerStatefulWidget {
}
class _DesktopSettingsViewState extends ConsumerState<DesktopSettingsView> {
int currentViewIndex = 0;
final List<Widget> contentViews = [
const Navigator(
key: Key("settingsBackupRestoreDesktopKey"),
@ -70,12 +69,6 @@ class _DesktopSettingsViewState extends ConsumerState<DesktopSettingsView> {
), //advanced
];
void onMenuSelectionChanged(int newIndex) {
setState(() {
currentViewIndex = newIndex;
});
}
@override
Widget build(BuildContext context) {
return DesktopScaffold(
@ -83,28 +76,36 @@ class _DesktopSettingsViewState extends ConsumerState<DesktopSettingsView> {
appBar: DesktopAppBar(
isCompactHeight: true,
leading: Row(
children: [
const SizedBox(
children: const [
SizedBox(
width: 24,
height: 24,
),
Text(
"Settings",
style: STextStyles.desktopH3(context),
)
DesktopSettingsTitle(),
],
),
),
body: Row(
children: [
SettingsMenu(
onSelectionChanged: onMenuSelectionChanged,
),
const SettingsMenu(),
Expanded(
child: contentViews[currentViewIndex],
child: contentViews[
ref.watch(selectedSettingsMenuItemStateProvider.state).state],
),
],
),
);
}
}
class DesktopSettingsTitle extends StatelessWidget {
const DesktopSettingsTitle({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Text(
"Settings",
style: STextStyles.desktopH3(context),
);
}
}

233
lib/pages_desktop_specific/settings/settings_menu.dart Normal file
View file

@ -0,0 +1,233 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu_item.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
final selectedSettingsMenuItemStateProvider = StateProvider<int>((_) => 0);
class SettingsMenu extends ConsumerStatefulWidget {
const SettingsMenu({
Key? key,
}) : super(key: key);
@override
ConsumerState<ConsumerStatefulWidget> createState() => _SettingsMenuState();
}
class _SettingsMenuState extends ConsumerState<SettingsMenu> {
final List<String> labels = [
"Backup and restore",
"Security",
"Currency",
"Language",
"Nodes",
"Syncing preferences",
"Appearance",
"Advanced",
];
@override
Widget build(BuildContext context) {
debugPrint("BUILD: $runtimeType");
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 15),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
for (int i = 0; i < labels.length; i++)
Column(
mainAxisSize: MainAxisSize.min,
children: [
if (i > 0)
const SizedBox(
height: 2,
),
SettingsMenuItem<int>(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: ref
.watch(selectedSettingsMenuItemStateProvider
.state)
.state ==
i
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: labels[i],
value: i,
group: ref
.watch(selectedSettingsMenuItemStateProvider.state)
.state,
onChanged: (newValue) => ref
.read(selectedSettingsMenuItemStateProvider.state)
.state = newValue,
),
],
)
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 0
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Backup and restore",
// value: 0,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 1
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Security",
// value: 1,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 2
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Currency",
// value: 2,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 3
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Language",
// value: 3,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 4
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Nodes",
// value: 4,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 5
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Syncing preferences",
// value: 5,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 6
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Appearance",
// value: 6,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
// const SizedBox(
// height: 2,
// ),
// SettingsMenuItem(
// icon: SvgPicture.asset(
// Assets.svg.polygon,
// width: 11,
// height: 11,
// color: selectedMenuItem == 7
// ? Theme.of(context)
// .extension<StackColors>()!
// .accentColorBlue
// : Colors.transparent,
// ),
// label: "Advanced",
// value: 7,
// group: selectedMenuItem,
// onChanged: updateSelectedMenuItem,
// ),
],
),
),
],
);
}
}

426
lib/pages_desktop_specific/settings/settings_menu/appearance_settings.dart
View file

@ -8,9 +8,6 @@ import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/color_theme.dart';
import 'package:stackwallet/utilities/theme/dark_colors.dart';
import 'package:stackwallet/utilities/theme/light_colors.dart';
import 'package:stackwallet/utilities/theme/ocean_breeze_colors.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/custom_buttons/draggable_switch_button.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart';
@ -27,19 +24,6 @@ class AppearanceOptionSettings extends ConsumerStatefulWidget {
class _AppearanceOptionSettings
extends ConsumerState<AppearanceOptionSettings> {
// late bool isLight;
// @override
// void initState() {
//
// super.initState();
// }
//
// @override
// void dispose() {
// super.dispose();
// }
@override
Widget build(BuildContext context) {
debugPrint("BUILD: $runtimeType");
@ -166,335 +150,121 @@ class ThemeToggle extends ConsumerStatefulWidget {
Key? key,
}) : super(key: key);
// final bool externalCallsEnabled;
// final void Function(bool)? onChanged;
@override
ConsumerState<ThemeToggle> createState() => _ThemeToggle();
}
class _ThemeToggle extends ConsumerState<ThemeToggle> {
// late bool externalCallsEnabled;
late String _selectedTheme;
@override
void initState() {
_selectedTheme =
DB.instance.get<dynamic>(boxName: DB.boxNameTheme, key: "colorScheme")
as String? ??
"light";
super.initState();
String assetNameFor(ThemeType type) {
switch (type) {
case ThemeType.light:
return Assets.svg.themeLight;
case ThemeType.dark:
return Assets.svg.themeDark;
case ThemeType.oceanBreeze:
return Assets.svg.themeOcean;
}
}
@override
Widget build(BuildContext context) {
return Row(
children: [
MaterialButton(
splashColor: Colors.transparent,
hoverColor: Colors.transparent,
padding: const EdgeInsets.all(0),
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
onPressed: () {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.light.name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
LightColors(),
);
setState(() {
_selectedTheme = "light";
});
},
child: SizedBox(
width: 200,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
decoration: BoxDecoration(
border: Border.all(
width: 2.5,
color: _selectedTheme == "light"
? Theme.of(context)
.extension<StackColors>()!
.infoItemIcons
: Theme.of(context).extension<StackColors>()!.popupBG,
),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
child: SvgPicture.asset(
Assets.svg.themeLight,
),
),
for (int i = 0; i < ThemeType.values.length; i++)
Row(
mainAxisSize: MainAxisSize.min,
children: [
if (i > 0)
const SizedBox(
height: 12,
width: 10,
),
Row(
children: [
SizedBox(
width: 20,
height: 20,
child: Radio(
activeColor: Theme.of(context)
.extension<StackColors>()!
.radioButtonIconEnabled,
value: "light",
groupValue: _selectedTheme,
onChanged: (newValue) {
if (newValue is String && newValue == "light") {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.light.name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
LightColors(),
);
setState(() {
_selectedTheme = "light";
});
}
},
),
),
const SizedBox(
width: 14,
),
Text(
"Light",
style:
STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
],
),
],
),
),
),
const SizedBox(
width: 10,
),
MaterialButton(
splashColor: Colors.transparent,
hoverColor: Colors.transparent,
padding: const EdgeInsets.all(0),
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
onPressed: () {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.oceanBreeze.name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
OceanBreezeColors(),
);
setState(() {
_selectedTheme = "oceanBreeze";
});
},
child: SizedBox(
width: 200,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
decoration: BoxDecoration(
border: Border.all(
width: 2.5,
color: _selectedTheme == "oceanBreeze"
? Theme.of(context)
.extension<StackColors>()!
.infoItemIcons
: Theme.of(context).extension<StackColors>()!.popupBG,
),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
MouseRegion(
cursor: SystemMouseCursors.click,
child: GestureDetector(
onTap: () {
if (ref.read(colorThemeProvider.state).state.themeType !=
ThemeType.values[i]) {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.values[i].name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
ThemeType.values[i].colorTheme);
}
},
child: Container(
width: 200,
color: Colors.transparent,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
decoration: BoxDecoration(
border: Border.all(
width: 2.5,
color: ref
.read(colorThemeProvider.state)
.state
.themeType ==
ThemeType.values[i]
? Theme.of(context)
.extension<StackColors>()!
.infoItemIcons
: Theme.of(context)
.extension<StackColors>()!
.popupBG,
),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
child: SvgPicture.asset(
assetNameFor(ThemeType.values[i]),
),
),
const SizedBox(
height: 12,
),
Row(
children: [
SizedBox(
width: 20,
height: 20,
child: Radio<ThemeType>(
activeColor: Theme.of(context)
.extension<StackColors>()!
.radioButtonIconEnabled,
value: ThemeType.values[i],
groupValue: ref
.read(colorThemeProvider.state)
.state
.themeType,
onChanged: (_) {},
),
),
const SizedBox(
width: 14,
),
Text(
ThemeType.values[i].prettyName,
style: STextStyles.desktopTextExtraSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
],
),
],
),
),
child: SvgPicture.asset(
Assets.svg.themeOcean,
),
),
const SizedBox(
height: 12,
),
Row(
children: [
SizedBox(
width: 20,
height: 20,
child: Radio(
activeColor: Theme.of(context)
.extension<StackColors>()!
.radioButtonIconEnabled,
value: "oceanBreeze",
groupValue: _selectedTheme,
onChanged: (newValue) {
if (newValue is String && newValue == "oceanBreeze") {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.oceanBreeze.name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
OceanBreezeColors(),
);
setState(() {
_selectedTheme = "oceanBreeze";
});
}
},
),
),
const SizedBox(
width: 14,
),
Text(
"Ocean Breeze",
style:
STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
],
),
],
),
)
],
),
),
const SizedBox(
width: 10,
),
MaterialButton(
splashColor: Colors.transparent,
hoverColor: Colors.transparent,
padding: const EdgeInsets.all(0),
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
onPressed: () {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.dark.name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
DarkColors(),
);
setState(() {
_selectedTheme = "dark";
});
},
child: SizedBox(
width: 200,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
decoration: BoxDecoration(
border: Border.all(
width: 2.5,
color: _selectedTheme == "dark"
? Theme.of(context)
.extension<StackColors>()!
.infoItemIcons
: Theme.of(context).extension<StackColors>()!.popupBG,
),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
child: SvgPicture.asset(
Assets.svg.themeDark,
),
),
const SizedBox(
height: 12,
),
Row(
children: [
SizedBox(
width: 20,
height: 20,
child: Radio(
activeColor: Theme.of(context)
.extension<StackColors>()!
.radioButtonIconEnabled,
value: "dark",
groupValue: _selectedTheme,
onChanged: (newValue) {
if (newValue is String && newValue == "dark") {
DB.instance.put<dynamic>(
boxName: DB.boxNameTheme,
key: "colorScheme",
value: ThemeType.dark.name,
);
ref.read(colorThemeProvider.state).state =
StackColors.fromStackColorTheme(
DarkColors(),
);
setState(() {
_selectedTheme = "dark";
});
}
},
),
),
const SizedBox(
width: 14,
),
Text(
"Dark",
style:
STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
],
),
],
),
),
),
],
);
}

0
lib/pages_desktop_specific/settings/support_and_about_view/desktop_about_view.dart → lib/pages_desktop_specific/settings/settings_menu/desktop_about_view.dart
View file

0
lib/pages_desktop_specific/settings/support_and_about_view/desktop_support_view.dart → lib/pages_desktop_specific/settings/settings_menu/desktop_support_view.dart
View file

200
lib/pages_desktop_specific/settings/settings_menu/settings_menu.dart
View file

@ -1,200 +0,0 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu_item.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
class SettingsMenu extends ConsumerStatefulWidget {
const SettingsMenu({
Key? key,
required this.onSelectionChanged,
}) : super(key: key);
final void Function(int)?
onSelectionChanged; //is a function that takes in an int and returns void/.;
static const String routeName = "/settingsMenu";
@override
ConsumerState<ConsumerStatefulWidget> createState() => _SettingsMenuState();
}
class _SettingsMenuState extends ConsumerState<SettingsMenu> {
int selectedMenuItem = 0;
void updateSelectedMenuItem(int index) {
setState(() {
selectedMenuItem = index;
});
widget.onSelectionChanged?.call(index);
}
@override
Widget build(BuildContext context) {
debugPrint("BUILD: $runtimeType");
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 15),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 0
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Backup and restore",
value: 0,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 1
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Security",
value: 1,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 2
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Currency",
value: 2,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 3
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Language",
value: 3,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 4
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Nodes",
value: 4,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 5
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Syncing preferences",
value: 5,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 6
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Appearance",
value: 6,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
const SizedBox(
height: 2,
),
SettingsMenuItem(
icon: SvgPicture.asset(
Assets.svg.polygon,
width: 11,
height: 11,
color: selectedMenuItem == 7
? Theme.of(context)
.extension<StackColors>()!
.accentColorBlue
: Colors.transparent,
),
label: "Advanced",
value: 7,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
),
],
),
),
],
);
}
}

2
lib/pages_desktop_specific/settings/settings_menu_item.dart
View file

@ -33,7 +33,7 @@ class SettingsMenuItem<T> extends StatelessWidget {
onChanged(value);
},
child: Padding(
padding: EdgeInsets.symmetric(
padding: const EdgeInsets.symmetric(
vertical: 16,
horizontal: 16,
),

13
lib/route_generator.dart
View file

@ -104,13 +104,12 @@ import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/advanc
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/appearance_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/backup_and_restore/backup_and_restore_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/currency_settings/currency_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/desktop_about_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/desktop_support_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/language_settings/language_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/nodes_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/security_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/settings_menu.dart';
import 'package:stackwallet/pages_desktop_specific/settings/settings_menu/syncing_preferences_settings.dart';
import 'package:stackwallet/pages_desktop_specific/settings/support_and_about_view/desktop_about_view.dart';
import 'package:stackwallet/pages_desktop_specific/settings/support_and_about_view/desktop_support_view.dart';
import 'package:stackwallet/services/coins/manager.dart';
import 'package:stackwallet/services/event_bus/events/global/node_connection_status_changed_event.dart';
import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart';
@ -1061,14 +1060,6 @@ class RouteGenerator {
}
return _routeError("${settings.name} invalid args: ${args.toString()}");
case SettingsMenu.routeName:
return getRoute(
shouldUseMaterialRoute: useMaterialPageRoute,
builder: (_) => SettingsMenu(
onSelectionChanged: (int) {},
),
settings: RouteSettings(name: settings.name));
case BackupRestoreSettings.routeName:
return getRoute(
shouldUseMaterialRoute: useMaterialPageRoute,

27
lib/utilities/theme/color_theme.dart
View file

@ -1,5 +1,8 @@
import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/theme/dark_colors.dart';
import 'package:stackwallet/utilities/theme/light_colors.dart';
import 'package:stackwallet/utilities/theme/ocean_breeze_colors.dart';
enum ThemeType {
light,
@ -7,6 +10,30 @@ enum ThemeType {
oceanBreeze,
}
extension ThemeTypeExt on ThemeType {
StackColorTheme get colorTheme {
switch (this) {
case ThemeType.light:
return LightColors();
case ThemeType.dark:
return DarkColors();
case ThemeType.oceanBreeze:
return OceanBreezeColors();
}
}
String get prettyName {
switch (this) {
case ThemeType.light:
return "Light";
case ThemeType.dark:
return "Dark";
case ThemeType.oceanBreeze:
return "Ocean Breeze";
}
}
}
abstract class StackColorTheme {
ThemeType get themeType;