desktop emoji select

This commit is contained in:
julian 2022-11-17 12:56:10 -06:00
parent 682966dab8
commit 11735cdaf7
2 changed files with 151 additions and 169 deletions

View file

@ -191,33 +191,33 @@ class _AddAddressBookEntryViewState
style: STextStyles.desktopH3(context),
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;
});
},
),
// 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;
// });
// },
// ),
],
),
),
@ -228,7 +228,8 @@ class _AddAddressBookEntryViewState
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: child,
)),
),
),
],
);
},
@ -292,66 +293,17 @@ class _AddAddressBookEntryViewState
: showDialog<dynamic>(
context: context,
builder: (context) {
return DesktopDialog(
return const 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,
maxWidth: 600,
child: Padding(
padding: EdgeInsets.only(
left: 32,
right: 20,
top: 32,
bottom: 32,
),
),
],
),
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(),
),
],
),
),
),
);
},
),
),
],
child: EmojiSelectSheet(),
),
);
}).then((value) {

View file

@ -4,6 +4,9 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:stackwallet/utilities/constants.dart';
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/conditional_parent.dart';
import 'package:stackwallet/widgets/desktop/secondary_button.dart';
class EmojiSelectSheet extends ConsumerWidget {
const EmojiSelectSheet({
@ -16,7 +19,9 @@ class EmojiSelectSheet extends ConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
final size = MediaQuery.of(context).size;
final isDesktop = Util.isDesktop;
final size = isDesktop ? const Size(600, 700) : MediaQuery.of(context).size;
final double maxHeight = size.height * 0.60;
final double availableWidth = size.width - (2 * horizontalPadding);
final int emojisPerRow =
@ -24,7 +29,9 @@ class EmojiSelectSheet extends ConsumerWidget {
final itemCount = Emoji.all().length;
return Container(
return ConditionalParent(
condition: !isDesktop,
builder: (child) => Container(
decoration: BoxDecoration(
color: Theme.of(context).extension<StackColors>()!.popupBG,
borderRadius: const BorderRadius.vertical(
@ -40,10 +47,15 @@ class EmojiSelectSheet extends ConsumerWidget {
top: 10,
bottom: 0,
),
child: child,
),
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
if (!isDesktop)
Center(
child: Container(
decoration: BoxDecoration(
@ -58,16 +70,19 @@ class EmojiSelectSheet extends ConsumerWidget {
height: 4,
),
),
if (!isDesktop)
const SizedBox(
height: 36,
),
Text(
"Select emoji",
style: STextStyles.pageTitleH2(context),
style: isDesktop
? STextStyles.desktopH3(context)
: STextStyles.pageTitleH2(context),
textAlign: TextAlign.left,
),
const SizedBox(
height: 16,
SizedBox(
height: isDesktop ? 28 : 16,
),
Flexible(
child: Row(
@ -92,7 +107,12 @@ class EmojiSelectSheet extends ConsumerWidget {
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(emoji.char),
child: Text(
emoji.char,
style: isDesktop
? STextStyles.desktopTextSmall(context)
: null,
),
),
),
);
@ -102,12 +122,22 @@ class EmojiSelectSheet extends ConsumerWidget {
],
),
),
const SizedBox(
height: 24,
SizedBox(
height: isDesktop ? 20 : 24,
),
if (isDesktop)
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
SecondaryButton(
label: "Cancel",
width: 248,
buttonHeight: ButtonHeight.l,
onPressed: Navigator.of(context).pop,
),
],
),
),
],
),
);
}