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 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:isar/isar.dart';
import 'package:stackwallet/db/main_db.dart';
import 'package:stackwallet/models/isar/models/isar_models.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/enums/coin_enum.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';
class AddressCard extends StatefulWidget {
@ -31,6 +35,8 @@ class AddressCard extends StatefulWidget {
}
class _AddressCardState extends State<AddressCard> {
final isDesktop = Util.isDesktop;
late Stream<AddressLabel?> stream;
late final Address address;
@ -74,115 +80,64 @@ class _AddressCardState extends State<AddressCard> {
label = snapshot.data!;
}
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (label!.value.isNotEmpty)
Text(
label!.value,
style: STextStyles.itemSubtitle(context),
textAlign: TextAlign.left,
return ConditionalParent(
condition: isDesktop,
builder: (child) => Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SvgPicture.asset(
Assets.svg.iconFor(coin: widget.coin),
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(
height: 8,
width: 12,
),
Row(
children: [
Expanded(
child: Text(
address.value,
style: STextStyles.itemSubtitle12(context),
),
Expanded(
child: child,
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (label!.value.isNotEmpty)
Text(
label!.value,
style: STextStyles.itemSubtitle(context),
textAlign: TextAlign.left,
),
],
),
const SizedBox(
height: 10,
),
if (label!.tags != null && label!.tags!.isNotEmpty)
Wrap(
spacing: 10,
runSpacing: 10,
children: label!.tags!
.map(
(e) => AddressTag(
tag: e,
),
)
.toList(),
if (label!.value.isNotEmpty)
SizedBox(
height: isDesktop ? 2 : 8,
),
Row(
children: [
Expanded(
child: Text(
address.value,
style: STextStyles.itemSubtitle12(context),
),
),
],
),
// 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,
// ),
// );
// },
// ),
// ),
// ],
// )
],
const SizedBox(
height: 10,
),
if (label!.tags != null && label!.tags!.isNotEmpty)
Wrap(
spacing: 10,
runSpacing: 10,
children: label!.tags!
.map(
(e) => AddressTag(
tag: e,
),
)
.toList(),
),
],
),
);
},
),

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/util.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/textfield_icon_button.dart';
@ -196,20 +197,32 @@ class _DesktopAddressListState extends ConsumerState<DesktopAddressList> {
height: isDesktop ? 20 : 16,
),
Expanded(
child: ListView.separated(
shrinkWrap: true,
itemCount: ids.length,
separatorBuilder: (_, __) => Container(
height: 10,
),
itemBuilder: (_, index) => AddressCard(
key: Key("addressCardDesktop_key_${ids[index]}"),
walletId: widget.walletId,
addressId: ids[index],
coin: coin,
onPressed: () {
ref.read(desktopSelectedAddressId.state).state = ids[index];
},
child: SingleChildScrollView(
child: RoundedWhiteContainer(
padding: EdgeInsets.zero,
child: ListView.separated(
shrinkWrap: true,
itemCount: ids.length,
separatorBuilder: (_, __) => Container(
height: 1,
color: Theme.of(context)
.extension<StackColors>()!
.backgroundAppBar,
),
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(
condition: onPressed != null,
builder: (child) => RawMaterialButton(
fillColor: color,
elevation: 0,
highlightElevation: 0,
disabledElevation: 0,
hoverElevation: 0,
focusElevation: 0,
padding: const EdgeInsets.all(0),
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
@ -45,7 +51,7 @@ class RoundedContainer extends StatelessWidget {
width: width,
height: height,
decoration: BoxDecoration(
color: color,
color: onPressed != null ? Colors.transparent : color,
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius * radiusMultiplier,
),