import 'dart:async'; import 'package:flutter/material.dart'; import 'package:pmu/domain/card.dart'; typedef OnLikeCallback = void Function(String title, bool isLiked)?; const double NORMAL_ICON_SCALE = 2.0; const double SCALED_ICON_SCALE = 2.5; class CardPost extends StatefulWidget { final String description; final String? imageUrl; final bool isLiked; final String name; final OnLikeCallback onLike; final VoidCallback? onTap; const CardPost(this.name, this.description, this.imageUrl, this.isLiked, this.onLike, this.onTap); factory CardPost.fromData(CardPostData data, {OnLikeCallback onLike, VoidCallback? onTap}) => CardPost(data.name, data.description, data.imageUrl, data.isLiked, onLike, onTap); @override State createState() => _CardPostState(); } class _CardPostState extends State { bool isLiked = false; double iconScale = NORMAL_ICON_SCALE; void _onLikeTap() { setState(() { isLiked = !isLiked; iconScale = SCALED_ICON_SCALE; // Increase scale temporarily }); // Reset the scale back to normal after 250 milliseconds Timer(const Duration(milliseconds: 110), () { setState(() { iconScale = NORMAL_ICON_SCALE; }); }); } @override Widget build(BuildContext context) { return GestureDetector( onTap: widget.onTap, child: Container( margin: const EdgeInsets.all(10), padding: const EdgeInsets.all(10), decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), color: Colors.blue, border: Border.all( color: Colors.blue, width: 0.5, ), boxShadow: const [ BoxShadow( color: Colors.black12, offset: Offset( 0.0, 5.0, ), blurRadius: 4.0, spreadRadius: 1.0, ), ], ), child: Column( children: [ Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Flexible( child: Text( widget.name, style: const TextStyle( color: Colors.white, fontSize: 30, ), ), ), ], ), Padding( padding: const EdgeInsets.only(top: 6.0), child: Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Flexible( child: Text( widget.description, textAlign: TextAlign.center, style: const TextStyle( color: Colors.white, fontSize: 24, ), ), ), ], ), ), if (widget.imageUrl != null) Padding( padding: const EdgeInsets.all(8.0), child: Image.network(widget.imageUrl!, height: 500, width: double.infinity, fit: BoxFit.fitWidth), ), Padding( padding: const EdgeInsets.all(4.0), child: Row( mainAxisAlignment: MainAxisAlignment.center, children: [ GestureDetector( onTap: () => { setState(() { isLiked = !isLiked; iconScale = SCALED_ICON_SCALE; Timer(const Duration(milliseconds: 110), () { setState(() { iconScale = NORMAL_ICON_SCALE; }); }); widget.onLike?.call(widget.name, isLiked); }) }, child: AnimatedScale(scale: iconScale, duration: const Duration(milliseconds: 250), child: AnimatedSwitcher( duration: const Duration(milliseconds: 250), child: isLiked ? const Icon( Icons.favorite, color: Colors.red, key: ValueKey( 1),) : const Icon( Icons.favorite_border, color: Colors.black, key: ValueKey(1) ) ) ), ), ], ), ) ], ), ) ); } }