Implemented custom navigation bar

This commit is contained in:
2025-06-23 23:47:59 +02:00
committed by mathiskirchner
parent 36a42a7b8d
commit c78a3ed171
5 changed files with 129 additions and 16 deletions

View File

@@ -0,0 +1,19 @@
import 'package:flutter/material.dart';
class CustomTheme {
static Color primaryColor = const Color(0xFF71C0BB);
static Color secondaryColor = const Color(0xFF2A4759);
static Color backgroundColor = const Color(0xFF1A1A1A);
static AppBarTheme appBarTheme = const AppBarTheme(
backgroundColor: Color(0xFF1A1A1A),
foregroundColor: Colors.white,
elevation: 0,
titleTextStyle: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.bold,
),
iconTheme: IconThemeData(color: Colors.white),
);
}

View File

@@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:game_tracker/presentation/views/home_view.dart'; import 'package:game_tracker/core/custom_theme.dart';
import 'package:game_tracker/presentation/views/main_menu/custom_navigation_bar.dart';
void main() { void main() {
runApp(const MyApp()); runApp(const MyApp());
@@ -11,11 +12,12 @@ class MyApp extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return MaterialApp( return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Game Tracker', title: 'Game Tracker',
theme: ThemeData( themeMode: ThemeMode.dark,
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), darkTheme: ThemeData.dark(),
), theme: ThemeData(appBarTheme: CustomTheme.appBarTheme),
home: const HomeView(), home: const CustomNavigationBar(),
); );
} }
} }

View File

@@ -1,10 +0,0 @@
import 'package:flutter/material.dart';
class HomeView extends StatelessWidget {
const HomeView({super.key});
@override
Widget build(BuildContext context) {
return const Placeholder();
}
}

View File

@@ -0,0 +1,101 @@
import 'package:flutter/material.dart';
import 'package:game_tracker/core/custom_theme.dart';
import 'package:game_tracker/presentation/views/main_menu/game_history_view.dart';
import 'package:game_tracker/presentation/views/main_menu/groups_view.dart';
import 'package:game_tracker/presentation/views/main_menu/home_view.dart';
import 'package:game_tracker/presentation/views/main_menu/statistics_view.dart';
class CustomNavigationBar extends StatefulWidget {
const CustomNavigationBar({super.key});
@override
State<CustomNavigationBar> createState() => _CustomNavigationBarState();
}
class _CustomNavigationBarState extends State<CustomNavigationBar>
with SingleTickerProviderStateMixin {
int currentIndex = 0;
final List<Widget> tabs = [
const HomeView(),
const GameHistoryView(),
const GroupsView(),
const StatisticsView(),
];
void onTabTapped(int index) {
setState(() {
currentIndex = index;
});
}
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: CustomTheme.backgroundColor,
actions: [
IconButton(onPressed: () {}, icon: const Icon(Icons.settings)),
],
elevation: 0,
),
backgroundColor: CustomTheme.backgroundColor,
body: tabs[currentIndex],
extendBody: true,
floatingActionButton: FloatingActionButton(
shape: const CircleBorder(),
backgroundColor: CustomTheme.primaryColor,
onPressed: () {},
child: const Icon(Icons.add),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
bottomNavigationBar: BottomAppBar(
padding: const EdgeInsets.symmetric(horizontal: 10),
elevation: 10,
height: 60,
color: CustomTheme.primaryColor,
shape: const CircularNotchedRectangle(),
notchMargin: 5,
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
IconButton(
icon: Icon(
Icons.home,
color: currentIndex == 0 ? Colors.white : Colors.black,
),
onPressed: () => onTabTapped(0),
),
IconButton(
icon: Icon(
Icons.history,
color: currentIndex == 1 ? Colors.white : Colors.black,
),
onPressed: () => onTabTapped(1),
),
const SizedBox(width: 40),
IconButton(
icon: Icon(
Icons.group,
color: currentIndex == 2 ? Colors.white : Colors.black,
),
onPressed: () => onTabTapped(2),
),
IconButton(
icon: Icon(
Icons.bar_chart,
color: currentIndex == 3 ? Colors.white : Colors.black,
),
onPressed: () => onTabTapped(3),
),
],
),
),
);
}
}

View File

@@ -1,7 +1,7 @@
name: game_tracker name: game_tracker
description: "Game Tracking App for Card Games" description: "Game Tracking App for Card Games"
publish_to: 'none' publish_to: 'none'
version: 0.0.1+1 version: 0.0.1+18
environment: environment:
sdk: ^3.8.1 sdk: ^3.8.1
@@ -9,6 +9,7 @@ environment:
dependencies: dependencies:
flutter: flutter:
sdk: flutter sdk: flutter
material_symbols_icons: ^4.2815.1
dev_dependencies: dev_dependencies: