implemented SnackBar appearance
This commit is contained in:
parent
ff75a800ef
commit
e1e9ca4194
@ -14,11 +14,14 @@ class _CardData {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
typedef OnLikeCallback = void Function(String title, bool isLiked)?;
|
||||||
|
|
||||||
class _Card extends StatefulWidget {
|
class _Card extends StatefulWidget {
|
||||||
final String title;
|
final String title;
|
||||||
final String description;
|
final String description;
|
||||||
final IconData icon;
|
final IconData icon;
|
||||||
final String? imageUrl;
|
final String? imageUrl;
|
||||||
|
final OnLikeCallback onLike;
|
||||||
|
|
||||||
const _Card({
|
const _Card({
|
||||||
super.key,
|
super.key,
|
||||||
@ -26,13 +29,18 @@ class _Card extends StatefulWidget {
|
|||||||
required this.description,
|
required this.description,
|
||||||
this.icon = Icons.hail,
|
this.icon = Icons.hail,
|
||||||
this.imageUrl,
|
this.imageUrl,
|
||||||
|
this.onLike,
|
||||||
});
|
});
|
||||||
|
|
||||||
factory _Card.fromData(_CardData data) => _Card(
|
factory _Card.fromData(
|
||||||
|
_CardData data, {
|
||||||
|
final OnLikeCallback onLike,
|
||||||
|
}) => _Card(
|
||||||
title: data.title,
|
title: data.title,
|
||||||
description: data.description,
|
description: data.description,
|
||||||
icon: data.icon,
|
icon: data.icon,
|
||||||
imageUrl: data.imageUrl,
|
imageUrl: data.imageUrl,
|
||||||
|
onLike: onLike,
|
||||||
);
|
);
|
||||||
|
|
||||||
@override
|
@override
|
||||||
@ -81,7 +89,7 @@ class _CardState extends State<_Card> {
|
|||||||
),
|
),
|
||||||
Flexible(
|
Flexible(
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.only(left: 15.0),
|
padding: const EdgeInsets.only(left: 12.0, top: 12, bottom: 12),
|
||||||
child: Column(
|
child: Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
@ -105,6 +113,7 @@ class _CardState extends State<_Card> {
|
|||||||
setState(() {
|
setState(() {
|
||||||
isLiked = !isLiked;
|
isLiked = !isLiked;
|
||||||
});
|
});
|
||||||
|
widget.onLike?.call(widget.title, isLiked);
|
||||||
},
|
},
|
||||||
child: AnimatedSwitcher(
|
child: AnimatedSwitcher(
|
||||||
duration: const Duration(milliseconds: 100),
|
duration: const Duration(milliseconds: 100),
|
||||||
|
@ -12,6 +12,18 @@ class MyHomePage extends StatefulWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _MyHomePageState extends State<MyHomePage> {
|
class _MyHomePageState extends State<MyHomePage> {
|
||||||
|
@override
|
||||||
|
void initState() {
|
||||||
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||||
|
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
|
||||||
|
content: Text('Hello', style: Theme.of(context).textTheme.bodyLarge),
|
||||||
|
backgroundColor: Colors.deepPurple.shade200,
|
||||||
|
duration: const Duration(seconds: 4),
|
||||||
|
));
|
||||||
|
});
|
||||||
|
super.initState();
|
||||||
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
@ -52,9 +64,22 @@ class Body extends StatelessWidget {
|
|||||||
child: SingleChildScrollView(
|
child: SingleChildScrollView(
|
||||||
child: Column(
|
child: Column(
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
children: cardsData.map((e) => _Card.fromData(e)).toList(),
|
children: cardsData.map((e) => _Card.fromData(e, onLike: (title, isLiked) => _showSnackBar(context, title, isLiked))).toList(),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
void _showSnackBar(BuildContext context, String title, bool isLiked) {
|
||||||
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||||
|
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
|
||||||
|
content: Text(
|
||||||
|
'Card $title ${isLiked ? 'liked' : 'disliked'}',
|
||||||
|
style: Theme.of(context).textTheme.bodyLarge
|
||||||
|
),
|
||||||
|
backgroundColor: Colors.deepPurple.shade200,
|
||||||
|
duration: const Duration(seconds: 2),
|
||||||
|
));
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user