diff --git a/lib/presentation/views/main_menu/home_view.dart b/lib/presentation/views/main_menu/home_view.dart index 1a95b27..fb03c5f 100644 --- a/lib/presentation/views/main_menu/home_view.dart +++ b/lib/presentation/views/main_menu/home_view.dart @@ -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: () {}), + ], + ), + ], + ), + ), ], ); } diff --git a/lib/presentation/widgets/game_tile.dart b/lib/presentation/widgets/game_tile.dart new file mode 100644 index 0000000..546531c --- /dev/null +++ b/lib/presentation/widgets/game_tile.dart @@ -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 createState() => _GameTileState(); +} + +class _GameTileState extends State { + @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, + ), + ), + ), + ), + ], + ), + ); + } +} diff --git a/lib/presentation/widgets/info_tile.dart b/lib/presentation/widgets/info_tile.dart new file mode 100644 index 0000000..a323556 --- /dev/null +++ b/lib/presentation/widgets/info_tile.dart @@ -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 createState() => _InfoTileState(); +} + +class _InfoTileState extends State { + @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, + ], + ), + ), + ); + } +} diff --git a/lib/presentation/widgets/quick_create_button.dart b/lib/presentation/widgets/quick_create_button.dart new file mode 100644 index 0000000..bdf2945 --- /dev/null +++ b/lib/presentation/widgets/quick_create_button.dart @@ -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 createState() => _QuickCreateButtonState(); +} + +class _QuickCreateButtonState extends State { + @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), + ), + ); + } +} diff --git a/lib/presentation/widgets/quick_info_tile.dart b/lib/presentation/widgets/quick_info_tile.dart index 69ab5c6..6831c65 100644 --- a/lib/presentation/widgets/quick_info_tile.dart +++ b/lib/presentation/widgets/quick_info_tile.dart @@ -33,7 +33,7 @@ class _QuickInfoTileState extends State { children: [ Row( children: [ - const Icon(Icons.casino), + Icon(widget.icon), const SizedBox(width: 5), Text( widget.title,