desktop add contact popup tweaks

This commit is contained in:
julian 2022-11-17 13:15:57 -06:00
parent 11735cdaf7
commit 134087bfc4
2 changed files with 121 additions and 256 deletions

View file

@ -21,6 +21,8 @@ import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart'; import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart';
import 'package:stackwallet/widgets/desktop/desktop_dialog.dart'; import 'package:stackwallet/widgets/desktop/desktop_dialog.dart';
import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart'; import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart';
import 'package:stackwallet/widgets/desktop/primary_button.dart';
import 'package:stackwallet/widgets/desktop/secondary_button.dart';
import 'package:stackwallet/widgets/emoji_select_sheet.dart'; import 'package:stackwallet/widgets/emoji_select_sheet.dart';
import 'package:stackwallet/widgets/icon_widgets/x_icon.dart'; import 'package:stackwallet/widgets/icon_widgets/x_icon.dart';
import 'package:stackwallet/widgets/stack_text_field.dart'; import 'package:stackwallet/widgets/stack_text_field.dart';
@ -191,33 +193,6 @@ class _AddAddressBookEntryViewState
style: STextStyles.desktopH3(context), style: STextStyles.desktopH3(context),
textAlign: TextAlign.center, textAlign: TextAlign.center,
), ),
// const SizedBox(width: 10),
// AppBarIconButton(
// key:
// const Key("addAddressBookEntryFavoriteButtonKey"),
// size: 36,
// shadows: const [],
// color: Theme.of(context)
// .extension<StackColors>()!
// .background,
// icon: SvgPicture.asset(
// Assets.svg.star,
// color: _isFavorite
// ? Theme.of(context)
// .extension<StackColors>()!
// .favoriteStarActive
// : Theme.of(context)
// .extension<StackColors>()!
// .favoriteStarInactive,
// width: 20,
// height: 20,
// ),
// onPressed: () {
// setState(() {
// _isFavorite = !_isFavorite;
// });
// },
// ),
], ],
), ),
), ),
@ -226,7 +201,11 @@ class _AddAddressBookEntryViewState
), ),
Expanded( Expanded(
child: Padding( child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 10), padding: const EdgeInsets.only(
left: 10,
right: 10,
bottom: 32,
),
child: child, child: child,
), ),
), ),
@ -239,16 +218,17 @@ class _AddAddressBookEntryViewState
padding: const EdgeInsets.symmetric(horizontal: 12), padding: const EdgeInsets.symmetric(horizontal: 12),
child: SingleChildScrollView( child: SingleChildScrollView(
controller: scrollController, controller: scrollController,
padding: const EdgeInsets.only( padding: EdgeInsets.only(
// top: 8, // top: 8,
left: 4, left: 4,
right: 4, right: 4,
bottom: 16, bottom: isDesktop ? 0 : 16,
), ),
child: ConstrainedBox( child: ConstrainedBox(
constraints: BoxConstraints( constraints: BoxConstraints(
// subtract top and bottom padding set in parent // subtract top and bottom padding set in parent
minHeight: constraint.maxHeight - 16, // - 8, minHeight:
constraint.maxHeight - (isDesktop ? 0 : 16), // - 8,
), ),
child: IntrinsicHeight( child: IntrinsicHeight(
child: Column( child: Column(
@ -259,7 +239,12 @@ class _AddAddressBookEntryViewState
mainAxisAlignment: mainAxisAlignment:
MainAxisAlignment.spaceBetween, MainAxisAlignment.spaceBetween,
children: [ children: [
GestureDetector( SizedBox(
height: 56,
width: 56,
child: MouseRegion(
cursor: SystemMouseCursors.click,
child: GestureDetector(
onTap: () { onTap: () {
if (_selectedEmoji != null) { if (_selectedEmoji != null) {
setState(() { setState(() {
@ -268,29 +253,7 @@ class _AddAddressBookEntryViewState
return; return;
} }
///TODO if desktop make dialog showDialog<dynamic>(
!isDesktop
? showModalBottomSheet<dynamic>(
backgroundColor:
Colors.transparent,
context: context,
shape:
const RoundedRectangleBorder(
borderRadius:
BorderRadius.vertical(
top: Radius.circular(20),
),
),
builder: (_) =>
const EmojiSelectSheet(),
).then((value) {
if (value is Emoji) {
setState(() {
_selectedEmoji = value;
});
}
})
: showDialog<dynamic>(
context: context, context: context,
builder: (context) { builder: (context) {
return const DesktopDialog( return const DesktopDialog(
@ -314,9 +277,6 @@ class _AddAddressBookEntryViewState
} }
}); });
}, },
child: SizedBox(
height: 56,
width: 56,
child: Stack( child: Stack(
children: [ children: [
Container( Container(
@ -324,7 +284,7 @@ class _AddAddressBookEntryViewState
width: 56, width: 56,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: borderRadius:
BorderRadius.circular(24), BorderRadius.circular(100),
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textFieldActiveBG, .textFieldActiveBG,
@ -339,7 +299,8 @@ class _AddAddressBookEntryViewState
: Text( : Text(
_selectedEmoji!.char, _selectedEmoji!.char,
style: STextStyles style: STextStyles
.pageTitleH1(context), .pageTitleH1(
context),
), ),
), ),
), ),
@ -350,15 +311,18 @@ class _AddAddressBookEntryViewState
width: 14, width: 14,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: borderRadius:
BorderRadius.circular(14), BorderRadius.circular(
14),
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<
StackColors>()!
.accentColorDark), .accentColorDark),
child: Center( child: Center(
child: _selectedEmoji == null child: _selectedEmoji == null
? SvgPicture.asset( ? SvgPicture.asset(
Assets.svg.plus, Assets.svg.plus,
color: Theme.of(context) color: Theme.of(
context)
.extension< .extension<
StackColors>()! StackColors>()!
.textWhite, .textWhite,
@ -367,7 +331,8 @@ class _AddAddressBookEntryViewState
) )
: SvgPicture.asset( : SvgPicture.asset(
Assets.svg.thickX, Assets.svg.thickX,
color: Theme.of(context) color: Theme.of(
context)
.extension< .extension<
StackColors>()! StackColors>()!
.textWhite, .textWhite,
@ -381,6 +346,7 @@ class _AddAddressBookEntryViewState
), ),
), ),
), ),
),
const SizedBox(width: 8), const SizedBox(width: 8),
SizedBox( SizedBox(
width: isDesktop ? 450 : null, width: isDesktop ? 450 : null,
@ -453,16 +419,11 @@ class _AddAddressBookEntryViewState
return; return;
} }
///TODO if desktop make dialog showModalBottomSheet<dynamic>(
!isDesktop backgroundColor: Colors.transparent,
? showModalBottomSheet<dynamic>(
backgroundColor:
Colors.transparent,
context: context, context: context,
shape: shape: const RoundedRectangleBorder(
const RoundedRectangleBorder( borderRadius: BorderRadius.vertical(
borderRadius:
BorderRadius.vertical(
top: Radius.circular(20), top: Radius.circular(20),
), ),
), ),
@ -474,78 +435,6 @@ class _AddAddressBookEntryViewState
_selectedEmoji = value; _selectedEmoji = value;
}); });
} }
})
: showDialog<dynamic>(
context: context,
builder: (context) {
return DesktopDialog(
maxHeight: 700,
maxWidth: 700,
child: Column(
children: [
Row(
children: [
Padding(
padding:
const EdgeInsets
.all(32),
child: Text(
"Select emoji",
style: STextStyles
.desktopH3(
context),
textAlign:
TextAlign
.center,
),
),
],
),
Expanded(
child: LayoutBuilder(
builder: (context,
constraints) {
return SingleChildScrollView(
scrollDirection:
Axis.vertical,
child:
ConstrainedBox(
constraints:
BoxConstraints(
minHeight:
constraints
.maxHeight,
minWidth:
constraints
.maxWidth,
),
child:
IntrinsicHeight(
child: Column(
children: const [
Padding(
padding:
EdgeInsets.symmetric(horizontal: 32),
// child:
// EmojiSelectSheet(),
),
],
),
),
),
);
},
),
),
],
),
);
}).then((value) {
if (value is Emoji) {
setState(() {
_selectedEmoji = value;
});
}
}); });
}, },
child: SizedBox( child: SizedBox(
@ -734,22 +623,16 @@ class _AddAddressBookEntryViewState
Row( Row(
children: [ children: [
Expanded( Expanded(
child: TextButton( child: SecondaryButton(
style: Theme.of(context) label: "Cancel",
.extension<StackColors>()! buttonHeight: isDesktop ? ButtonHeight.m : null,
.getSecondaryEnabledButtonColor(context),
child: Text(
"Cancel",
style: STextStyles.button(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.accentColorDark),
),
onPressed: () async { onPressed: () async {
if (FocusScope.of(context).hasFocus) { if (!isDesktop &&
FocusScope.of(context).hasFocus) {
FocusScope.of(context).unfocus(); FocusScope.of(context).unfocus();
await Future<void>.delayed( await Future<void>.delayed(
const Duration(milliseconds: 75)); const Duration(milliseconds: 75),
);
} }
if (mounted) { if (mounted) {
Navigator.of(context).pop(); Navigator.of(context).pop();
@ -776,16 +659,11 @@ class _AddAddressBookEntryViewState
bool shouldEnableSave = bool shouldEnableSave =
validForms && nameExists; validForms && nameExists;
return TextButton( return PrimaryButton(
style: shouldEnableSave label: "Save",
? Theme.of(context) buttonHeight:
.extension<StackColors>()! isDesktop ? ButtonHeight.m : null,
.getPrimaryEnabledButtonColor( enabled: shouldEnableSave,
context)
: Theme.of(context)
.extension<StackColors>()!
.getPrimaryDisabledButtonColor(
context),
onPressed: shouldEnableSave onPressed: shouldEnableSave
? () async { ? () async {
if (FocusScope.of(context) if (FocusScope.of(context)
@ -827,19 +705,6 @@ class _AddAddressBookEntryViewState
} }
} }
: null, : null,
child: Text(
"Save",
style:
STextStyles.button(context).copyWith(
color: shouldEnableSave
? Theme.of(context)
.extension<StackColors>()!
.buttonTextPrimary
: Theme.of(context)
.extension<StackColors>()!
.buttonTextPrimaryDisabled,
),
),
); );
}, },
), ),

View file

@ -253,7 +253,7 @@ class _NewContactAddressEntryFormState
}, },
child: const ClipboardIcon(), child: const ClipboardIcon(),
), ),
if (ref.watch(addressEntryDataProvider(widget.id) if (!Util.isDesktop && ref.watch(addressEntryDataProvider(widget.id)
.select((value) => value.address)) == .select((value) => value.address)) ==
null) null)
TextFieldIconButton( TextFieldIconButton(