質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Android

Androidは、Google社が開発したスマートフォンやタブレットなど携帯端末向けのプラットフォームです。 カーネル・ミドルウェア・ユーザーインターフェイス・ウェブブラウザ・電話帳などのアプリケーションやソフトウェアをひとつにまとめて構成。 カーネル・ライブラリ・ランタイムはほとんどがC言語/C++、アプリケーションなどはJavaSEのサブセットとAndroid環境で書かれています。

Android Studio

Android Studioは、 Google社によって開発された、 Androidのネイティブアプリケーション開発に特化した統合開発ツールです。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

Q&A

解決済

1回答

1401閲覧

Animationを、別クラスに分けたい【Flutter】

kazuki_user

総合スコア147

Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Android

Androidは、Google社が開発したスマートフォンやタブレットなど携帯端末向けのプラットフォームです。 カーネル・ミドルウェア・ユーザーインターフェイス・ウェブブラウザ・電話帳などのアプリケーションやソフトウェアをひとつにまとめて構成。 カーネル・ライブラリ・ランタイムはほとんどがC言語/C++、アプリケーションなどはJavaSEのサブセットとAndroid環境で書かれています。

Android Studio

Android Studioは、 Google社によって開発された、 Androidのネイティブアプリケーション開発に特化した統合開発ツールです。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

0グッド

0クリップ

投稿2020/07/23 08:11

-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}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

非表示の原因は、Transform.scale()のカッコ内にchild: Container~が
含まれていなかったこと。

投稿2020/07/24 04:37

編集2020/07/24 04:37
kazuki_user

総合スコア147

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問