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