Hide all home page content when showing home_menu

This commit is contained in:
Shawn 2022-10-27 10:23:52 -06:00
parent 60d65e8191
commit 1a34f14967

View File

@ -233,87 +233,87 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
/// Floating controls / UI /// Floating controls / UI
AnimatedSwitcher( AnimatedSwitcher(
duration: $styles.times.fast, duration: $styles.times.fast,
child: RepaintBoundary( child: AnimatedOpacity(
child: OverflowBox( opacity: _isMenuOpen ? 0 : 1,
child: Column( duration: $styles.times.med,
mainAxisSize: MainAxisSize.min, child: RepaintBoundary(
children: [ child: OverflowBox(
SizedBox(width: double.infinity), child: Column(
const Spacer(), mainAxisSize: MainAxisSize.min,
children: [
SizedBox(width: double.infinity),
const Spacer(),
/// Title Content /// Title Content
LightText( LightText(
child: IgnorePointer( child: IgnorePointer(
ignoringSemantics: false, ignoringSemantics: false,
child: Transform.translate( child: Transform.translate(
offset: Offset(0, 30), offset: Offset(0, 30),
child: Column( child: Column(
children: [ children: [
Semantics( Semantics(
liveRegion: true, liveRegion: true,
button: true, button: true,
header: true, header: true,
onIncrease: () => _setPageIndex(_wonderIndex + 1), onIncrease: () => _setPageIndex(_wonderIndex + 1),
onDecrease: () => _setPageIndex(_wonderIndex - 1), onDecrease: () => _setPageIndex(_wonderIndex - 1),
onTap: () => _showDetailsPage(), onTap: () => _showDetailsPage(),
// Hide the title when the menu is open for visual polish // Hide the title when the menu is open for visual polish
child: AnimatedOpacity(
opacity: _isMenuOpen ? 0 : 1,
duration: $styles.times.fast,
child: WonderTitleText(currentWonder, enableShadows: true), child: WonderTitleText(currentWonder, enableShadows: true),
), ),
), Gap($styles.insets.md),
Gap($styles.insets.md), AppPageIndicator(
AppPageIndicator( count: _numWonders,
count: _numWonders, controller: _pageController,
controller: _pageController, color: $styles.colors.white,
color: $styles.colors.white, dotSize: 8,
dotSize: 8, onDotPressed: _handlePageIndicatorDotPressed,
onDotPressed: _handlePageIndicatorDotPressed, semanticPageTitle: $strings.homeSemanticWonder,
semanticPageTitle: $strings.homeSemanticWonder, ),
), Gap($styles.insets.md),
Gap($styles.insets.md), ],
], ),
), ),
), ),
), ),
),
/// Animated arrow and background /// Animated arrow and background
/// Wrap in a container that is full-width to make it easier to find for screen readers /// Wrap in a container that is full-width to make it easier to find for screen readers
Container( Container(
width: double.infinity, width: double.infinity,
alignment: Alignment.center, alignment: Alignment.center,
/// Lose state of child objects when index changes, this will re-run all the animated switcher and the arrow anim /// Lose state of child objects when index changes, this will re-run all the animated switcher and the arrow anim
key: ValueKey(_wonderIndex), key: ValueKey(_wonderIndex),
child: Stack( child: Stack(
children: [ children: [
/// Expanding rounded rect that grows in height as user swipes up /// Expanding rounded rect that grows in height as user swipes up
Positioned.fill( Positioned.fill(
child: _swipeController.buildListener( child: _swipeController.buildListener(
builder: (swipeAmt, _, child) { builder: (swipeAmt, _, child) {
double heightFactor = .5 + .5 * (1 + swipeAmt * 4); double heightFactor = .5 + .5 * (1 + swipeAmt * 4);
return FractionallySizedBox( return FractionallySizedBox(
alignment: Alignment.bottomCenter, alignment: Alignment.bottomCenter,
heightFactor: heightFactor, heightFactor: heightFactor,
child: Opacity(opacity: swipeAmt * .5, child: child), child: Opacity(opacity: swipeAmt * .5, child: child),
); );
}, },
child: VtGradient( child: VtGradient(
[$styles.colors.white.withOpacity(0), $styles.colors.white.withOpacity(1)], [$styles.colors.white.withOpacity(0), $styles.colors.white.withOpacity(1)],
const [.3, 1], const [.3, 1],
borderRadius: BorderRadius.circular(99), borderRadius: BorderRadius.circular(99),
), ),
)), )),
/// Arrow Btn that fades in and out /// Arrow Btn that fades in and out
_AnimatedArrowButton(onTap: _showDetailsPage, semanticTitle: currentWonder.title), _AnimatedArrowButton(onTap: _showDetailsPage, semanticTitle: currentWonder.title),
], ],
),
), ),
), Gap($styles.insets.md),
Gap($styles.insets.md), ],
], ),
), ),
), ),
), ),