Skip to content

Commit 11aa429

Browse files
SaadArdatiBirjuVachhani
SaadArdati
authored and
BirjuVachhani
committed
🔧 Update Pack V1 #10
1 parent 6538152 commit 11aa429

File tree

7 files changed

+222
-192
lines changed

7 files changed

+222
-192
lines changed

‎example/lib/stories/text_animation.dart‎

Lines changed: 132 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,6 @@ class TextAnimation extends StatefulWidget {
1414
}
1515

1616
class _TextAnimationState extends State<TextAnimation> {
17-
bool selected = false;
18-
1917
List<String> translations = [
2018
'Hello',
2119
'Bonjour',
@@ -35,123 +33,170 @@ class _TextAnimationState extends State<TextAnimation> {
3533
int lastTranslation = 0;
3634
int translation = 0;
3735

36+
late Timer timer;
3837
@override
3938
void initState() {
4039
super.initState();
4140

42-
Timer.periodic(Duration(milliseconds: (2000 * timeDilation).toInt()),
43-
(timer) {
41+
timer = Timer.periodic(
42+
Duration(milliseconds: (2000 * timeDilation).toInt()), (timer) {
4443
setState(() {
4544
lastTranslation = translation;
4645
translation = (translation + 1) % translations.length;
4746
});
4847
});
4948
}
5049

50+
@override
51+
void dispose() {
52+
timer.cancel();
53+
super.dispose();
54+
}
55+
5156
@override
5257
Widget build(BuildContext context) {
53-
return Stack(
54-
alignment: Alignment.center,
58+
return Column(
59+
crossAxisAlignment: CrossAxisAlignment.center,
60+
mainAxisAlignment: MainAxisAlignment.center,
5561
children: [
56-
Positioned(
57-
bottom: -650,
58-
width: 500,
59-
height: 1040,
60-
child: Container(
61-
decoration: BoxDecoration(
62-
color: Colors.white,
63-
borderRadius: BorderRadius.circular(100),
64-
border: Border.all(
65-
color: Theme.of(context).colorScheme.onPrimary,
66-
width: 2,
67-
),
68-
),
69-
clipBehavior: Clip.hardEdge,
70-
child: const ColorPalettePage(),
71-
),
72-
),
73-
Positioned(
74-
bottom: -650,
75-
child: IgnorePointer(
76-
child: Image.asset(
77-
'assets/iphone15pro_1024x.png',
78-
width: 512,
79-
),
80-
),
81-
),
82-
Positioned(
83-
top: 100,
84-
child: Row(
85-
mainAxisSize: MainAxisSize.min,
86-
children: [
87-
ShaderMask(
62+
const SizedBox(height: 32),
63+
Row(
64+
mainAxisSize: MainAxisSize.min,
65+
children: [
66+
ShaderMask(
67+
shaderCallback: (rect) => LinearGradient(
68+
begin: Alignment.topCenter,
69+
end: Alignment.bottomCenter,
70+
colors: [
71+
Colors.white.withOpacity(0),
72+
Colors.white,
73+
Colors.white,
74+
Colors.white,
75+
Colors.white,
76+
Colors.white.withOpacity(0),
77+
// Colors.white,
78+
],
79+
).createShader(rect),
80+
child: ShaderMask(
8881
shaderCallback: (rect) => LinearGradient(
89-
begin: Alignment.topCenter,
90-
end: Alignment.bottomCenter,
9182
colors: [
92-
Colors.white.withOpacity(0),
93-
Colors.white,
9483
Colors.white,
95-
Colors.white,
96-
Colors.white,
97-
Colors.white.withOpacity(0),
84+
Colors.blueAccent.withOpacity(0.5),
9885
// Colors.white,
9986
],
10087
).createShader(rect),
101-
child: ShaderMask(
102-
shaderCallback: (rect) => LinearGradient(
103-
colors: [
104-
Colors.white,
105-
Colors.blueAccent.withOpacity(0.5),
106-
// Colors.white,
107-
],
108-
).createShader(rect),
109-
child: Text(
110-
translations[lastTranslation],
111-
style: GoogleFonts.sacramento().copyWith(
112-
color: Colors.white,
113-
fontWeight: FontWeight.bold,
114-
fontSize: 56,
88+
child: Text(
89+
translations[lastTranslation],
90+
style: GoogleFonts.sacramento().copyWith(
91+
color: Colors.white,
92+
fontWeight: FontWeight.bold,
93+
fontSize: 56,
94+
),
95+
)
96+
.roll(
97+
translations[translation],
98+
symbolDistanceMultiplier: 2,
99+
tapeCurve: Curves.easeInOutBack,
100+
widthCurve: Curves.easeInOutQuart,
101+
padding: const EdgeInsets.only(right: 3),
102+
)
103+
.animate(
104+
toggle: translation,
105+
duration: const Duration(milliseconds: 1000),
115106
),
116-
)
117-
.roll(
118-
translations[translation],
119-
symbolDistanceMultiplier: 2,
120-
tapeCurve: Curves.easeInOutBack,
121-
widthCurve: Curves.easeInOutQuart,
122-
padding: const EdgeInsets.only(right: 3),
123-
)
124-
.animate(
125-
toggle: translation,
126-
duration: const Duration(milliseconds: 1000),
127-
),
128-
),
129107
),
130-
Text(
131-
', Stranger',
132-
style: GoogleFonts.sacramento().copyWith(
133-
color: Colors.white,
134-
fontSize: 56,
108+
),
109+
Text(
110+
', Stranger',
111+
style: GoogleFonts.sacramento().copyWith(
112+
color: Colors.white,
113+
fontSize: 56,
114+
),
115+
strutStyle: const StrutStyle(
116+
fontSize: 56,
117+
height: 1,
118+
forceStrutHeight: true,
119+
leading: 1,
120+
),
121+
),
122+
],
123+
),
124+
const SizedBox(height: 56),
125+
Container(
126+
padding: const EdgeInsets.symmetric(horizontal: 16),
127+
decoration: BoxDecoration(
128+
color: const Color(0xFF272727),
129+
borderRadius: BorderRadius.circular(32),
130+
),
131+
child: const Text('Hello😀😃😄😁😆😅😂🤣🥲🥹☺️😊😇🙂🙃😉😌Sexy')
132+
.roll(
133+
'World🧳🌂☂️🧵🪡🪢🪭🧶👓🕶🥽🥼🦺👔👕👖🧣Effect',
134+
tapeStrategy: const ConsistentSymbolTapeStrategy(4),
135+
tapeCurve: Curves.easeInOutQuart,
136+
widthCurve: Curves.easeOutQuart,
137+
symbolDistanceMultiplier: 2,
138+
clipBehavior: Clip.none,
139+
)
140+
.animate(
141+
toggle: translation,
142+
reverse: true,
143+
duration: const Duration(milliseconds: 1000),
144+
),
145+
),
146+
const SizedBox(height: 56),
147+
const LikeButton(),
148+
Expanded(
149+
child: Stack(
150+
alignment: Alignment.center,
151+
children: [
152+
Positioned(
153+
bottom: -650,
154+
width: 500,
155+
height: 1040,
156+
child: Container(
157+
decoration: BoxDecoration(
158+
color: Colors.white,
159+
borderRadius: BorderRadius.circular(100),
160+
border: Border.all(
161+
color: Theme.of(context).colorScheme.onPrimary,
162+
width: 2,
163+
),
164+
),
165+
clipBehavior: Clip.hardEdge,
166+
child: const ColorPalettePage(),
135167
),
136-
strutStyle: const StrutStyle(
137-
fontSize: 56,
138-
height: 1,
139-
forceStrutHeight: true,
140-
leading: 1,
168+
),
169+
Positioned(
170+
bottom: -650,
171+
child: IgnorePointer(
172+
child: Image.asset(
173+
'assets/iphone15pro_1024x.png',
174+
width: 512,
175+
),
141176
),
142177
),
143178
],
144179
),
145180
),
146-
const Positioned(
147-
bottom: 450,
148-
child: LikeButton(),
149-
),
150181
],
151182
);
152183
}
153184
}
154185

186+
class RisingStrong extends StatefulWidget {
187+
const RisingStrong({super.key});
188+
189+
@override
190+
State<RisingStrong> createState() => _RisingStrongState();
191+
}
192+
193+
class _RisingStrongState extends State<RisingStrong> {
194+
@override
195+
Widget build(BuildContext context) {
196+
return const Placeholder();
197+
}
198+
}
199+
155200
class LikeButton extends StatefulWidget {
156201
const LikeButton({super.key});
157202

@@ -247,15 +292,14 @@ class _LikeButtonState extends State<LikeButton> {
247292
.copyWith(color: Colors.white, fontSize: 16),
248293
)
249294
.roll(
250-
'Wow did you just share?',
295+
'Thanks for sharing!',
251296
tapeStrategy:
252297
const ConsistentSymbolTapeStrategy(0, true),
253298
symbolDistanceMultiplier: 2,
254299
clipBehavior: Clip.none,
255300
tapeCurve:
256301
toggleShare ? Curves.bounceOut : Curves.bounceIn,
257302
widthCurve: Curves.bounceOut,
258-
interpolateWidthPerSymbol: true,
259303
staggerTapes: false,
260304
)
261305
.animate(
@@ -309,7 +353,6 @@ class _LikeButtonState extends State<LikeButton> {
309353
clipBehavior: Clip.none,
310354
tapeCurve: Curves.easeOutBack,
311355
widthCurve: Curves.easeOutQuart,
312-
interpolateWidthPerSymbol: true,
313356
staggerSoftness: 100,
314357
)
315358
.animate(

‎lib/src/effect_builder.dart‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,8 @@ class _AnimatableEffectState extends State<AnimatableEffect> {
4949
late double previousAnimationValue = 0;
5050

5151
/// Pulls the parent [EffectAnimationValue] inherited widget.
52-
EffectAnimationValue? get effectAnimationValue => EffectAnimationValue.maybeOf(context);
52+
EffectAnimationValue? get effectAnimationValue =>
53+
EffectAnimationValue.maybeOf(context);
5354

5455
/// Pulls the animation value from the parent [EffectAnimationValue] widget.
5556
double get animationValue => effectAnimationValue?.curvedValue ?? 0;
@@ -65,8 +66,7 @@ class _AnimatableEffectState extends State<AnimatableEffect> {
6566
super.didUpdateWidget(oldWidget);
6667
if (oldWidget.end != widget.end &&
6768
oldWidget.end.runtimeType == widget.end.runtimeType) {
68-
if (effectAnimationValue != null &&
69-
!effectAnimationValue!.isTransition) {
69+
if (effectAnimationValue != null && !effectAnimationValue!.isTransition) {
7070
begin = begin.lerp(end, previousAnimationValue);
7171
}
7272

0 commit comments

Comments
 (0)