Ecosystem/stack_wallet
1
0
Fork 0
mirror of https://github.com/cypherstack/stack_wallet.git synced 2024-12-22 19:39:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

desktop menu icons update and exit functionality implemented

Browse source
This commit is contained in:
julian 2022-10-26 15:04:04 -06:00
parent 7735412303
commit 992debc86a
9 changed files with 208 additions and 123 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
assets/svg/about-desktop.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.44444 2.21973C2.09618 2.21973 1 3.31591 1 4.66417V15.6642C1 17.0124 2.09618 18.1086 3.44444 18.1086H10.1667L9.75799 19.3308H7.11111C6.43507 19.3308 5.88889 19.877 5.88889 20.5531C5.88889 21.2291 6.43507 21.7753 7.11111 21.7753H16.8889C17.5649 21.7753 18.1111 21.2291 18.1111 20.5531C18.1111 19.877 17.5649 19.3308 16.8889 19.3308H14.242L13.8333 18.1086H20.5556C21.9038 18.1086 23 17.0124 23 15.6642V4.66417C23 3.31591 21.9038 2.21973 20.5556 2.21973H3.44444ZM20.5556 4.66417V13.2197H3.44444V4.66417H20.5556Z" fill="#232323"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 641 B

3
assets/svg/address-book-desktop.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.8242 1H4.44922C2.93027 1 1.69922 2.23105 1.69922 3.75V20.25C1.69922 21.7689 2.93027 23 4.44922 23H16.8242C18.3432 23 19.5742 21.7689 19.5742 20.25V3.75C19.5742 2.23105 18.341 1 16.8242 1ZM10.6367 6.5C12.1557 6.5 13.3867 7.73105 13.3867 9.25C13.3867 10.7689 12.1557 12 10.6367 12C9.1182 12 7.88672 10.7689 7.88672 9.25C7.88672 7.73105 9.11992 6.5 10.6367 6.5ZM14.7617 17.5H6.51172C6.13359 17.5 5.82422 17.1906 5.82422 16.8125C5.82422 14.9133 7.3625 13.375 9.26172 13.375H12.0117C13.9101 13.375 15.4492 14.9141 15.4492 16.8125C15.4492 17.1906 15.1398 17.5 14.7617 17.5ZM21.6367 3.75H20.9492V7.875H21.6367C22.0148 7.875 22.3242 7.56563 22.3242 7.1875V4.4375C22.3242 4.05766 22.0148 3.75 21.6367 3.75ZM21.6367 9.25H20.9492V13.375H21.6367C22.0148 13.375 22.3242 13.0656 22.3242 12.6875V9.9375C22.3242 9.55937 22.0148 9.25 21.6367 9.25ZM21.6367 14.75H20.9492V18.875H21.6367C22.0164 18.875 22.3242 18.5672 22.3242 18.1875V15.4375C22.3242 15.0594 22.0148 14.75 21.6367 14.75Z" fill="#232323"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

3
assets/svg/exchange-desktop.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.69844 6.70024C9.61406 3.78461 14.325 3.77055 17.2594 6.65336L15.3281 8.57993C15.0047 8.90336 14.9109 9.38618 15.0844 9.80805C15.2578 10.2299 15.6703 10.5018 16.125 10.5018H21.7266H22.125C22.7484 10.5018 23.25 10.0002 23.25 9.3768V3.3768C23.25 2.92211 22.9781 2.50961 22.5563 2.33618C22.1344 2.16274 21.6516 2.25649 21.3281 2.57993L19.3781 4.52993C15.2719 0.475238 8.65781 0.489301 4.575 4.5768C3.43125 5.72055 2.60625 7.06586 2.1 8.50492C1.82344 9.28774 2.23594 10.1409 3.01406 10.4174C3.79219 10.694 4.65 10.2815 4.92656 9.50336C5.2875 8.48149 5.87344 7.52055 6.69844 6.70024ZM0.75 14.6268V14.9831V15.0159V20.6268C0.75 21.0815 1.02187 21.494 1.44375 21.6674C1.86562 21.8409 2.34844 21.7471 2.67188 21.4237L4.62187 19.4737C8.72812 23.5284 15.3422 23.5143 19.425 19.4268C20.5688 18.2831 21.3984 16.9377 21.9047 15.5034C22.1812 14.7206 21.7687 13.8674 20.9906 13.5909C20.2125 13.3143 19.3547 13.7268 19.0781 14.5049C18.7172 15.5268 18.1313 16.4877 17.3063 17.3081C14.3906 20.2237 9.67969 20.2377 6.74531 17.3549L8.67188 15.4237C8.99531 15.1002 9.08906 14.6174 8.91562 14.1956C8.74219 13.7737 8.32969 13.5018 7.875 13.5018H2.26875H2.23594H1.875C1.25156 13.5018 0.75 14.0034 0.75 14.6268Z" fill="#232323"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.3 KiB

3
assets/svg/exit-desktop.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="22" height="20" viewBox="0 0 22 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.875 3.12012C7.63555 3.12012 8.25 2.50566 8.25 1.74512C8.25 0.98457 7.63555 0.370117 6.875 0.370117H4.125C1.84766 0.370117 0 2.21777 0 4.49512V15.4951C0 17.7725 1.84766 19.6201 4.125 19.6201H6.875C7.63555 19.6201 8.25 19.0057 8.25 18.2451C8.25 17.4846 7.63555 16.8701 6.875 16.8701H4.125C3.36445 16.8701 2.75 16.2557 2.75 15.4951V4.49512C2.75 3.73457 3.36445 3.12012 4.125 3.12012H6.875ZM21.6777 10.7428C21.884 10.5494 22 10.2787 22 9.99512C22 9.71152 21.884 9.44082 21.6777 9.24746L15.4902 3.40371C15.1895 3.12012 14.7512 3.04277 14.373 3.20605C13.9949 3.36934 13.75 3.74316 13.75 4.15137V7.24512H8.25C7.48945 7.24512 6.875 7.85957 6.875 8.62012V11.3701C6.875 12.1307 7.48945 12.7451 8.25 12.7451H13.75V15.8389C13.75 16.2514 13.9949 16.6209 14.373 16.7842C14.7512 16.9475 15.1895 16.8701 15.4902 16.5865L21.6777 10.7428Z" fill="#232323"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 954 B

3
assets/svg/wallet-desktop.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20.25 2.83008C21.0105 2.83008 21.625 3.4165 21.625 4.1396C21.625 4.8627 21.0105 5.44913 20.25 5.44913H4.4375C4.05766 5.44913 3.75 5.74377 3.75 6.10389C3.75 6.46401 4.05766 6.75865 4.4375 6.75865H20.25C21.7668 6.75865 23 7.93313 23 9.3777V18.5444C23 19.9889 21.7668 21.1634 20.25 21.1634H3.75C2.23105 21.1634 1 19.9889 1 18.5444V5.44913C1 4.00251 2.23105 2.83008 3.75 2.83008H20.25ZM18.875 15.2706C19.6355 15.2706 20.25 14.6854 20.25 13.961C20.25 13.2367 19.6355 12.6515 18.875 12.6515C18.1145 12.6515 17.5 13.2367 17.5 13.961C17.5 14.6854 18.1145 15.2706 18.875 15.2706Z" fill="#232323"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 702 B

3
lib/pages_desktop_specific/home/desktop_home_view.dart
View file

@ -43,9 +43,6 @@ class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> {
Container(
color: Colors.pink,
),
Container(
color: Colors.purple,
),
];
void onMenuSelectionChanged(int newIndex) {

303
lib/pages_desktop_specific/home/desktop_menu.dart
View file

@ -1,3 +1,5 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/flutter_svg.dart';
@ -70,136 +72,197 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
const SizedBox(
height: 60,
),
SizedBox(
width: _width == expandedWidth
? _width - 32 // 16 padding on either side
: _width - 16, // 8 padding on either side
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.walletFa,
width: 20,
height: 20,
Expanded(
child: SizedBox(
width: _width == expandedWidth
? _width - 32 // 16 padding on either side
: _width - 16, // 8 padding on either side
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.walletDesktop,
width: 20,
height: 20,
color: 0 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "My Stack",
value: 0,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
label: "My Stack",
value: 0,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.exchange3,
width: 20,
height: 20,
const SizedBox(
height: 2,
),
label: "Exchange",
value: 1,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.bell,
width: 20,
height: 20,
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.exchangeDesktop,
width: 20,
height: 20,
color: 1 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "Exchange",
value: 1,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
label: "Notifications",
value: 2,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.addressBook2,
width: 20,
height: 20,
const SizedBox(
height: 2,
),
label: "Address Book",
value: 3,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.gear,
width: 20,
height: 20,
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.bell,
width: 20,
height: 20,
color: 2 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "Notifications",
value: 2,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
label: "Settings",
value: 4,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
const SizedBox(
height: 2,
),
label: "Support",
value: 5,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.addressBookDesktop,
width: 20,
height: 20,
color: 3 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "Address Book",
value: 3,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
label: "About",
value: 6,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
const SizedBox(
height: 2,
),
label: "Exit",
value: 7,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
],
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.gear,
width: 20,
height: 20,
color: 4 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "Settings",
value: 4,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.messageQuestion,
width: 20,
height: 20,
color: 5 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "Support",
value: 5,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const SizedBox(
height: 2,
),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.aboutDesktop,
width: 20,
height: 20,
color: 6 == selectedMenuItem
? Theme.of(context)
.extension<StackColors>()!
.textDark
: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "About",
value: 6,
group: selectedMenuItem,
onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth,
),
const Spacer(),
DesktopMenuItem(
icon: SvgPicture.asset(
Assets.svg.exitDesktop,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.textDark
.withOpacity(0.8),
),
label: "Exit",
value: 7,
group: selectedMenuItem,
onChanged: (_) {
// todo: save stuff/ notify before exit?
exit(0);
},
iconOnly: _width == minimizedWidth,
),
],
),
),
),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
const Spacer(),
IconButton(
@ -212,7 +275,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
),
),
],
)
),
],
),
),

5
lib/utilities/assets.dart
View file

@ -139,6 +139,11 @@ class _SVG {
String get anonymize => "assets/svg/tx-icon-anonymize.svg";
String get anonymizePending => "assets/svg/tx-icon-anonymize-pending.svg";
String get anonymizeFailed => "assets/svg/tx-icon-anonymize-failed.svg";
String get addressBookDesktop => "assets/svg/address-book-desktop.svg";
String get exchangeDesktop => "assets/svg/exchange-desktop.svg";
String get aboutDesktop => "assets/svg/about-desktop.svg";
String get walletDesktop => "assets/svg/wallet-desktop.svg";
String get exitDesktop => "assets/svg/exit-desktop.svg";
String get ellipse1 => "assets/svg/Ellipse-43.svg";
String get ellipse2 => "assets/svg/Ellipse-42.svg";

5
pubspec.yaml
View file

@ -301,6 +301,11 @@ flutter:
- assets/svg/node-circle.svg
- assets/svg/dark/dark-theme.svg
- assets/svg/light/light-mode.svg
- assets/svg/address-book-desktop.svg
- assets/svg/about-desktop.svg
- assets/svg/exchange-desktop.svg
- assets/svg/wallet-desktop.svg
- assets/svg/exit-desktop.svg
# coin icons
- assets/svg/coin_icons/Bitcoin.svg
- assets/svg/coin_icons/Bitcoincash.svg