Browse Source

add: slide down animation to home page

pull/33/head
AmirrezaChegini 2 days ago
parent
commit
e9ad70c225
  1. 67
      lib/core/widgets/animations/slide_down_fade.dart
  2. 66
      lib/features/home/presentation/ui/home_page.dart

67
lib/core/widgets/animations/slide_down_fade.dart

@ -0,0 +1,67 @@
import 'package:flutter/material.dart';
class SlideDownFade extends StatefulWidget {
const SlideDownFade({
super.key,
required this.child,
this.delay = Duration.zero,
});
final Widget child;
final Duration delay;
@override
State<SlideDownFade> createState() => _SlideDownFadeState();
}
class _SlideDownFadeState extends State<SlideDownFade>
with SingleTickerProviderStateMixin {
late AnimationController _controller;
late Animation<double> _fadeAnim;
late Animation<Offset> _slideAnim;
@override
void initState() {
super.initState();
_controller = AnimationController(
vsync: this,
duration: Duration(milliseconds: 500),
reverseDuration: Duration(milliseconds: 500),
);
_fadeAnim = Tween<double>(
begin: 0,
end: 1,
).animate(CurvedAnimation(parent: _controller, curve: Curves.easeIn));
_slideAnim = Tween<Offset>(
begin: Offset(0, -0.1),
end: Offset.zero,
).animate(CurvedAnimation(parent: _controller, curve: Curves.easeIn));
startAnim();
}
Future<void> startAnim() async {
await Future.delayed(widget.delay, () {
_controller.forward();
});
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: _controller,
child: widget.child,
builder: (context, child) => FadeTransition(
opacity: _fadeAnim,
child: SlideTransition(position: _slideAnim, child: child),
),
);
}
}

66
lib/features/home/presentation/ui/home_page.dart

@ -5,6 +5,8 @@ import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
import 'package:hadi_hoda_flutter/core/utils/my_localization.dart';
import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
import 'package:hadi_hoda_flutter/core/widgets/animations/slide_down_fade.dart';
import 'package:hadi_hoda_flutter/core/widgets/animations/slide_up_fade.dart';
import 'package:hadi_hoda_flutter/core/widgets/button/my_yellow_button.dart';
import 'package:hadi_hoda_flutter/core/widgets/images/my_image.dart';
import 'package:hadi_hoda_flutter/core/widgets/inkwell/my_inkwell.dart';
@ -47,14 +49,17 @@ class HomePage extends StatelessWidget {
return PositionedDirectional(
top: MySpaces.s36,
end: MySpaces.s16,
child: StreamBuilder<double>(
initialData: 1,
stream: context.read<HomeBloc>().volumeStream,
builder: (context, snapshot) => MyInkwell(
onTap: () => context.read<HomeBloc>().changeMute(),
child: MyImage(
image: snapshot.data == 0 ? MyAssets.musicOff : MyAssets.musicOn,
size: setSize(context: context, tablet: 100),
child: SlideDownFade(
delay: Duration(milliseconds: 200),
child: StreamBuilder<double>(
initialData: 1,
stream: context.read<HomeBloc>().volumeStream,
builder: (context, snapshot) => MyInkwell(
onTap: () => context.read<HomeBloc>().changeMute(),
child: MyImage(
image: snapshot.data == 0 ? MyAssets.musicOff : MyAssets.musicOn,
size: setSize(context: context, tablet: 100),
),
),
),
),
@ -87,29 +92,32 @@ class HomePage extends StatelessWidget {
bottom: MySpaces.s40,
left: MySpaces.s16,
right: MySpaces.s16,
child: Row(
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
MyInkwell(
onTap: () => context.read<HomeBloc>().goToLanguagePage(context),
child: MyImage(
image: MyAssets.language,
size: setSize(context: context, tablet: 100),
child: SlideUpFade(
delay: Duration(milliseconds: 200),
child: Row(
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
MyInkwell(
onTap: () => context.read<HomeBloc>().goToLanguagePage(context),
child: MyImage(
image: MyAssets.language,
size: setSize(context: context, tablet: 100),
),
),
),
MyYellowButton(
onTap: () => context.read<HomeBloc>().goToLevelPage(context),
title: context.translate.start,
),
MyInkwell(
onTap: () => context.read<HomeBloc>().showAboutUs(context),
child: MyImage(
image: MyAssets.theme,
size: setSize(context: context, tablet: 100),
MyYellowButton(
onTap: () => context.read<HomeBloc>().goToLevelPage(context),
title: context.translate.start,
),
),
],
MyInkwell(
onTap: () => context.read<HomeBloc>().showAboutUs(context),
child: MyImage(
image: MyAssets.theme,
size: setSize(context: context, tablet: 100),
),
),
],
),
),
);
}

Loading…
Cancel
Save