liquid-development/game-tracker
3
0
Fork 0
Code Issues 13 Pull Requests 6 Actions Releases 1 Activity

Implemented first version of home view

Browse Source
This commit is contained in:
Felix Kirchner
2025-11-09 23:33:29 +01:00
parent f1974cf71a
commit e88211245c
5 changed files with 221 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
lib/presentation/views/main_menu/home_view.dart
View File

@@ -1,4 +1,7 @@
import 'package:flutter/material.dart';
import 'package:game_tracker/presentation/widgets/game_tile.dart';
import 'package:game_tracker/presentation/widgets/info_tile.dart';
import 'package:game_tracker/presentation/widgets/quick_create_button.dart';
import 'package:game_tracker/presentation/widgets/quick_info_tile.dart';
class HomeView extends StatelessWidget {
@@ -6,9 +9,10 @@ class HomeView extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const Column(
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
const Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
QuickInfoTile(title: 'Games', icon: Icons.casino, value: 42),
@@ -19,6 +23,43 @@ class HomeView extends StatelessWidget {
),
],
),
const InfoTile(
title: 'Recent Games',
padding: EdgeInsets.symmetric(horizontal: 8.0, vertical: 16.0),
icon: Icons.timer,
content: GameTile(),
),
InfoTile(
title: 'Quick Create',
height: 210,
padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 16.0),
icon: Icons.add_box_rounded,
content: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
QuickCreateButton(text: 'Cabo', onPressed: () {}),
QuickCreateButton(text: 'Uno', onPressed: () {}),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
QuickCreateButton(text: 'Phase 10', onPressed: () {}),
QuickCreateButton(text: 'Category 5', onPressed: () {}),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
QuickCreateButton(text: 'Category 6', onPressed: () {}),
QuickCreateButton(text: 'Category 7', onPressed: () {}),
],
),
],
),
),
],
);
}

82
lib/presentation/widgets/game_tile.dart Normal file
View File

@@ -0,0 +1,82 @@
import 'package:flutter/material.dart';
import 'package:game_tracker/core/custom_theme.dart';
class GameTile extends StatefulWidget {
const GameTile({super.key});
@override
State<GameTile> createState() => _GameTileState();
}
class _GameTileState extends State<GameTile> {
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(12),
height: 120,
width: 250,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
color: CustomTheme.boxColor,
border: Border.all(color: CustomTheme.boxBorder),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Row(
children: [
Text(
'Gametitle',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
SizedBox(width: 5),
Text(
'Gametype',
style: TextStyle(fontSize: 14, color: Colors.grey),
),
],
),
const SizedBox(height: 5),
Container(
padding: const EdgeInsets.symmetric(horizontal: 4),
height: 20,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
color: CustomTheme.primaryColor,
),
child: const Text(
'Ruleset',
style: TextStyle(fontWeight: FontWeight.bold),
),
),
const Center(
child: Text(
'5 Player',
style: TextStyle(fontWeight: FontWeight.bold),
),
),
const Spacer(),
Center(
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 4),
width: 220,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
color: Colors.yellow.shade300,
),
child: const Text(
'In Progress',
textAlign: TextAlign.center,
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.black87,
),
),
),
),
],
),
);
}
}

61
lib/presentation/widgets/info_tile.dart Normal file
View File

@@ -0,0 +1,61 @@
import 'package:flutter/material.dart';
import 'package:game_tracker/core/custom_theme.dart';
class InfoTile extends StatefulWidget {
final String title;
final IconData icon;
final Widget content;
final EdgeInsets? padding;
final double? height;
const InfoTile({
super.key,
required this.title,
required this.icon,
required this.content,
this.padding,
this.height,
});
@override
State<InfoTile> createState() => _InfoTileState();
}
class _InfoTileState extends State<InfoTile> {
@override
Widget build(BuildContext context) {
return Padding(
padding: widget.padding ?? const EdgeInsets.all(0),
child: Container(
padding: const EdgeInsets.all(12),
height: widget.height ?? 200,
width: 380,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
color: CustomTheme.boxColor,
border: Border.all(color: CustomTheme.boxBorder),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
children: [
Icon(widget.icon),
const SizedBox(width: 5),
Text(
widget.title,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
],
),
const SizedBox(height: 10),
widget.content,
],
),
),
);
}
}

34
lib/presentation/widgets/quick_create_button.dart Normal file
View File

@@ -0,0 +1,34 @@
import 'package:flutter/material.dart';
import 'package:game_tracker/core/custom_theme.dart';
class QuickCreateButton extends StatefulWidget {
final String text;
final VoidCallback? onPressed;
const QuickCreateButton({
super.key,
required this.text,
required this.onPressed,
});
@override
State<QuickCreateButton> createState() => _QuickCreateButtonState();
}
class _QuickCreateButtonState extends State<QuickCreateButton> {
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: widget.onPressed,
style: ElevatedButton.styleFrom(
minimumSize: const Size(140, 40),
backgroundColor: CustomTheme.primaryColor,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
),
child: Text(
widget.text,
style: const TextStyle(fontWeight: FontWeight.bold),
),
);
}
}

2
lib/presentation/widgets/quick_info_tile.dart
View File

@@ -33,7 +33,7 @@ class _QuickInfoTileState extends State<QuickInfoTile> {
children: [
Row(
children: [
const Icon(Icons.casino),
Icon(widget.icon),
const SizedBox(width: 5),
Text(
widget.title,