bachelor/wonders
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Home menu now scrolls when it runs out of min-height

Browse Source
This commit is contained in:
Shawn 2023-04-11 14:44:29 -06:00
parent 3e6df3e8b0
commit 96734a070f
1 changed files with 72 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
lib/ui/screens/home_menu/home_menu.dart
View File

@ -18,6 +18,8 @@ class HomeMenu extends StatefulWidget {
}
class _HomeMenuState extends State<HomeMenu> {
double _btnSize(BuildContext context) => (context.sizePx.shortestSide / 5).clamp(60, 100);
void _handleAboutPressed(BuildContext context) async {
PackageInfo packageInfo = await PackageInfo.fromPlatform();
if (!mounted) return;
@ -48,7 +50,7 @@ class _HomeMenuState extends State<HomeMenu> {
@override
Widget build(BuildContext context) {
final double gridWidth = (context.heightPx / 2).clamp(200, 350);
final double gridWidth = _btnSize(context) * 3 * 1.2;
return Stack(
children: [
/// Backdrop / Underlay
@ -66,58 +68,60 @@ class _HomeMenuState extends State<HomeMenu> {
),
/// Content
Positioned.fill(
child: SafeArea(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: $styles.insets.lg).copyWith(top: $styles.insets.lg),
SafeArea(
child: Center(
child: SizedBox(
width: gridWidth,
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
child: ExpandedScrollingColumn(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Gap(50),
Gap($styles.insets.md),
Spacer(),
_buildIconGrid(context)
.animate()
.fade(duration: $styles.times.fast)
.scale(begin: .8, curve: Curves.easeOut),
Gap($styles.insets.lg),
_buildBottomBtns(context),
Spacer(),
//Spacer(),
Gap($styles.insets.md),
],
),
),
),
),
),
),
],
);
}
Widget _buildIconGrid(BuildContext context) {
return GridView.count(
physics: NeverScrollableScrollPhysics(),
crossAxisCount: 3,
clipBehavior: Clip.none,
shrinkWrap: true,
crossAxisSpacing: $styles.insets.sm,
mainAxisSpacing: $styles.insets.sm,
Widget buildRow(List<Widget> children) => SeparatedRow(
mainAxisAlignment: MainAxisAlignment.center,
separatorBuilder: () => Gap($styles.insets.sm),
children: children,
);
return SeparatedColumn(
separatorBuilder: () => Gap($styles.insets.sm),
mainAxisSize: MainAxisSize.min,
children: [
buildRow([
_buildGridBtn(context, wondersLogic.all[0]),
_buildGridBtn(context, wondersLogic.all[1]),
_buildGridBtn(context, wondersLogic.all[2]),
]),
buildRow([
_buildGridBtn(context, wondersLogic.all[3]),
Padding(
padding: EdgeInsets.all($styles.insets.sm),
SizedBox(
width: _btnSize(context),
child: SvgPicture.asset(SvgPaths.compassFull, color: $styles.colors.offWhite),
),
_buildGridBtn(context, wondersLogic.all[4]),
]),
buildRow([
_buildGridBtn(context, wondersLogic.all[5]),
_buildGridBtn(context, wondersLogic.all[6]),
_buildGridBtn(context, wondersLogic.all[7]),
]),
],
);
}
@ -156,9 +160,9 @@ class _HomeMenuState extends State<HomeMenu> {
Widget _buildGridBtn(BuildContext context, WonderData btnData) {
bool isSelected = btnData == widget.data;
return AspectRatio(
aspectRatio: 1,
child: Container(
return Container(
width: _btnSize(context),
height: _btnSize(context),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular($styles.corners.md),
boxShadow: !isSelected
@ -180,8 +184,7 @@ class _HomeMenuState extends State<HomeMenu> {
onPressed: () => _handleWonderPressed(context, btnData),
padding: EdgeInsets.zero,
semanticLabel: btnData.title,
child: SizedBox.expand(child: Image.asset(btnData.type.homeBtn, fit: BoxFit.cover)),
),
child: Image.asset(btnData.type.homeBtn, fit: BoxFit.cover),
),
),
);