desktop address list card styling

This commit is contained in:
julian 2023-04-02 13:48:14 -06:00
parent afea310ba4
commit 75bfad3471
3 changed files with 93 additions and 119 deletions

View file

@ -1,13 +1,17 @@
import 'dart:async'; import 'dart:async';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:isar/isar.dart'; import 'package:isar/isar.dart';
import 'package:stackwallet/db/main_db.dart'; import 'package:stackwallet/db/main_db.dart';
import 'package:stackwallet/models/isar/models/isar_models.dart'; import 'package:stackwallet/models/isar/models/isar_models.dart';
import 'package:stackwallet/pages/receive_view/addresses/address_tag.dart'; import 'package:stackwallet/pages/receive_view/addresses/address_tag.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/clipboard_interface.dart'; import 'package:stackwallet/utilities/clipboard_interface.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/util.dart';
import 'package:stackwallet/widgets/conditional_parent.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart';
class AddressCard extends StatefulWidget { class AddressCard extends StatefulWidget {
@ -31,6 +35,8 @@ class AddressCard extends StatefulWidget {
} }
class _AddressCardState extends State<AddressCard> { class _AddressCardState extends State<AddressCard> {
final isDesktop = Util.isDesktop;
late Stream<AddressLabel?> stream; late Stream<AddressLabel?> stream;
late final Address address; late final Address address;
@ -74,7 +80,25 @@ class _AddressCardState extends State<AddressCard> {
label = snapshot.data!; label = snapshot.data!;
} }
return Column( return ConditionalParent(
condition: isDesktop,
builder: (child) => Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SvgPicture.asset(
Assets.svg.iconFor(coin: widget.coin),
width: 32,
height: 32,
),
const SizedBox(
width: 12,
),
Expanded(
child: child,
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
if (label!.value.isNotEmpty) if (label!.value.isNotEmpty)
@ -83,25 +107,9 @@ class _AddressCardState extends State<AddressCard> {
style: STextStyles.itemSubtitle(context), style: STextStyles.itemSubtitle(context),
textAlign: TextAlign.left, textAlign: TextAlign.left,
), ),
// Row(
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
// children: [
//
// CustomTextButton(
// text: "Edit label",
// textSize: 14,
// onTap: () {
// Navigator.of(context).pushNamed(
// EditAddressLabelView.routeName,
// arguments: label!.id,
// );
// },
// ),
// ],
// ),
if (label!.value.isNotEmpty) if (label!.value.isNotEmpty)
const SizedBox( SizedBox(
height: 8, height: isDesktop ? 2 : 8,
), ),
Row( Row(
children: [ children: [
@ -116,7 +124,6 @@ class _AddressCardState extends State<AddressCard> {
const SizedBox( const SizedBox(
height: 10, height: 10,
), ),
if (label!.tags != null && label!.tags!.isNotEmpty) if (label!.tags != null && label!.tags!.isNotEmpty)
Wrap( Wrap(
spacing: 10, spacing: 10,
@ -129,60 +136,8 @@ class _AddressCardState extends State<AddressCard> {
) )
.toList(), .toList(),
), ),
// Row(
// children: [
// Expanded(
// child: SecondaryButton(
// label: "Copy address",
// icon: CopyIcon(
// color: Theme.of(context)
// .extension<StackColors>()!
// .buttonTextSecondary,
// ),
// onPressed: () async {
// await widget.clipboard.setData(
// ClipboardData(
// text: address.value,
// ),
// );
// if (mounted) {
// unawaited(
// showFloatingFlushBar(
// type: FlushBarType.info,
// message: "Copied to clipboard",
// context: context,
// ),
// );
// }
// },
// ),
// ),
// const SizedBox(
// width: 12,
// ),
// Expanded(
// child: SecondaryButton(
// label: "Show QR Code",
// icon: QrCodeIcon(
// color: Theme.of(context)
// .extension<StackColors>()!
// .buttonTextSecondary,
// ),
// onPressed: () {
// showDialog<void>(
// context: context,
// builder: (context) => AddressQrPopup(
// addressString: address.value,
// coin: widget.coin,
// clipboard: widget.clipboard,
// ),
// );
// },
// ),
// ),
// ],
// )
], ],
),
); );
}, },
), ),

View file

@ -13,6 +13,7 @@ import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/utilities/util.dart';
import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart';
import 'package:stackwallet/widgets/stack_text_field.dart'; import 'package:stackwallet/widgets/stack_text_field.dart';
import 'package:stackwallet/widgets/textfield_icon_button.dart'; import 'package:stackwallet/widgets/textfield_icon_button.dart';
@ -196,23 +197,35 @@ class _DesktopAddressListState extends ConsumerState<DesktopAddressList> {
height: isDesktop ? 20 : 16, height: isDesktop ? 20 : 16,
), ),
Expanded( Expanded(
child: SingleChildScrollView(
child: RoundedWhiteContainer(
padding: EdgeInsets.zero,
child: ListView.separated( child: ListView.separated(
shrinkWrap: true, shrinkWrap: true,
itemCount: ids.length, itemCount: ids.length,
separatorBuilder: (_, __) => Container( separatorBuilder: (_, __) => Container(
height: 10, height: 1,
color: Theme.of(context)
.extension<StackColors>()!
.backgroundAppBar,
), ),
itemBuilder: (_, index) => AddressCard( itemBuilder: (_, index) => Padding(
padding: const EdgeInsets.all(4),
child: AddressCard(
key: Key("addressCardDesktop_key_${ids[index]}"), key: Key("addressCardDesktop_key_${ids[index]}"),
walletId: widget.walletId, walletId: widget.walletId,
addressId: ids[index], addressId: ids[index],
coin: coin, coin: coin,
onPressed: () { onPressed: () {
ref.read(desktopSelectedAddressId.state).state = ids[index]; ref.read(desktopSelectedAddressId.state).state =
ids[index];
}, },
), ),
), ),
), ),
),
),
),
], ],
); );
} }

View file

@ -31,6 +31,12 @@ class RoundedContainer extends StatelessWidget {
return ConditionalParent( return ConditionalParent(
condition: onPressed != null, condition: onPressed != null,
builder: (child) => RawMaterialButton( builder: (child) => RawMaterialButton(
fillColor: color,
elevation: 0,
highlightElevation: 0,
disabledElevation: 0,
hoverElevation: 0,
focusElevation: 0,
padding: const EdgeInsets.all(0), padding: const EdgeInsets.all(0),
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder( shape: RoundedRectangleBorder(
@ -45,7 +51,7 @@ class RoundedContainer extends StatelessWidget {
width: width, width: width,
height: height, height: height,
decoration: BoxDecoration( decoration: BoxDecoration(
color: color, color: onPressed != null ? Colors.transparent : color,
borderRadius: BorderRadius.circular( borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius * radiusMultiplier, Constants.size.circularBorderRadius * radiusMultiplier,
), ),