-Animation
を別クラスで独立させたいのですが、
エラーが出てしまいます
(※animation.Dart
を追加作成し、home.dart
から その追加クラスを呼ぶイメージ)
error
1type '_AnimatedEvaluation<double>' is not a subtype of type 'AnimationController'
解決策を教えて頂けると嬉しいです。
尚、home.dartのみでのアニメーション作成は正常に動作します。
home.dartからanimation.Dart
のクラス(RippleAnimation
クラス)を呼ぶと、上記のエラーが表示されます。
アニメーションの呼び出しは出来ないのでしょうか?
以下、アニメーションのコードです。
RippleAnimation
1import 'package:flutter/material.dart'; 2 3class RippleAnimation extends StatefulWidget { 4 @override 5 _RippleAnimationState createState() => _RippleAnimationState(); 6} 7 8class _RippleAnimationState extends State<RippleAnimation> with TickerProviderStateMixin{ 9 AnimationController rippleController; 10 AnimationController scaleController; 11 12 Animation<double> rippleAnimation; 13 Animation<double> scaleAnimation; 14 15 @override 16 void initState() { 17 18 rippleController = AnimationController(vsync: this, duration: Duration(seconds: 1)); 19 scaleController = AnimationController(vsync: this, duration: Duration(seconds: 1)); 20 21 rippleAnimation = Tween<double> (begin: 80.0, end: 90.0) 22 .animate(rippleController) 23 ..addStatusListener((status) { 24 if (status == AnimationStatus.completed) { 25 rippleController.reverse(); 26 } else if(status == AnimationStatus.dismissed){ 27 rippleController.forward(); 28 } 29 }); 30 31 scaleController = Tween<double> (begin: 1.0, end: 30.0) 32 .animate(scaleController); 33 34 rippleController.forward(); 35 36 super.initState(); 37 } 38 39 @override 40 void dispose() { 41 rippleController.dispose(); 42 scaleController.dispose(); 43 super.dispose(); 44 }
RippleAnimation
1 @override 2 Widget build(BuildContext context) { 3 return Align( 4 alignment: Alignment.bottomCenter, 5 child: AnimatedBuilder( 6 animation: rippleAnimation, 7 builder: (context, child) => Container( 8 width: rippleAnimation.value, 9 height: rippleAnimation.value, 10 child: Container( 11 decoration: BoxDecoration( 12 shape: BoxShape.circle, 13 color: Colors.blue.withOpacity(.4), 14 ), 15 child: InkWell( 16 onTap: () { 17 scaleController.forward(); 18 }, 19 child: AnimatedBuilder( 20 animation: scaleAnimation, 21 builder: (context, child) => Transform.scale( 22 scale: scaleAnimation.value, 23 child: Container( 24 margin: EdgeInsets.all(10), 25 decoration: BoxDecoration( 26 shape: BoxShape.circle, 27 color: Colors.blue 28 ), 29 ), 30 ), 31 ), 32 ), 33 ), 34 )), 35 ); 36 } 37}
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。