lionsdev/unionflow-client-quarkus-primefaces-freya
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Versione OK Pour l'onglet événements.

Browse Source
This commit is contained in:
DahoudG
2025-09-15 20:15:34 +00:00
parent 8a619ee1bf
commit 12d514d866
73 changed files with 11508 additions and 674 deletions
Download Patch File Download Diff File Expand all files Collapse all files

363
unionflow-mobile-apps/lib/features/evenements/presentation/widgets/animated_evenement_card.dart Normal file
View File

@@ -0,0 +1,363 @@
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import '../../../../core/models/evenement_model.dart';
import '../../../../shared/theme/app_theme.dart';
/// Carte d'événement avec animations sophistiquées
class AnimatedEvenementCard extends StatefulWidget {
final EvenementModel evenement;
final VoidCallback? onTap;
final VoidCallback? onFavorite;
final bool showActions;
const AnimatedEvenementCard({
super.key,
required this.evenement,
this.onTap,
this.onFavorite,
this.showActions = true,
});
@override
State<AnimatedEvenementCard> createState() => _AnimatedEvenementCardState();
}
class _AnimatedEvenementCardState extends State<AnimatedEvenementCard>
with TickerProviderStateMixin {
late AnimationController _hoverController;
late AnimationController _tapController;
late AnimationController _favoriteController;
late Animation<double> _scaleAnimation;
late Animation<double> _elevationAnimation;
late Animation<double> _favoriteScaleAnimation;
late Animation<Color?> _favoriteColorAnimation;
bool _isHovered = false;
bool _isFavorite = false;
@override
void initState() {
super.initState();
_hoverController = AnimationController(
duration: const Duration(milliseconds: 200),
vsync: this,
);
_tapController = AnimationController(
duration: const Duration(milliseconds: 100),
vsync: this,
);
_favoriteController = AnimationController(
duration: const Duration(milliseconds: 300),
vsync: this,
);
_scaleAnimation = Tween<double>(
begin: 1.0,
end: 1.02,
).animate(CurvedAnimation(
parent: _hoverController,
curve: Curves.easeOutCubic,
));
_elevationAnimation = Tween<double>(
begin: 2.0,
end: 8.0,
).animate(CurvedAnimation(
parent: _hoverController,
curve: Curves.easeOutCubic,
));
_favoriteScaleAnimation = Tween<double>(
begin: 1.0,
end: 1.3,
).animate(CurvedAnimation(
parent: _favoriteController,
curve: Curves.elasticOut,
));
_favoriteColorAnimation = ColorTween(
begin: Colors.grey[400],
end: Colors.red,
).animate(CurvedAnimation(
parent: _favoriteController,
curve: Curves.easeInOut,
));
}
@override
void dispose() {
_hoverController.dispose();
_tapController.dispose();
_favoriteController.dispose();
super.dispose();
}
void _onTapDown(TapDownDetails details) {
_tapController.forward();
}
void _onTapUp(TapUpDetails details) {
_tapController.reverse();
}
void _onTapCancel() {
_tapController.reverse();
}
void _onHover(bool isHovered) {
setState(() => _isHovered = isHovered);
if (isHovered) {
_hoverController.forward();
} else {
_hoverController.reverse();
}
}
void _onFavoriteToggle() {
setState(() => _isFavorite = !_isFavorite);
if (_isFavorite) {
_favoriteController.forward();
} else {
_favoriteController.reverse();
}
widget.onFavorite?.call();
}
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final dateFormat = DateFormat('dd/MM/yyyy');
final timeFormat = DateFormat('HH:mm');
return AnimatedBuilder(
animation: Listenable.merge([
_scaleAnimation,
_elevationAnimation,
_favoriteScaleAnimation,
_favoriteColorAnimation,
]),
builder: (context, child) {
return Transform.scale(
scale: _scaleAnimation.value,
child: MouseRegion(
onEnter: (_) => _onHover(true),
onExit: (_) => _onHover(false),
child: Card(
elevation: _elevationAnimation.value,
margin: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
gradient: _isHovered
? LinearGradient(
colors: [
Colors.white,
AppTheme.primaryColor.withOpacity(0.02),
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
)
: null,
),
child: InkWell(
onTap: widget.onTap,
onTapDown: _onTapDown,
onTapUp: _onTapUp,
onTapCancel: _onTapCancel,
borderRadius: BorderRadius.circular(16),
child: Padding(
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// En-tête avec type et actions
Row(
children: [
// Icône du type avec animation
AnimatedContainer(
duration: const Duration(milliseconds: 200),
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: _isHovered
? AppTheme.primaryColor.withOpacity(0.15)
: AppTheme.primaryColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
widget.evenement.typeEvenement.icone,
style: const TextStyle(fontSize: 24),
),
),
const SizedBox(width: 12),
// Type et statut
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
widget.evenement.typeEvenement.libelle,
style: theme.textTheme.bodySmall?.copyWith(
color: AppTheme.primaryColor,
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 4),
_buildStatusChip(),
],
),
),
// Bouton favori animé
if (widget.showActions)
GestureDetector(
onTap: _onFavoriteToggle,
child: Transform.scale(
scale: _favoriteScaleAnimation.value,
child: Icon(
_isFavorite ? Icons.favorite : Icons.favorite_border,
color: _favoriteColorAnimation.value,
size: 24,
),
),
),
],
),
const SizedBox(height: 16),
// Titre avec animation de couleur
AnimatedDefaultTextStyle(
duration: const Duration(milliseconds: 200),
style: theme.textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
color: _isHovered
? AppTheme.primaryColor
: theme.textTheme.titleLarge?.color,
) ?? const TextStyle(),
child: Text(widget.evenement.titre),
),
if (widget.evenement.description?.isNotEmpty == true) ...[
const SizedBox(height: 8),
Text(
widget.evenement.description!,
style: theme.textTheme.bodyMedium?.copyWith(
color: Colors.grey[600],
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
],
const SizedBox(height: 16),
// Informations de date et lieu avec icônes animées
Row(
children: [
_buildAnimatedInfo(
icon: Icons.calendar_today,
text: dateFormat.format(widget.evenement.dateDebut),
),
const SizedBox(width: 16),
_buildAnimatedInfo(
icon: Icons.access_time,
text: timeFormat.format(widget.evenement.dateDebut),
),
],
),
if (widget.evenement.lieu?.isNotEmpty == true) ...[
const SizedBox(height: 8),
_buildAnimatedInfo(
icon: Icons.location_on,
text: widget.evenement.lieu!,
),
],
],
),
),
),
),
),
),
);
},
);
}
Widget _buildStatusChip() {
Color statusColor;
switch (widget.evenement.statut) {
case StatutEvenement.planifie:
statusColor = Colors.orange;
break;
case StatutEvenement.confirme:
statusColor = Colors.green;
break;
case StatutEvenement.enCours:
statusColor = Colors.blue;
break;
case StatutEvenement.termine:
statusColor = Colors.grey;
break;
case StatutEvenement.annule:
statusColor = Colors.red;
break;
case StatutEvenement.reporte:
statusColor = Colors.purple;
break;
}
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: statusColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: statusColor.withOpacity(0.3)),
),
child: Text(
widget.evenement.statut.libelle,
style: TextStyle(
color: statusColor,
fontSize: 12,
fontWeight: FontWeight.w600,
),
),
);
}
Widget _buildAnimatedInfo({required IconData icon, required String text}) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
AnimatedContainer(
duration: const Duration(milliseconds: 200),
child: Icon(
icon,
size: 16,
color: _isHovered
? AppTheme.primaryColor
: Colors.grey[600],
),
),
const SizedBox(width: 4),
Text(
text,
style: TextStyle(
color: Colors.grey[600],
fontSize: 14,
),
),
],
);
}
}

242
unionflow-mobile-apps/lib/features/evenements/presentation/widgets/animated_evenement_list.dart Normal file
View File

@@ -0,0 +1,242 @@
import 'package:flutter/material.dart';
import '../../../../core/models/evenement_model.dart';
import '../../../../core/animations/loading_animations.dart';
import 'evenement_card.dart';
import 'animated_evenement_card.dart';
/// Widget animé pour afficher une liste d'événements avec animations d'apparition
class AnimatedEvenementList extends StatefulWidget {
final List<EvenementModel> evenements;
final Function(EvenementModel)? onEvenementTap;
final bool isLoading;
final VoidCallback? onRefresh;
const AnimatedEvenementList({
super.key,
required this.evenements,
this.onEvenementTap,
this.isLoading = false,
this.onRefresh,
});
@override
State<AnimatedEvenementList> createState() => _AnimatedEvenementListState();
}
class _AnimatedEvenementListState extends State<AnimatedEvenementList>
with TickerProviderStateMixin {
late AnimationController _listController;
List<AnimationController> _itemControllers = [];
List<Animation<double>> _itemAnimations = [];
List<Animation<Offset>> _slideAnimations = [];
@override
void initState() {
super.initState();
_initializeAnimations();
}
@override
void didUpdateWidget(AnimatedEvenementList oldWidget) {
super.didUpdateWidget(oldWidget);
if (widget.evenements.length != oldWidget.evenements.length) {
_updateAnimations();
}
}
@override
void dispose() {
_listController.dispose();
for (final controller in _itemControllers) {
controller.dispose();
}
super.dispose();
}
void _initializeAnimations() {
_listController = AnimationController(
duration: const Duration(milliseconds: 600),
vsync: this,
);
_updateAnimations();
_listController.forward();
}
void _updateAnimations() {
// Dispose des anciens controllers s'ils existent
if (_itemControllers.isNotEmpty) {
for (final controller in _itemControllers) {
controller.dispose();
}
}
// Créer de nouveaux controllers pour chaque élément
_itemControllers = List.generate(
widget.evenements.length,
(index) => AnimationController(
duration: Duration(milliseconds: 300 + (index * 100)),
vsync: this,
),
);
// Animations de fade et scale
_itemAnimations = _itemControllers.map((controller) {
return Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: controller,
curve: Curves.easeOutCubic,
),
);
}).toList();
// Animations de slide depuis le bas
_slideAnimations = _itemControllers.map((controller) {
return Tween<Offset>(
begin: const Offset(0, 0.3),
end: Offset.zero,
).animate(
CurvedAnimation(
parent: controller,
curve: Curves.easeOutCubic,
),
);
}).toList();
// Démarrer les animations avec un délai progressif
for (int i = 0; i < _itemControllers.length; i++) {
Future.delayed(Duration(milliseconds: i * 150), () {
if (mounted) {
_itemControllers[i].forward();
}
});
}
}
@override
Widget build(BuildContext context) {
if (widget.isLoading && widget.evenements.isEmpty) {
return _buildLoadingState();
}
if (widget.evenements.isEmpty) {
return _buildEmptyState();
}
return RefreshIndicator(
onRefresh: () async {
widget.onRefresh?.call();
await Future.delayed(const Duration(milliseconds: 500));
},
child: ListView.builder(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.all(16),
itemCount: widget.evenements.length + (widget.isLoading ? 1 : 0),
itemBuilder: (context, index) {
if (index >= widget.evenements.length) {
return _buildLoadingIndicator();
}
return _buildAnimatedItem(index);
},
),
);
}
Widget _buildAnimatedItem(int index) {
final evenement = widget.evenements[index];
if (index >= _itemAnimations.length) {
// Fallback pour les nouveaux éléments
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: AnimatedEvenementCard(
evenement: evenement,
onTap: () => widget.onEvenementTap?.call(evenement),
),
);
}
return AnimatedBuilder(
animation: _itemAnimations[index],
builder: (context, child) {
return SlideTransition(
position: _slideAnimations[index],
child: FadeTransition(
opacity: _itemAnimations[index],
child: Transform.scale(
scale: 0.8 + (0.2 * _itemAnimations[index].value),
child: Padding(
padding: const EdgeInsets.only(bottom: 16),
child: AnimatedEvenementCard(
evenement: evenement,
onTap: () => widget.onEvenementTap?.call(evenement),
),
),
),
),
);
},
);
}
Widget _buildLoadingState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
LoadingAnimations.waves(),
const SizedBox(height: 24),
const Text(
'Chargement des événements...',
style: TextStyle(
fontSize: 16,
color: Colors.grey,
),
),
],
),
);
}
Widget _buildEmptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.event_busy,
size: 80,
color: Colors.grey[400],
),
const SizedBox(height: 24),
Text(
'Aucun événement trouvé',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.grey[600],
),
),
const SizedBox(height: 8),
Text(
'Les événements apparaîtront ici',
style: TextStyle(
fontSize: 14,
color: Colors.grey[500],
),
),
],
),
);
}
Widget _buildLoadingIndicator() {
return Padding(
padding: const EdgeInsets.all(16),
child: Center(
child: LoadingAnimations.dots(),
),
);
}
}