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

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

ただいまの
回答率

88.78%

AnimationControllerのvelocityをprintさせる方法について

解決済

回答 1

投稿

  • 評価
  • クリップ 0
  • VIEW 369

copp

score 11

前提・実現したいこと

ソースは下記を参考にさせて頂いております
https://flutter-widget.live/widgets/PositionedTransition

ここに質問の内容を詳しく書いてください。
Andoroid Studioを使用しFlutterの勉強をしております。
その際にAnimationControllerのvelocityをprintしようと思ったのですが
どのように記載すればいいのか分かりませんでした。

また、デバッグで_controllerを表示させた場合でもvelocityがどこにあるか分かりませんでした

お手数ではございますが、御教唆お願いいたします。

該当のソースコード

dart

ソースコード
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>
    with SingleTickerProviderStateMixin {
  final RelativeRectTween relativeRectTween = RelativeRectTween(
    begin: RelativeRect.fromLTRB(40, 40, 0, 0),
    end: RelativeRect.fromLTRB(0, 0, 40, 40),
  );

  AnimationController _controller;

  bool _first = true;

  initState() {
    _controller = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 1),
    );
    super.initState();
  }

  void _toggleVelocity() {
// ここでprintやデバッグを試しました
    _controller.fling(velocity: _first ? -1 : 1);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          Container(
            color: Colors.blue[50],
            height: 300,
            child: Stack(
              children: <Widget>[
                PositionedTransition(
                  rect: relativeRectTween.animate(_controller),
                  child: Container(
                    child: Container(
                      width: 200,
                      height: 200,
                      padding: EdgeInsets.all(20),
                      child: FlutterLogo(),
                    ),
                  ),
                ),
              ],
            ),
          ),
          SizedBox(
            height: 20,
          ),
          FlatButton(
            onPressed: () {
              _toggleVelocity();
              _first = !_first;
            },
            child: Text(
              "CLICK ME!",
            ),
          )
        ],
      ),
    );
  }
}

試したこと

AnimationController _controller;
print(_controller.fling);

補足情報(FW/ツールのバージョンなど)

Flutter 1.16.4-pre.33 
Dart 2.8.0 (build 2.8.0-dev.17.0 1402e8e1a4)

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

+1

print(_controller.velocity)を実行すればその時の速度が見れると思います。

ただし _toggleVelocity() 内で print(_controller.velocity) を実行しても、ボタンを押した時の速度なので、速度の変化とかはみれないと思います。

WidgetsBinding.instance.addPersistentFrameCallback を使えば、描画(フレーム)毎の速度を出力できそうだったので、試してみてください。 initState() に以下の処理を入れるだけです。

    WidgetsBinding.instance
        .addPersistentFrameCallback((_) => print(_controller.velocity));

以下の様に出力されるはずです

flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: 0.9999998807907104
flutter: 8.109345614910126
flutter: 8.216215908527374
flutter: 6.395259886980057
flutter: 5.265292972326279
flutter: 3.314701847732067
flutter: 2.564506560564041
flutter: 1.4837996698915958
flutter: 1.114069551229477
flutter: 0.6159159000962973
flutter: 0.45433399453759193
flutter: 0.24411545787006617
flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: 0.0
flutter: -0.9999998807907104
flutter: -8.10939335823059
flutter: -8.216189920902252
flutter: -7.47108656167984
flutter: -5.265226826071739
flutter: -4.219144865870476
flutter: -2.5645470172166824
flutter: -1.9602973200380802
flutter: -1.1140501573681831
flutter: -0.8307190164923668
flutter: -0.4543256387114525
flutter: -0.33367072744295
flutter: 0.0

念のため、動作確認した完全なコードも載せておきます

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>
    with SingleTickerProviderStateMixin {
  final RelativeRectTween relativeRectTween = RelativeRectTween(
    begin: RelativeRect.fromLTRB(40, 40, 0, 0),
    end: RelativeRect.fromLTRB(0, 0, 40, 40),
  );

  AnimationController _controller;

  bool _first = true;

  initState() {
    _controller = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 1),
    );
    WidgetsBinding.instance
        .addPersistentFrameCallback((_) => print(_controller.velocity));
    super.initState();
  }

  void _toggleVelocity() {
// ここでprintやデバッグを試しました
    _controller.fling(velocity: _first ? -1 : 1);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          Container(
            color: Colors.blue[50],
            height: 300,
            child: Stack(
              children: <Widget>[
                PositionedTransition(
                  rect: relativeRectTween.animate(_controller),
                  child: Container(
                    child: Container(
                      width: 200,
                      height: 200,
                      padding: EdgeInsets.all(20),
                      child: FlutterLogo(),
                    ),
                  ),
                ),
              ],
            ),
          ),
          SizedBox(
            height: 20,
          ),
          FlatButton(
            onPressed: () {
              _toggleVelocity();
              _first = !_first;
            },
            child: Text(
              "CLICK ME!",
            ),
          )
        ],
      ),
    );
  }
}

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/04/03 22:42

    詳しいご返答ありがとうございます。
    _controller.fling. ... ではなく _controller.velocityなのですね。
    また、WidgetsBindingクラス自体知りらず、すごく勉強になりました。

    popobotさんには何度も詳しく答えて頂き、本当にありがとうございます。

    キャンセル

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

  • ただいまの回答率 88.78%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る