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

Hoist tabPress logic to the screen level. Move go() call to onTap from onChange. prevents errors during route changes.

Browse Source
This commit is contained in:
Shawn 2024-01-17 10:50:43 -07:00
parent c450c71d05
commit 537d2ed9e4
2 changed files with 25 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
lib/ui/screens/wonder_details/wonder_details_tab_menu.dart
View File

@ -6,13 +6,14 @@ class WonderDetailsTabMenu extends StatelessWidget {
static const double minTabSize = 25; static const double minTabSize = 25;
static const double maxTabSize = 100; static const double maxTabSize = 100;
const WonderDetailsTabMenu( const WonderDetailsTabMenu({
{Key? key, Key? key,
required this.tabController, required this.tabController,
this.showBg = false, this.showBg = false,
required this.wonderType, required this.wonderType,
this.axis = Axis.horizontal}) this.axis = Axis.horizontal,
: super(key: key); required this.onTap,
}) : super(key: key);
final TabController tabController; final TabController tabController;
final bool showBg; final bool showBg;
@ -20,6 +21,8 @@ class WonderDetailsTabMenu extends StatelessWidget {
final Axis axis; final Axis axis;
bool get isVertical => axis == Axis.vertical; bool get isVertical => axis == Axis.vertical;
final void Function(int index) onTap;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
Color iconColor = showBg ? $styles.colors.black : $styles.colors.white; Color iconColor = showBg ? $styles.colors.black : $styles.colors.white;
@ -103,6 +106,7 @@ class WonderDetailsTabMenu extends StatelessWidget {
color: iconColor, color: iconColor,
axis: axis, axis: axis,
mainAxisSize: tabBtnSize, mainAxisSize: tabBtnSize,
onTap: onTap,
), ),
_TabBtn( _TabBtn(
1, 1,
@ -112,6 +116,7 @@ class WonderDetailsTabMenu extends StatelessWidget {
color: iconColor, color: iconColor,
axis: axis, axis: axis,
mainAxisSize: tabBtnSize, mainAxisSize: tabBtnSize,
onTap: onTap,
), ),
_TabBtn( _TabBtn(
2, 2,
@ -121,6 +126,7 @@ class WonderDetailsTabMenu extends StatelessWidget {
color: iconColor, color: iconColor,
axis: axis, axis: axis,
mainAxisSize: tabBtnSize, mainAxisSize: tabBtnSize,
onTap: onTap,
), ),
_TabBtn( _TabBtn(
3, 3,
@ -130,6 +136,7 @@ class WonderDetailsTabMenu extends StatelessWidget {
color: iconColor, color: iconColor,
axis: axis, axis: axis,
mainAxisSize: tabBtnSize, mainAxisSize: tabBtnSize,
onTap: onTap,
), ),
]), ]),
), ),
@ -184,6 +191,7 @@ class _TabBtn extends StatelessWidget {
required this.label, required this.label,
required this.axis, required this.axis,
required this.mainAxisSize, required this.mainAxisSize,
required this.onTap,
}) : super(key: key); }) : super(key: key);
static const double crossBtnSize = 60; static const double crossBtnSize = 60;
@ -195,14 +203,12 @@ class _TabBtn extends StatelessWidget {
final String label; final String label;
final Axis axis; final Axis axis;
final double mainAxisSize; final double mainAxisSize;
final void Function(int index) onTap;
bool get _isVertical => axis == Axis.vertical; bool get _isVertical => axis == Axis.vertical;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
// return _isVertical
// ? SizedBox(height: mainAxisSize, width: crossBtnSize, child: Placeholder())
// : SizedBox(height: crossBtnSize, width: mainAxisSize, child: Placeholder());
bool selected = tabController.index == index; bool selected = tabController.index == index;
final MaterialLocalizations localizations = MaterialLocalizations.of(context); final MaterialLocalizations localizations = MaterialLocalizations.of(context);
final iconImgPath = '${ImagePaths.common}/tab-$iconImg${selected ? '-active' : ''}.png'; final iconImgPath = '${ImagePaths.common}/tab-$iconImg${selected ? '-active' : ''}.png';
@ -217,7 +223,7 @@ class _TabBtn extends StatelessWidget {
label: tabLabel, label: tabLabel,
child: ExcludeSemantics( child: ExcludeSemantics(
child: AppBtn.basic( child: AppBtn.basic(
onPressed: () => tabController.index = index, onPressed: () => onTap(index),
semanticLabel: label, semanticLabel: label,
minimumSize: _isVertical ? Size(crossBtnSize, mainAxisSize) : Size(mainAxisSize, crossBtnSize), minimumSize: _isVertical ? Size(crossBtnSize, mainAxisSize) : Size(mainAxisSize, crossBtnSize),
// Image icon // Image icon

9
lib/ui/screens/wonder_details/wonders_details_screen.dart
View File

@ -1,3 +1,5 @@
import 'dart:async';
import 'package:wonders/common_libs.dart'; import 'package:wonders/common_libs.dart';
import 'package:wonders/ui/common/lazy_indexed_stack.dart'; import 'package:wonders/ui/common/lazy_indexed_stack.dart';
import 'package:wonders/ui/common/measurable_widget.dart'; import 'package:wonders/ui/common/measurable_widget.dart';
@ -43,11 +45,15 @@ class _WonderDetailsScreenState extends State<WonderDetailsScreen>
} }
void _handleTabChanged() { void _handleTabChanged() {
context.go(ScreenPaths.wonderDetails(widget.type, tabIndex: _tabController.index));
_fade?.forward(from: 0); _fade?.forward(from: 0);
setState(() {}); setState(() {});
} }
void _handleTabTapped(int index) {
_tabController.index = index;
context.go(ScreenPaths.wonderDetails(widget.type, tabIndex: _tabController.index));
}
void _handleTabMenuSized(Size size) { void _handleTabMenuSized(Size size) {
setState(() { setState(() {
_tabBarSize = (_useNavRail ? size.width : size.height) - WonderDetailsTabMenu.buttonInset; _tabBarSize = (_useNavRail ? size.width : size.height) - WonderDetailsTabMenu.buttonInset;
@ -85,6 +91,7 @@ class _WonderDetailsScreenState extends State<WonderDetailsScreen>
onChange: _handleTabMenuSized, onChange: _handleTabMenuSized,
child: WonderDetailsTabMenu( child: WonderDetailsTabMenu(
tabController: _tabController, tabController: _tabController,
onTap: _handleTabTapped,
wonderType: wonder.type, wonderType: wonder.type,
showBg: showTabBarBg, showBg: showTabBarBg,
axis: _useNavRail ? Axis.vertical : Axis.horizontal), axis: _useNavRail ? Axis.vertical : Axis.horizontal),