Troca de desing

This commit is contained in:
Carlos Correia
2026-05-18 15:04:07 +01:00
parent 9b4c2f7e04
commit 9999011cfd
9 changed files with 3000 additions and 2138 deletions

View File

@@ -1,11 +1,11 @@
import 'package:flutter/material.dart';
import 'package:supabase_flutter/supabase_flutter.dart';
import 'perfil_screen.dart';
import '../constants/item_categories.dart';
import '../theme/app_theme.dart';
import 'add_item_screen.dart';
import 'item_screen.dart';
import 'perfil_screen.dart';
import 'week_screen.dart';
import 'ai_chat_screen.dart';
import '../constants/item_categories.dart';
class HomeScreen extends StatefulWidget {
const HomeScreen({super.key});
@@ -15,55 +15,105 @@ class HomeScreen extends StatefulWidget {
}
class _HomeScreenState extends State<HomeScreen> {
int _selectedIndex = 0;
int _index = 0;
final List<Widget> _screens = [
const _HomeContent(),
const _ItemsScreen(),
const _WeekScreen(),
const _AiScreen(),
const _ProfileScreen(),
static const _tabs = [
_HomeContent(),
ItemScreen(),
WeekScreen(),
PerfilScreen(),
];
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFFFE5CC),
body: _screens[_selectedIndex],
bottomNavigationBar: BottomNavigationBar(
currentIndex: _selectedIndex,
onTap: (index) => setState(() => _selectedIndex = index),
selectedItemColor: const Color(0xFF0066CC),
unselectedItemColor: const Color(0xFF666666),
backgroundColor: Colors.white,
type: BottomNavigationBarType.fixed,
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Início',
),
BottomNavigationBarItem(
icon: Icon(Icons.inventory_2_outlined),
label: 'Itens',
),
BottomNavigationBarItem(
icon: Icon(Icons.calendar_today_outlined),
label: 'Semana',
),
BottomNavigationBarItem(
icon: Icon(Icons.auto_awesome_outlined),
label: 'IA',
),
BottomNavigationBarItem(
icon: Icon(Icons.person_outline),
label: 'Perfil',
backgroundColor: AppColors.background,
body: IndexedStack(index: _index, children: _tabs),
bottomNavigationBar: _buildBottomNav(),
);
}
Widget _buildBottomNav() {
return Container(
decoration: BoxDecoration(
color: AppColors.surface,
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.06),
blurRadius: 20,
offset: const Offset(0, -4),
),
],
),
child: SafeArea(
top: false,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_navItem(0, Icons.home_rounded, 'Início'),
_navItem(1, Icons.inventory_2_rounded, 'Itens'),
_navItem(2, Icons.calendar_month_rounded, 'Semana'),
_navItem(3, Icons.person_rounded, 'Perfil'),
],
),
),
),
);
}
Widget _navItem(int idx, IconData icon, String label) {
final selected = _index == idx;
return Expanded(
child: Material(
color: Colors.transparent,
child: InkWell(
borderRadius: BorderRadius.circular(AppRadius.lg),
onTap: () => setState(() => _index = idx),
child: AnimatedContainer(
duration: const Duration(milliseconds: 220),
curve: Curves.easeOut,
padding: const EdgeInsets.symmetric(vertical: 8),
decoration: BoxDecoration(
color: selected
? AppColors.primary.withValues(alpha: 0.08)
: Colors.transparent,
borderRadius: BorderRadius.circular(AppRadius.lg),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
icon,
size: 24,
color:
selected ? AppColors.primary : AppColors.textSecondary,
),
const SizedBox(height: 3),
Text(
label,
style: TextStyle(
fontSize: 11,
fontWeight:
selected ? FontWeight.w700 : FontWeight.w500,
color: selected
? AppColors.primary
: AppColors.textSecondary,
),
),
],
),
),
),
),
);
}
}
// ============================================================
// Home tab content
// ============================================================
class _HomeContent extends StatefulWidget {
const _HomeContent();
@@ -73,6 +123,7 @@ class _HomeContent extends StatefulWidget {
class _HomeContentState extends State<_HomeContent> {
int _itemCount = 0;
String _userName = '';
List<Map<String, dynamic>> _todayItems = [];
List<Map<String, dynamic>> _recentItems = [];
bool _isLoading = true;
@@ -104,21 +155,27 @@ class _HomeContentState extends State<_HomeContent> {
final user = Supabase.instance.client.auth.currentUser;
if (user == null) return;
// total item count
final all = await Supabase.instance.client
.from('items')
.select('id')
.eq('user_id', user.id);
// recent 5 items
final recent = await Supabase.instance.client
.from('items')
.select('*, item_images(image_url)')
.eq('user_id', user.id)
.order('id', ascending: false)
.limit(5);
.limit(8);
Map<String, dynamic>? userRow;
try {
userRow = await Supabase.instance.client
.from('users')
.select('nome')
.eq('id', user.id)
.maybeSingle();
} catch (_) {}
// today's plan
final today = DateTime.now();
final plan = await Supabase.instance.client
.from('plans')
@@ -138,356 +195,450 @@ class _HomeContentState extends State<_HomeContent> {
.toList();
}
if (!mounted) return;
setState(() {
_itemCount = all.length;
_userName = userRow?['nome'] ??
user.email?.split('@').first ??
'Utilizador';
_recentItems = List<Map<String, dynamic>>.from(recent);
_todayItems = todayItems;
_isLoading = false;
});
} catch (e) {
debugPrint('Error loading home: $e');
setState(() => _isLoading = false);
if (mounted) setState(() => _isLoading = false);
}
}
@override
Widget build(BuildContext context) {
return SafeArea(
child: Stack(
children: [
Column(
return Scaffold(
backgroundColor: AppColors.background,
body: SafeArea(
bottom: false,
child: RefreshIndicator(
onRefresh: _loadData,
color: AppColors.primary,
child: ListView(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.fromLTRB(20, 20, 20, 100),
children: [
// App Bar
Container(
color: const Color(0xFF0066CC),
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 16,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'DayMaker',
style: TextStyle(
color: Colors.white,
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 4),
Text(
'$_itemCount itens',
style: const TextStyle(
color: Colors.white70,
fontSize: 14,
),
),
],
),
IconButton(
icon: const Icon(
Icons.notifications_outlined,
color: Colors.white,
),
onPressed: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Notificações'),
backgroundColor: Color(0xFF0066CC),
),
);
},
),
],
),
),
Expanded(
child: RefreshIndicator(
onRefresh: _loadData,
child: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildTodaySection(),
const SizedBox(height: 24),
const Text(
'Itens Recentes',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Color(0xFF333333),
),
),
const SizedBox(height: 12),
_buildRecentItems(),
],
),
),
),
),
_buildGreeting(),
const SizedBox(height: 20),
_buildHeroCard(),
const SizedBox(height: 24),
_buildSectionHeader('Hoje'),
const SizedBox(height: 12),
_buildTodaySection(),
const SizedBox(height: 24),
_buildSectionHeader('Itens recentes'),
const SizedBox(height: 12),
_buildRecentItems(),
const SizedBox(height: 24),
_buildAddCta(),
],
),
// Floating Action Button
Positioned(
bottom: 80,
right: 20,
child: FloatingActionButton(
onPressed: () {
Navigator.of(context)
.push(
MaterialPageRoute(builder: (_) => const AddItemScreen()),
)
.then((_) => _loadData());
},
backgroundColor: const Color(0xFF0066CC),
child: const Icon(Icons.add, color: Colors.white),
),
),
],
),
),
);
}
Widget _buildTodaySection() {
Widget _buildGreeting() {
final hour = DateTime.now().hour;
final saudacao = hour < 12
? 'Bom dia'
: hour < 19
? 'Boa tarde'
: 'Boa noite';
return Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
saudacao,
style: AppText.bodySecondary,
),
const SizedBox(height: 2),
Text(
_userName.isEmpty ? 'Olá!' : _userName,
style: AppText.h2,
),
],
),
),
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
color: AppColors.surface,
shape: BoxShape.circle,
boxShadow: AppShadows.soft,
),
child: const Icon(
Icons.notifications_none_rounded,
color: AppColors.textPrimary,
),
),
],
);
}
Widget _buildHeroCard() {
final today = DateTime.now();
final dayName = _weekdayLong[today.weekday - 1];
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16),
gradient: AppColors.brandGradient,
borderRadius: BorderRadius.circular(AppRadius.xl),
boxShadow: AppShadows.brand,
),
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Hoje - $dayName',
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Color(0xFF0066CC),
),
const Icon(
Icons.calendar_today_rounded,
color: Colors.white,
size: 18,
),
const SizedBox(width: 8),
Text(
'${today.day}/${today.month}',
style: const TextStyle(fontSize: 14, color: Color(0xFF666666)),
'$dayName, ${today.day}/${today.month}',
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
),
),
],
),
const SizedBox(height: 6),
Text(
'${_todayItems.length} ${_todayItems.length == 1 ? "item planejado" : "itens planejados"}',
style: const TextStyle(fontSize: 14, color: Color(0xFF666666)),
),
const SizedBox(height: 12),
if (_isLoading)
const Padding(
padding: EdgeInsets.symmetric(vertical: 16),
child: Center(child: CircularProgressIndicator()),
)
else if (_todayItems.isEmpty)
Container(
padding: const EdgeInsets.symmetric(vertical: 20),
alignment: Alignment.center,
child: const Text(
'Nada planejado para hoje',
style: TextStyle(color: Color(0xFF999999)),
const SizedBox(height: 14),
Row(
children: [
_heroStat(
value: '${_todayItems.length}',
label: 'Hoje',
icon: Icons.today_rounded,
),
)
else
SizedBox(
height: 90,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: _todayItems.length,
itemBuilder: (_, i) => _buildTodayChip(_todayItems[i]),
const SizedBox(width: 12),
_heroStat(
value: '$_itemCount',
label: 'No inventário',
icon: Icons.inventory_2_rounded,
),
],
),
],
),
);
}
Widget _heroStat({
required String value,
required String label,
required IconData icon,
}) {
return Expanded(
child: Container(
padding: const EdgeInsets.all(14),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.18),
borderRadius: BorderRadius.circular(AppRadius.md),
border: Border.all(color: Colors.white.withValues(alpha: 0.25)),
),
child: Row(
children: [
Icon(icon, color: Colors.white, size: 22),
const SizedBox(width: 10),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
value,
style: const TextStyle(
color: Colors.white,
fontSize: 22,
fontWeight: FontWeight.bold,
height: 1,
),
),
const SizedBox(height: 2),
Text(
label,
style: TextStyle(
color: Colors.white.withValues(alpha: 0.85),
fontSize: 12,
),
),
],
),
],
),
),
);
}
Widget _buildSectionHeader(String title) {
return Text(title, style: AppText.h3);
}
Widget _buildTodaySection() {
if (_isLoading) {
return _skeletonRow();
}
if (_todayItems.isEmpty) {
return Container(
padding: const EdgeInsets.all(18),
decoration: AppDecorations.card(),
child: Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
color: AppColors.primary.withValues(alpha: 0.1),
borderRadius: BorderRadius.circular(AppRadius.md),
),
child: const Icon(
Icons.event_available_rounded,
color: AppColors.primary,
),
),
],
),
);
}
Widget _buildTodayChip(Map<String, dynamic> item) {
final images = item['item_images'] as List?;
final imageUrl = (images != null && images.isNotEmpty)
? images.first['image_url']
: null;
final category = itemCategories.firstWhere(
(c) => c.id == item['categoria'],
orElse: () => itemCategories.last,
);
return Container(
width: 80,
margin: const EdgeInsets.only(right: 10),
child: Column(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(10),
child: imageUrl != null
? Image.network(
imageUrl,
width: 60,
height: 60,
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) =>
_placeholder(category.icon),
)
: _placeholder(category.icon),
),
const SizedBox(height: 4),
Text(
item['nome'] ?? '',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(fontSize: 11, color: Color(0xFF333333)),
),
],
),
);
}
Widget _placeholder(String icon) {
return Container(
width: 60,
height: 60,
color: const Color(0xFF0066CC).withValues(alpha: 0.1),
alignment: Alignment.center,
child: Text(icon, style: const TextStyle(fontSize: 26)),
);
}
Widget _buildRecentItems() {
if (_isLoading) {
return const SizedBox(
height: 100,
child: Center(child: CircularProgressIndicator()),
);
}
if (_recentItems.isEmpty) {
return Container(
height: 100,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
child: const Center(
child: Text(
'Sem itens ainda',
style: TextStyle(color: Color(0xFF999999)),
),
const SizedBox(width: 12),
const Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Nada planeado para hoje',
style: AppText.body,
),
SizedBox(height: 2),
Text(
'Vá à aba Semana para organizar',
style: AppText.caption,
),
],
),
),
],
),
);
}
return SizedBox(
height: 130,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: _todayItems.length,
itemBuilder: (_, i) => _itemCard(_todayItems[i], compact: true),
),
);
}
Widget _buildRecentItems() {
if (_isLoading) return _skeletonRow();
if (_recentItems.isEmpty) {
return Container(
padding: const EdgeInsets.all(18),
decoration: AppDecorations.card(),
child: Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
color: AppColors.accent.withValues(alpha: 0.15),
borderRadius: BorderRadius.circular(AppRadius.md),
),
child: const Icon(
Icons.add_box_rounded,
color: AppColors.accent,
),
),
const SizedBox(width: 12),
const Expanded(
child: Text(
'Adicione o seu primeiro item',
style: AppText.body,
),
),
],
),
);
}
return SizedBox(
height: 160,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: _recentItems.length,
itemBuilder: (_, i) {
final item = _recentItems[i];
final images = item['item_images'] as List?;
final imageUrl = (images != null && images.isNotEmpty)
? images.first['image_url']
: null;
final category = itemCategories.firstWhere(
(c) => c.id == item['categoria'],
orElse: () => itemCategories.last,
);
return Container(
width: 110,
margin: const EdgeInsets.only(right: 10),
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(8),
child: imageUrl != null
? Image.network(
imageUrl,
width: double.infinity,
height: 70,
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) =>
_placeholder(category.icon),
)
: Container(
width: double.infinity,
height: 70,
color: const Color(0xFF0066CC).withValues(alpha: 0.1),
alignment: Alignment.center,
child: Text(
category.icon,
style: const TextStyle(fontSize: 30),
itemBuilder: (_, i) => _itemCard(_recentItems[i]),
),
);
}
Widget _itemCard(Map<String, dynamic> item, {bool compact = false}) {
final images = item['item_images'] as List?;
final imageUrl = (images != null && images.isNotEmpty)
? images.first['image_url'] as String?
: null;
final cat = categoryById(item['categoria'] as String?);
final size = compact ? 110.0 : 130.0;
return Container(
width: size,
margin: const EdgeInsets.only(right: 12),
decoration: AppDecorations.card(),
clipBehavior: Clip.antiAlias,
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: () {},
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Stack(
children: [
Container(
width: double.infinity,
height: compact ? 72 : 90,
color: cat.color.withValues(alpha: 0.15),
child: imageUrl != null
? Image.network(
imageUrl,
fit: BoxFit.cover,
errorBuilder: (_, __, ___) => Center(
child: Icon(
cat.icon,
color: cat.color,
size: 32,
),
),
)
: Center(
child: Icon(
cat.icon,
color: cat.color,
size: 32,
),
),
),
),
const SizedBox(height: 6),
Text(
item['nome'] ?? '',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 12,
),
],
),
Padding(
padding: const EdgeInsets.fromLTRB(10, 8, 10, 10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item['nome'] ?? '',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
fontSize: 13,
fontWeight: FontWeight.w600,
color: AppColors.textPrimary,
),
),
const SizedBox(height: 2),
Text(
cat.name,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 11,
color: cat.color,
fontWeight: FontWeight.w600,
),
),
],
),
Text(
category.name,
style: const TextStyle(
fontSize: 10,
color: Color(0xFF666666),
),
),
],
),
);
),
],
),
),
),
);
}
Widget _skeletonRow() {
return SizedBox(
height: 130,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 3,
itemBuilder: (_, __) => Container(
width: 110,
margin: const EdgeInsets.only(right: 12),
decoration: BoxDecoration(
color: AppColors.surfaceAlt,
borderRadius: BorderRadius.circular(AppRadius.lg),
),
),
),
);
}
Widget _buildAddCta() {
return Material(
color: Colors.transparent,
child: InkWell(
borderRadius: BorderRadius.circular(AppRadius.lg),
onTap: () {
Navigator.of(context)
.push(
MaterialPageRoute(builder: (_) => const AddItemScreen()),
)
.then((_) => _loadData());
},
child: Container(
padding: const EdgeInsets.all(18),
decoration: BoxDecoration(
color: AppColors.surface,
borderRadius: BorderRadius.circular(AppRadius.lg),
border: Border.all(
color: AppColors.primary.withValues(alpha: 0.3),
style: BorderStyle.solid,
width: 1.5,
),
),
child: Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
gradient: AppColors.brandGradient,
borderRadius: BorderRadius.circular(AppRadius.md),
),
child:
const Icon(Icons.add_rounded, color: Colors.white, size: 24),
),
const SizedBox(width: 14),
const Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Adicionar item', style: AppText.h3),
SizedBox(height: 2),
Text(
'Foto, categoria e tags em segundos',
style: AppText.caption,
),
],
),
),
const Icon(
Icons.arrow_forward_ios_rounded,
size: 16,
color: AppColors.textTertiary,
),
],
),
),
),
);
}
}
class _ItemsScreen extends StatelessWidget {
const _ItemsScreen();
@override
Widget build(BuildContext context) => const ItemScreen();
}
class _WeekScreen extends StatelessWidget {
const _WeekScreen();
@override
Widget build(BuildContext context) => const WeekScreen();
}
class _AiScreen extends StatelessWidget {
const _AiScreen();
@override
Widget build(BuildContext context) => const AiChatScreen();
}
class _ProfileScreen extends StatelessWidget {
const _ProfileScreen();
@override
Widget build(BuildContext context) => const PerfilScreen();
}