diff --git a/lib/presentation/views/main_menu/create_game/choose_ruleset_view.dart b/lib/presentation/views/main_menu/create_game/choose_ruleset_view.dart index 0055761..772cef5 100644 --- a/lib/presentation/views/main_menu/create_game/choose_ruleset_view.dart +++ b/lib/presentation/views/main_menu/create_game/choose_ruleset_view.dart @@ -27,37 +27,93 @@ class _ChooseRulesetViewState extends State { @override Widget build(BuildContext context) { - return Scaffold( - backgroundColor: CustomTheme.backgroundColor, - appBar: AppBar( + return DefaultTabController( + length: 2, + initialIndex: 0, + child: Scaffold( backgroundColor: CustomTheme.backgroundColor, - scrolledUnderElevation: 0, - title: const Text( - 'Choose Group', - style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold), + appBar: AppBar( + backgroundColor: CustomTheme.backgroundColor, + scrolledUnderElevation: 0, + title: const Text( + 'Choose Gametype', + style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold), + ), + centerTitle: true, + ), + body: Column( + children: [ + Container( + color: CustomTheme.backgroundColor, + padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8), + child: TabBar( + padding: const EdgeInsets.symmetric(horizontal: 5), + // Label Settings + labelStyle: const TextStyle( + fontSize: 16, + fontWeight: FontWeight.bold, + ), + labelColor: Colors.white, + unselectedLabelStyle: const TextStyle(fontSize: 14), + unselectedLabelColor: Colors.white70, + // Indicator Settings + indicator: CustomTheme.standardBoxDecoration, + indicatorSize: TabBarIndicatorSize.tab, + indicatorWeight: 1, + indicatorPadding: const EdgeInsets.symmetric( + horizontal: 20, + vertical: 0, + ), + // Divider Settings + dividerHeight: 0, + tabs: const [ + Tab(text: 'Rulesets'), + Tab(text: 'Gametypes'), + ], + ), + ), + const Divider( + indent: 30, + endIndent: 30, + thickness: 3, + radius: BorderRadius.all(Radius.circular(12)), + ), + Expanded( + child: TabBarView( + children: [ + ListView.builder( + padding: const EdgeInsets.only(bottom: 85), + itemCount: widget.rulesets.length, + itemBuilder: (BuildContext context, int index) { + return RulesetListTile( + onPressed: () async { + setState(() { + selectedRulesetIndex = index; + }); + Future.delayed(const Duration(milliseconds: 500), () { + if (!context.mounted) return; + Navigator.of( + context, + ).pop(widget.rulesets[index].$1); + }); + }, + title: widget.rulesets[index].$2, + description: widget.rulesets[index].$3, + isHighlighted: selectedRulesetIndex == index, + ); + }, + ), + const Center( + child: Text( + 'No gametypes available', + style: TextStyle(color: Colors.white70), + ), + ), + ], + ), + ), + ], ), - centerTitle: true, - ), - body: ListView.builder( - padding: const EdgeInsets.only(bottom: 85), - itemCount: widget.rulesets.length, - itemBuilder: (BuildContext context, int index) { - return RulesetListTile( - onPressed: () async { - setState(() { - selectedRulesetIndex = index; - }); - - Future.delayed(const Duration(milliseconds: 500), () { - if (!context.mounted) return; - Navigator.of(context).pop(widget.rulesets[index].$1); - }); - }, - title: widget.rulesets[index].$2, - description: widget.rulesets[index].$3, - isHighlighted: selectedRulesetIndex == index, - ); - }, ), ); }