84 lines
4.4 KiB
Dart
84 lines
4.4 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:logger/logger.dart';
|
|
import '../../domain/entities/friend.dart';
|
|
|
|
/// [FriendsCircle] est un widget qui affiche un ami sous forme d'avatar circulaire avec son nom.
|
|
/// L'avatar est cliquable, permettant à l'utilisateur d'accéder aux détails de l'ami
|
|
/// ou de déclencher d'autres actions liées.
|
|
///
|
|
/// Chaque interaction avec le widget sera loguée pour assurer une traçabilité complète.
|
|
class FriendsCircle extends StatelessWidget {
|
|
final Friend friend; // L'entité Friend à afficher (contenant l'ID, le prénom, le nom, et l'URL de l'image).
|
|
final VoidCallback onTap; // La fonction callback qui sera exécutée lors du clic sur l'avatar.
|
|
|
|
// Initialisation du logger pour tracer les actions dans le terminal.
|
|
final Logger _logger = Logger();
|
|
|
|
/// Constructeur pour [FriendsCircle], prenant en entrée un ami et une fonction de callback.
|
|
///
|
|
/// @param friend: l'ami à afficher, comprenant les informations nécessaires (nom, prénom, imageUrl).
|
|
/// @param onTap: la fonction qui sera exécutée lorsque l'utilisateur clique sur l'avatar.
|
|
FriendsCircle({
|
|
Key? key,
|
|
required this.friend, // L'ami à afficher (doit inclure friendId, name, imageUrl).
|
|
required this.onTap, // Action à exécuter lors du clic.
|
|
}) : super(key: key);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
// 1. Récupère et assemble les prénoms et noms de l'ami, ou définit "Ami inconnu" si ces valeurs sont vides.
|
|
String displayName = [friend.friendFirstName, friend.friendLastName]
|
|
.where((namePart) => namePart != null && namePart.isNotEmpty) // Exclut les parties nulles ou vides.
|
|
.join(" ") // Joint les parties pour obtenir un nom complet.
|
|
.trim(); // Supprime les espaces superflus.
|
|
|
|
if (displayName.isEmpty) {
|
|
displayName = 'Ami inconnu'; // Utilise "Ami inconnu" si le nom complet est vide.
|
|
}
|
|
|
|
// 2. Widget GestureDetector pour détecter les clics sur l'avatar de l'ami.
|
|
return GestureDetector(
|
|
onTap: () {
|
|
// 3. Log du clic sur l'avatar pour traçabilité dans le terminal.
|
|
_logger.i('[LOG] Avatar de ${displayName.trim()} cliqué');
|
|
onTap(); // Exécute la fonction de callback définie lors du clic.
|
|
},
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center, // Centre verticalement les éléments dans la colonne.
|
|
children: [
|
|
// 4. Animation Hero avec l'ID unique de l'ami pour effectuer une transition fluide.
|
|
Hero(
|
|
tag: friend.friendId, // Tag unique pour l'animation Hero basé sur l'ID de l'ami.
|
|
child: CircleAvatar(
|
|
radius: 40, // Rayon de l'avatar circulaire.
|
|
// 5. Gestion de l'image de l'avatar. Si une image est fournie, on l'affiche.
|
|
backgroundImage: friend.imageUrl != null && friend.imageUrl!.isNotEmpty
|
|
? (friend.imageUrl!.startsWith('http') // Vérifie si l'image est une URL réseau.
|
|
? NetworkImage(friend.imageUrl!) // Charge l'image depuis une URL réseau.
|
|
: AssetImage(friend.imageUrl!) as ImageProvider) // Sinon, charge depuis les ressources locales.
|
|
: const AssetImage('lib/assets/images/default_avatar.png'), // Si aucune image, utilise l'image par défaut.
|
|
onBackgroundImageError: (error, stackTrace) {
|
|
// 6. Log d'erreur si l'image de l'avatar ne se charge pas.
|
|
_logger.e('[ERROR] Erreur lors du chargement de l\'image pour ${displayName.trim()} : $error');
|
|
},
|
|
backgroundColor: Colors.grey.shade800, // Fond si l'image ne se charge pas correctement.
|
|
),
|
|
),
|
|
const SizedBox(height: 8), // 7. Ajoute un espace entre l'avatar et le nom de l'ami.
|
|
// 8. Affiche le nom de l'ami sous l'avatar, avec une gestion de dépassement du texte.
|
|
Text(
|
|
displayName, // Affiche le nom de l'ami sous l'avatar ou "Ami inconnu" si vide.
|
|
style: const TextStyle(
|
|
color: Colors.white, // Couleur du texte.
|
|
fontSize: 14, // Taille de police.
|
|
fontWeight: FontWeight.bold, // Met le texte en gras.
|
|
),
|
|
maxLines: 1, // Limite l'affichage à une ligne.
|
|
overflow: TextOverflow.ellipsis, // Ajoute des points de suspension si le texte dépasse.
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|