mirror of
https://github.com/cypherstack/stack_wallet.git
synced 2025-02-02 11:16:36 +00:00
desktop add contact popup tweaks
This commit is contained in:
julian
parent
11735cdaf7
commit
134087bfc4
2 changed files with 121 additions and 256 deletions
|
|
@ -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,38 +239,21 @@ class _AddAddressBookEntryViewState
|
||||||
mainAxisAlignment:
|
mainAxisAlignment:
|
||||||
MainAxisAlignment.spaceBetween,
|
MainAxisAlignment.spaceBetween,
|
||||||
children: [
|
children: [
|
||||||
GestureDetector(
|
SizedBox(
|
||||||
onTap: () {
|
height: 56,
|
||||||
if (_selectedEmoji != null) {
|
width: 56,
|
||||||
setState(() {
|
child: MouseRegion(
|
||||||
_selectedEmoji = null;
|
cursor: SystemMouseCursors.click,
|
||||||
});
|
child: GestureDetector(
|
||||||
return;
|
onTap: () {
|
||||||
}
|
if (_selectedEmoji != null) {
|
||||||
|
setState(() {
|
||||||
|
_selectedEmoji = null;
|
||||||
|
});
|
||||||
|
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(
|
||||||
|
|
@ -307,77 +270,80 @@ class _AddAddressBookEntryViewState
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}).then((value) {
|
}).then((value) {
|
||||||
if (value is Emoji) {
|
if (value is Emoji) {
|
||||||
setState(() {
|
setState(() {
|
||||||
_selectedEmoji = value;
|
_selectedEmoji = value;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
child: SizedBox(
|
child: Stack(
|
||||||
height: 56,
|
children: [
|
||||||
width: 56,
|
Container(
|
||||||
child: Stack(
|
height: 56,
|
||||||
children: [
|
width: 56,
|
||||||
Container(
|
|
||||||
height: 56,
|
|
||||||
width: 56,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
borderRadius:
|
|
||||||
BorderRadius.circular(24),
|
|
||||||
color: Theme.of(context)
|
|
||||||
.extension<StackColors>()!
|
|
||||||
.textFieldActiveBG,
|
|
||||||
),
|
|
||||||
child: Center(
|
|
||||||
child: _selectedEmoji == null
|
|
||||||
? SvgPicture.asset(
|
|
||||||
Assets.svg.user,
|
|
||||||
height: 30,
|
|
||||||
width: 30,
|
|
||||||
)
|
|
||||||
: Text(
|
|
||||||
_selectedEmoji!.char,
|
|
||||||
style: STextStyles
|
|
||||||
.pageTitleH1(context),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Align(
|
|
||||||
alignment: Alignment.bottomRight,
|
|
||||||
child: Container(
|
|
||||||
height: 14,
|
|
||||||
width: 14,
|
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
borderRadius:
|
borderRadius:
|
||||||
BorderRadius.circular(14),
|
BorderRadius.circular(100),
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.extension<StackColors>()!
|
.extension<StackColors>()!
|
||||||
.accentColorDark),
|
.textFieldActiveBG,
|
||||||
|
),
|
||||||
child: Center(
|
child: Center(
|
||||||
child: _selectedEmoji == null
|
child: _selectedEmoji == null
|
||||||
? SvgPicture.asset(
|
? SvgPicture.asset(
|
||||||
Assets.svg.plus,
|
Assets.svg.user,
|
||||||
color: Theme.of(context)
|
height: 30,
|
||||||
.extension<
|
width: 30,
|
||||||
StackColors>()!
|
|
||||||
.textWhite,
|
|
||||||
width: 12,
|
|
||||||
height: 12,
|
|
||||||
)
|
)
|
||||||
: SvgPicture.asset(
|
: Text(
|
||||||
Assets.svg.thickX,
|
_selectedEmoji!.char,
|
||||||
color: Theme.of(context)
|
style: STextStyles
|
||||||
.extension<
|
.pageTitleH1(
|
||||||
StackColors>()!
|
context),
|
||||||
.textWhite,
|
|
||||||
width: 8,
|
|
||||||
height: 8,
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
)
|
Align(
|
||||||
],
|
alignment: Alignment.bottomRight,
|
||||||
|
child: Container(
|
||||||
|
height: 14,
|
||||||
|
width: 14,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.circular(
|
||||||
|
14),
|
||||||
|
color: Theme.of(context)
|
||||||
|
.extension<
|
||||||
|
StackColors>()!
|
||||||
|
.accentColorDark),
|
||||||
|
child: Center(
|
||||||
|
child: _selectedEmoji == null
|
||||||
|
? SvgPicture.asset(
|
||||||
|
Assets.svg.plus,
|
||||||
|
color: Theme.of(
|
||||||
|
context)
|
||||||
|
.extension<
|
||||||
|
StackColors>()!
|
||||||
|
.textWhite,
|
||||||
|
width: 12,
|
||||||
|
height: 12,
|
||||||
|
)
|
||||||
|
: SvgPicture.asset(
|
||||||
|
Assets.svg.thickX,
|
||||||
|
color: Theme.of(
|
||||||
|
context)
|
||||||
|
.extension<
|
||||||
|
StackColors>()!
|
||||||
|
.textWhite,
|
||||||
|
width: 8,
|
||||||
|
height: 8,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|
@ -453,100 +419,23 @@ class _AddAddressBookEntryViewState
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
///TODO if desktop make dialog
|
showModalBottomSheet<dynamic>(
|
||||||
!isDesktop
|
backgroundColor: Colors.transparent,
|
||||||
? showModalBottomSheet<dynamic>(
|
context: context,
|
||||||
backgroundColor:
|
shape: const RoundedRectangleBorder(
|
||||||
Colors.transparent,
|
borderRadius: BorderRadius.vertical(
|
||||||
context: context,
|
top: Radius.circular(20),
|
||||||
shape:
|
),
|
||||||
const RoundedRectangleBorder(
|
),
|
||||||
borderRadius:
|
builder: (_) =>
|
||||||
BorderRadius.vertical(
|
const EmojiSelectSheet(),
|
||||||
top: Radius.circular(20),
|
).then((value) {
|
||||||
),
|
if (value is Emoji) {
|
||||||
),
|
setState(() {
|
||||||
builder: (_) =>
|
_selectedEmoji = value;
|
||||||
const EmojiSelectSheet(),
|
});
|
||||||
).then((value) {
|
}
|
||||||
if (value is Emoji) {
|
});
|
||||||
setState(() {
|
|
||||||
_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(
|
||||||
height: 48,
|
height: 48,
|
||||||
|
|
@ -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,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
|
|
||||||
|
|
@ -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(
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue