refactoring and checkpoint
This commit is contained in:
DahoudG
@@ -1,21 +1,22 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart'; // Pour ThemeProvider
|
||||
import 'package:afterwork/presentation/screens/event/event_screen.dart';
|
||||
import 'package:afterwork/presentation/screens/profile/profile_screen.dart';
|
||||
import 'package:afterwork/presentation/screens/social/social_screen.dart';
|
||||
import 'package:afterwork/presentation/screens/establishments/establishments_screen.dart';
|
||||
import 'package:afterwork/presentation/screens/home/home_content.dart';
|
||||
import 'package:afterwork/data/datasources/event_remote_data_source.dart';
|
||||
import 'package:afterwork/presentation/screens/notifications/notifications_screen.dart'; // Importez l'écran de notifications
|
||||
|
||||
import '../../../core/constants/colors.dart';
|
||||
import '../../../core/theme/theme_provider.dart'; // Pour basculer le thème
|
||||
|
||||
/// Classe principale pour l'écran d'accueil de l'application.
|
||||
/// Cette classe gère la navigation entre les différentes sections de l'application
|
||||
/// en utilisant un [TabController] pour contrôler les différents onglets.
|
||||
/// Les actions de l'AppBar sont également personnalisées pour offrir des fonctionnalités
|
||||
/// spécifiques comme la recherche, la publication et la messagerie.
|
||||
class HomeScreen extends StatefulWidget {
|
||||
final EventRemoteDataSource eventRemoteDataSource;
|
||||
final String userId;
|
||||
final String userName;
|
||||
final String userLastName;
|
||||
final String userProfileImage; // Ajouter un champ pour l'image de profil de l'utilisateur
|
||||
|
||||
const HomeScreen({
|
||||
Key? key,
|
||||
@@ -23,6 +24,7 @@ class HomeScreen extends StatefulWidget {
|
||||
required this.userId,
|
||||
required this.userName,
|
||||
required this.userLastName,
|
||||
required this.userProfileImage, // Passer l'image de profil ici
|
||||
}) : super(key: key);
|
||||
|
||||
@override
|
||||
@@ -35,136 +37,207 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
// Initialisation du TabController avec 5 onglets.
|
||||
_tabController = TabController(length: 5, vsync: this);
|
||||
debugPrint('HomeScreen initialisé avec userId: ${widget.userId}, userName: ${widget.userName}, userLastName: ${widget.userLastName}');
|
||||
_tabController = TabController(length: 6, vsync: this); // Ajouter un onglet pour les notifications
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
// Nettoyage du TabController pour éviter les fuites de mémoire.
|
||||
_tabController.dispose();
|
||||
super.dispose();
|
||||
debugPrint('HomeScreen dispose appelé');
|
||||
}
|
||||
|
||||
/// Gestion des sélections dans le menu contextuel de l'AppBar.
|
||||
void _onMenuSelected(BuildContext context, String option) {
|
||||
switch (option) {
|
||||
case 'Publier':
|
||||
debugPrint('Option "Publier" sélectionnée');
|
||||
// Rediriger vers la page de publication.
|
||||
print('Publier sélectionné');
|
||||
break;
|
||||
case 'Story':
|
||||
debugPrint('Option "Story" sélectionnée');
|
||||
// Rediriger vers la page de création de Story.
|
||||
print('Story sélectionné');
|
||||
break;
|
||||
default:
|
||||
debugPrint('Option inconnue sélectionnée: $option');
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// Accès au ThemeProvider
|
||||
final themeProvider = Provider.of<ThemeProvider>(context);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.black,
|
||||
elevation: 0,
|
||||
leading: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: Image.asset(
|
||||
'lib/assets/images/logo.png', // Chemin correct de votre logo.
|
||||
height: 40,
|
||||
),
|
||||
),
|
||||
actions: [
|
||||
// Bouton pour ajouter du contenu (Publier, Story).
|
||||
CircleAvatar(
|
||||
backgroundColor: Colors.white,
|
||||
radius: 18,
|
||||
child: PopupMenuButton<String>(
|
||||
onSelected: (value) {
|
||||
_onMenuSelected(context, value);
|
||||
debugPrint('Menu contextuel sélectionné: $value');
|
||||
},
|
||||
itemBuilder: (context) => [
|
||||
const PopupMenuItem(
|
||||
value: 'Publier',
|
||||
child: Text('Publier'),
|
||||
body: NestedScrollView(
|
||||
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
|
||||
return <Widget>[
|
||||
SliverAppBar(
|
||||
backgroundColor: AppColors.backgroundColor, // Gère dynamiquement la couleur d'arrière-plan
|
||||
floating: true,
|
||||
pinned: true,
|
||||
snap: true,
|
||||
elevation: 2, // Réduction de l'élévation pour un design plus léger
|
||||
leading: Padding(
|
||||
padding: const EdgeInsets.all(4.0), // Réduction du padding
|
||||
child: Image.asset(
|
||||
'lib/assets/images/logo.png',
|
||||
height: 40, // Taille réduite du logo
|
||||
),
|
||||
const PopupMenuItem(
|
||||
value: 'Story',
|
||||
child: Text('Story'),
|
||||
),
|
||||
actions: [
|
||||
_buildActionIcon(Icons.add, 'Publier', context),
|
||||
_buildActionIcon(Icons.search, 'Rechercher', context),
|
||||
_buildActionIcon(Icons.message, 'Message', context),
|
||||
_buildNotificationsIcon(context, 45),
|
||||
|
||||
// Ajout du bouton pour basculer entre les thèmes
|
||||
Switch(
|
||||
value: themeProvider.isDarkMode,
|
||||
onChanged: (value) {
|
||||
themeProvider.toggleTheme(); // Bascule le thème lorsqu'on clique
|
||||
},
|
||||
activeColor: AppColors.accentColor,
|
||||
),
|
||||
],
|
||||
icon: const Icon(Icons.add, color: Colors.blueAccent, size: 20),
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8), // Espacement entre les boutons.
|
||||
bottom: TabBar(
|
||||
controller: _tabController,
|
||||
indicatorColor: AppColors.lightPrimary, // Tab active en bleu
|
||||
labelStyle: const TextStyle(
|
||||
fontSize: 12, // Réduction de la taille du texte des onglets
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
unselectedLabelStyle: const TextStyle(
|
||||
fontSize: 11, // Réduction pour les onglets non sélectionnés
|
||||
),
|
||||
// Changement des couleurs pour les tabs non sélectionnées et sélectionnées
|
||||
labelColor: AppColors.lightPrimary, // Tab active en bleu
|
||||
unselectedLabelColor: AppColors.iconSecondary, // Tabs non sélectionnées en blanc
|
||||
|
||||
// Bouton Recherche.
|
||||
CircleAvatar(
|
||||
backgroundColor: Colors.white,
|
||||
radius: 18,
|
||||
child: IconButton(
|
||||
icon: const Icon(Icons.search, color: Colors.blueAccent, size: 20),
|
||||
onPressed: () {
|
||||
debugPrint('Bouton Recherche appuyé');
|
||||
// Implémenter la logique de recherche ici.
|
||||
},
|
||||
tabs: [
|
||||
const Tab(icon: Icon(Icons.home, size: 24), text: 'Accueil'),
|
||||
const Tab(icon: Icon(Icons.event, size: 24), text: 'Événements'),
|
||||
const Tab(icon: Icon(Icons.location_city, size: 24), text: 'Établissements'),
|
||||
const Tab(icon: Icon(Icons.people, size: 24), text: 'Social'),
|
||||
const Tab(icon: Icon(Icons.notifications, size: 24), text: 'Notifications'),
|
||||
_buildProfileTab(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8), // Espacement entre les boutons.
|
||||
|
||||
// Bouton Messagerie.
|
||||
CircleAvatar(
|
||||
backgroundColor: Colors.white,
|
||||
radius: 18,
|
||||
child: IconButton(
|
||||
icon: const Icon(Icons.message, color: Colors.blueAccent, size: 20),
|
||||
onPressed: () {
|
||||
debugPrint('Bouton Messagerie appuyé');
|
||||
// Implémenter la logique de messagerie ici.
|
||||
},
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8), // Espacement entre les boutons.
|
||||
],
|
||||
bottom: TabBar(
|
||||
];
|
||||
},
|
||||
body: TabBarView(
|
||||
controller: _tabController,
|
||||
indicatorColor: Colors.blueAccent,
|
||||
labelColor: Colors.white, // Couleur du texte sélectionné.
|
||||
unselectedLabelColor: Colors.grey[400], // Couleur du texte non sélectionné.
|
||||
onTap: (index) {
|
||||
debugPrint('Onglet sélectionné: $index');
|
||||
},
|
||||
tabs: const [
|
||||
Tab(icon: Icon(Icons.home), text: 'Accueil'),
|
||||
Tab(icon: Icon(Icons.event), text: 'Événements'),
|
||||
Tab(icon: Icon(Icons.location_city), text: 'Établissements'),
|
||||
Tab(icon: Icon(Icons.people), text: 'Social'),
|
||||
Tab(icon: Icon(Icons.person), text: 'Profil'),
|
||||
children: [
|
||||
const HomeContentScreen(),
|
||||
EventScreen(
|
||||
userId: widget.userId,
|
||||
userName: widget.userName,
|
||||
userLastName: widget.userLastName,
|
||||
),
|
||||
const EstablishmentsScreen(),
|
||||
const SocialScreen(),
|
||||
const NotificationsScreen(),
|
||||
const ProfileScreen(),
|
||||
],
|
||||
),
|
||||
),
|
||||
body: TabBarView(
|
||||
controller: _tabController,
|
||||
);
|
||||
}
|
||||
|
||||
// Widget pour afficher la photo de profil de l'utilisateur dans l'onglet
|
||||
Tab _buildProfileTab() {
|
||||
return Tab(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(
|
||||
color: Colors.blue, // Définir la couleur de la bordure ici
|
||||
width: 2.0,
|
||||
),
|
||||
),
|
||||
child: CircleAvatar(
|
||||
radius: 16, // Ajustez la taille si nécessaire
|
||||
backgroundColor: Colors.grey[200], // Couleur de fond pour le cas où l'image ne charge pas
|
||||
child: ClipOval(
|
||||
child: FadeInImage.assetNetwork(
|
||||
placeholder: 'lib/assets/images/user_placeholder.png', // Chemin de l'image par défaut
|
||||
image: widget.userProfileImage,
|
||||
fit: BoxFit.cover,
|
||||
imageErrorBuilder: (context, error, stackTrace) {
|
||||
// Si l'image ne charge pas, afficher une image par défaut
|
||||
return Image.asset('lib/assets/images/profile_picture.png', fit: BoxFit.cover);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
// Widget pour afficher l'icône de notifications avec un badge si nécessaire
|
||||
Widget _buildNotificationsIcon(BuildContext context, int notificationCount) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6.0),
|
||||
child: Stack(
|
||||
clipBehavior: Clip.none, // Permet de positionner le badge en dehors des limites du Stack
|
||||
children: [
|
||||
const HomeContentScreen(), // Contenu de l'accueil.
|
||||
EventScreen(
|
||||
eventRemoteDataSource: widget.eventRemoteDataSource,
|
||||
userId: widget.userId,
|
||||
userName: widget.userName,
|
||||
userLastName: widget.userLastName,
|
||||
), // Écran des événements.
|
||||
const EstablishmentsScreen(), // Écran des établissements.
|
||||
const SocialScreen(), // Écran social.
|
||||
const ProfileScreen(), // Écran du profil.
|
||||
CircleAvatar(
|
||||
backgroundColor: AppColors.surface,
|
||||
radius: 18,
|
||||
child: IconButton(
|
||||
icon: const Icon(Icons.notifications, color: AppColors.darkOnPrimary, size: 20),
|
||||
onPressed: () {
|
||||
// Rediriger vers l'écran des notifications
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (context) => const NotificationsScreen(),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
// Affiche le badge si le nombre de notifications est supérieur à 0
|
||||
if (notificationCount > 0)
|
||||
Positioned(
|
||||
right: -6,
|
||||
top: -6,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(2),
|
||||
decoration: const BoxDecoration(
|
||||
color: Colors.red, // Couleur du badge
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
constraints: const BoxConstraints(
|
||||
minWidth: 18,
|
||||
minHeight: 18,
|
||||
),
|
||||
child: Text(
|
||||
notificationCount > 99 ? '99+' : '$notificationCount', // Affiche "99+" si le nombre dépasse 99
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
backgroundColor: Colors.black, // Arrière-plan de l'écran en noir.
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildActionIcon(IconData iconData, String label, BuildContext context) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6.0), // Réduction de l'espacement
|
||||
child: CircleAvatar(
|
||||
backgroundColor: AppColors.surface,
|
||||
radius: 18, // Réduction de la taille des avatars
|
||||
child: IconButton(
|
||||
icon: Icon(iconData, color: AppColors.darkOnPrimary, size: 20), // Taille réduite de l'icône
|
||||
onPressed: () {
|
||||
_onMenuSelected(context, label);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user