create single coin card widget

This commit is contained in:
julian 2023-06-08 10:59:44 -06:00
parent 1c88ca5f8d
commit d69b21b4a8
4 changed files with 146 additions and 175 deletions

View file

@ -8,27 +8,15 @@
*
*/
// import 'dart:html';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/pages/wallet_view/sub_widgets/wallet_summary_info.dart';
import 'package:stackwallet/services/coins/manager.dart';
import 'package:stackwallet/services/event_bus/events/global/wallet_sync_status_changed_event.dart';
import 'package:stackwallet/themes/stack_colors.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/widgets/coin_card.dart';
import '../../../themes/coin_card_provider.dart';
import '../../../utilities/enums/coin_enum.dart';
class WalletSummary extends ConsumerWidget {
class WalletSummary extends StatelessWidget {
const WalletSummary({
Key? key,
required this.walletId,
required this.managerProvider,
required this.initialSyncStatus,
this.aspectRatio = 2.0,
this.minHeight = 100.0,
@ -38,7 +26,6 @@ class WalletSummary extends ConsumerWidget {
}) : super(key: key);
final String walletId;
final ChangeNotifierProvider<Manager> managerProvider;
final WalletSyncStatus initialSyncStatus;
final double aspectRatio;
@ -48,10 +35,7 @@ class WalletSummary extends ConsumerWidget {
final double maxWidth;
@override
Widget build(BuildContext context, WidgetRef ref) {
final Coin coin = ref.watch(managerProvider.select((value) => value.coin));
final bool hasCardImageBg = ref.watch(coinCardProvider(coin)) != null;
Widget build(BuildContext context) {
return AspectRatio(
aspectRatio: aspectRatio,
child: ConstrainedBox(
@ -61,92 +45,25 @@ class WalletSummary extends ConsumerWidget {
maxHeight: maxHeight,
maxWidth: minWidth,
),
child: Stack(
children: [
if (hasCardImageBg)
Image.file(
File(
ref.watch(coinCardProvider(coin))!,
),
child: LayoutBuilder(
builder: (_, constraints) => Stack(
children: [
CoinCard(
walletId: walletId,
width: constraints.maxWidth,
height: constraints.maxHeight,
),
if (!hasCardImageBg)
Consumer(
builder: (_, ref, __) {
return Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.colorForCoin(ref.watch(
managerProvider.select((value) => value.coin))),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
);
},
),
if (!hasCardImageBg)
Positioned.fill(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Spacer(
flex: 5,
),
Expanded(
flex: 6,
child: SvgPicture.asset(
Assets.svg.ellipse1,
// fit: BoxFit.fitWidth,
// clipBehavior: Clip.none,
),
),
const SizedBox(
width: 25,
),
],
child: Padding(
padding: const EdgeInsets.all(16.0),
child: WalletSummaryInfo(
walletId: walletId,
initialSyncStatus: initialSyncStatus,
),
),
),
// Positioned.fill(
// child:
// Column(
// mainAxisAlignment: MainAxisAlignment.end,
// children: [
if (!hasCardImageBg)
Align(
alignment: Alignment.bottomCenter,
child: Row(
children: [
const Spacer(
flex: 1,
),
Expanded(
flex: 3,
child: SvgPicture.asset(
Assets.svg.ellipse2,
// fit: BoxFit.f,
// clipBehavior: Clip.none,
),
),
const SizedBox(
width: 13,
),
],
),
),
// ],
// ),
// ),
Positioned.fill(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: WalletSummaryInfo(
walletId: walletId,
initialSyncStatus: initialSyncStatus,
),
),
),
],
],
),
),
),
);

View file

@ -680,7 +680,6 @@ class _WalletViewState extends ConsumerState<WalletView> {
padding: const EdgeInsets.symmetric(horizontal: 16),
child: WalletSummary(
walletId: walletId,
managerProvider: managerProvider,
initialSyncStatus: ref.watch(managerProvider
.select((value) => value.isRefreshing))
? WalletSyncStatus.syncing

View file

@ -17,16 +17,15 @@ import 'package:stackwallet/pages/wallet_view/wallet_view.dart';
import 'package:stackwallet/pages_desktop_specific/my_stack_view/wallet_view/desktop_wallet_view.dart';
import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/services/coins/firo/firo_wallet.dart';
import 'package:stackwallet/themes/coin_card_provider.dart';
import 'package:stackwallet/themes/coin_icon_provider.dart';
import 'package:stackwallet/themes/stack_colors.dart';
import 'package:stackwallet/utilities/amount/amount.dart';
import 'package:stackwallet/utilities/amount/amount_formatter.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/util.dart';
import 'package:stackwallet/widgets/coin_card.dart';
import 'package:stackwallet/widgets/conditional_parent.dart';
import 'package:tuple/tuple.dart';
@ -68,8 +67,6 @@ class _FavoriteCardState extends ConsumerState<FavoriteCard> {
prefsChangeNotifierProvider.select((value) => value.externalCalls),
);
final bool hasCardImageBg = ref.watch(coinCardProvider(coin)) != null;
return ConditionalParent(
condition: Util.isDesktop,
builder: (child) => MouseRegion(
@ -148,75 +145,10 @@ class _FavoriteCardState extends ConsumerState<FavoriteCard> {
width: widget.width,
height: widget.height,
child: CardOverlayStack(
background: Stack(
children: [
if (hasCardImageBg)
Image.file(
File(
ref.watch(coinCardProvider(coin))!,
),
),
if (!hasCardImageBg)
Container(
width: widget.width,
height: widget.height,
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.colorForCoin(coin),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
),
if (!hasCardImageBg)
Column(
children: [
const Spacer(),
SizedBox(
height: widget.width * 0.3,
child: Row(
children: [
const Spacer(
flex: 9,
),
SvgPicture.asset(
Assets.svg.ellipse2,
height: widget.width * 0.3,
),
// ),
const Spacer(
flex: 2,
),
],
),
),
],
),
if (!hasCardImageBg)
Row(
children: [
const Spacer(
flex: 5,
),
SizedBox(
width: widget.width * 0.45,
child: Column(
children: [
SvgPicture.asset(
Assets.svg.ellipse1,
width: widget.width * 0.45,
),
const Spacer(),
],
),
),
const Spacer(
flex: 1,
),
],
),
],
background: CoinCard(
walletId: widget.walletId,
width: widget.width,
height: widget.height,
),
child: Padding(
padding: const EdgeInsets.all(12.0),

123
lib/widgets/coin_card.dart Normal file
View file

@ -0,0 +1,123 @@
/*
* This file is part of Stack Wallet.
*
* Copyright (c) 2023 Cypher Stack
* All Rights Reserved.
* The code is distributed under GPLv3 license, see LICENSE file for details.
* Generated by Cypher Stack on 2023-05-26
*
*/
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/themes/coin_card_provider.dart';
import 'package:stackwallet/themes/stack_colors.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
class CoinCard extends ConsumerWidget {
const CoinCard({
super.key,
required this.walletId,
required this.width,
required this.height,
});
final String walletId;
final double width;
final double height;
@override
Widget build(BuildContext context, WidgetRef ref) {
final coin = ref.watch(
walletsChangeNotifierProvider
.select((value) => value.getManager(walletId).coin),
);
final bool hasCardImageBg = ref.watch(coinCardProvider(coin)) != null;
return Stack(
children: [
if (hasCardImageBg)
Container(
width: width,
height: height,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: FileImage(
File(
ref.watch(coinCardProvider(coin))!,
),
),
),
),
),
if (!hasCardImageBg)
Container(
width: width,
height: height,
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.colorForCoin(coin),
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
),
if (!hasCardImageBg)
Column(
children: [
const Spacer(),
SizedBox(
height: width * 0.3,
child: Row(
children: [
const Spacer(
flex: 9,
),
SvgPicture.asset(
Assets.svg.ellipse2,
height: width * 0.3,
),
// ),
const Spacer(
flex: 2,
),
],
),
),
],
),
if (!hasCardImageBg)
Row(
children: [
const Spacer(
flex: 5,
),
SizedBox(
width: width * 0.45,
child: Column(
children: [
SvgPicture.asset(
Assets.svg.ellipse1,
width: width * 0.45,
),
const Spacer(),
],
),
),
const Spacer(
flex: 1,
),
],
),
],
);
}
}