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,115 +80,64 @@ class _AddressCardState extends State<AddressCard> {
label = snapshot.data!; label = snapshot.data!;
} }
return Column( return ConditionalParent(
crossAxisAlignment: CrossAxisAlignment.start, condition: isDesktop,
children: [ builder: (child) => Row(
if (label!.value.isNotEmpty) crossAxisAlignment: CrossAxisAlignment.start,
Text( children: [
label!.value, SvgPicture.asset(
style: STextStyles.itemSubtitle(context), Assets.svg.iconFor(coin: widget.coin),
textAlign: TextAlign.left, width: 32,
height: 32,
), ),
// 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)
const SizedBox( const SizedBox(
height: 8, width: 12,
), ),
Row( Expanded(
children: [ child: child,
Expanded( ),
child: Text( ],
address.value, ),
style: STextStyles.itemSubtitle12(context), child: Column(
), crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (label!.value.isNotEmpty)
Text(
label!.value,
style: STextStyles.itemSubtitle(context),
textAlign: TextAlign.left,
), ),
], if (label!.value.isNotEmpty)
), SizedBox(
const SizedBox( height: isDesktop ? 2 : 8,
height: 10, ),
), Row(
children: [
if (label!.tags != null && label!.tags!.isNotEmpty) Expanded(
Wrap( child: Text(
spacing: 10, address.value,
runSpacing: 10, style: STextStyles.itemSubtitle12(context),
children: label!.tags! ),
.map( ),
(e) => AddressTag( ],
tag: e,
),
)
.toList(),
), ),
// Row( const SizedBox(
// children: [ height: 10,
// Expanded( ),
// child: SecondaryButton( if (label!.tags != null && label!.tags!.isNotEmpty)
// label: "Copy address", Wrap(
// icon: CopyIcon( spacing: 10,
// color: Theme.of(context) runSpacing: 10,
// .extension<StackColors>()! children: label!.tags!
// .buttonTextSecondary, .map(
// ), (e) => AddressTag(
// onPressed: () async { tag: e,
// await widget.clipboard.setData( ),
// ClipboardData( )
// text: address.value, .toList(),
// ), ),
// ); ],
// 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,20 +197,32 @@ class _DesktopAddressListState extends ConsumerState<DesktopAddressList> {
height: isDesktop ? 20 : 16, height: isDesktop ? 20 : 16,
), ),
Expanded( Expanded(
child: ListView.separated( child: SingleChildScrollView(
shrinkWrap: true, child: RoundedWhiteContainer(
itemCount: ids.length, padding: EdgeInsets.zero,
separatorBuilder: (_, __) => Container( child: ListView.separated(
height: 10, shrinkWrap: true,
), itemCount: ids.length,
itemBuilder: (_, index) => AddressCard( separatorBuilder: (_, __) => Container(
key: Key("addressCardDesktop_key_${ids[index]}"), height: 1,
walletId: widget.walletId, color: Theme.of(context)
addressId: ids[index], .extension<StackColors>()!
coin: coin, .backgroundAppBar,
onPressed: () { ),
ref.read(desktopSelectedAddressId.state).state = ids[index]; itemBuilder: (_, index) => Padding(
}, padding: const EdgeInsets.all(4),
child: AddressCard(
key: Key("addressCardDesktop_key_${ids[index]}"),
walletId: widget.walletId,
addressId: ids[index],
coin: coin,
onPressed: () {
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,
), ),