flutter RotationTransition实现旋转动画

本文实例为大家分享了flutter RotationTransition实现旋转动画的具体代码,供大家参考,具体内容如下

flutter 动画状态监听器

AnimationController

 //动画控制器
  AnimationController controller;
 //AnimationController是一个特殊的Animation对象,在屏幕刷新的每一帧,就会生成一个新的值,
 // 默认情况下,AnimationController在给定的时间段内会线性的生成从0.0到1.0的数字
 //用来控制动画的开始与结束以及设置动画的监听
 //vsync参数,存在vsync时会防止屏幕外动画(动画的UI不在当前屏幕时)消耗不必要的资源
 //duration 动画的时长,这里设置的 seconds: 2 为2秒,当然也可以设置毫秒 milliseconds:2000.
 controller =
  AnimationController(duration: const Duration(seconds: 2), vsync: this);
 //动画开始、结束、向前移动或向后移动时会调用StatusListener
 controller.addStatusListener((status) {
  if (status == AnimationStatus.completed) {
  //动画从 controller.reverse() 反向执行 结束时会回调此方法
  print("status is completed");
  // controller.reset(); 将动画重置到开始前的状态
  //开始执行
  //controller.forward();
  } else if (status == AnimationStatus.dismissed) {
  //动画从 controller.forward() 正向执行 结束时会回调此方法
  print("status is dismissed");
  //controller.forward();
  }else if (status == AnimationStatus.forward) {
  print("status is forward");
  //执行 controller.forward() 会回调此状态
  }else if (status == AnimationStatus.reverse) {
  //执行 controller.reverse() 会回调此状态
  print("status is reverse");
  }
 });

AnimationController 的常用操作说明

flutter AnimationStatus 动画状态说明

1 flutter RotationTransition实现旋转动画

 //动画控制器
 AnimationController controller;

 //AnimationController是一个特殊的Animation对象,在屏幕刷新的每一帧,就会生成一个新的值,
 // 默认情况下,AnimationController在给定的时间段内会线性的生成从0.0到1.0的数字
 //用来控制动画的开始与结束以及设置动画的监听
 //vsync参数,存在vsync时会防止屏幕外动画(动画的UI不在当前屏幕时)消耗不必要的资源
 //duration 动画的时长,这里设置的 seconds: 2 为2秒,当然也可以设置毫秒 milliseconds:2000.
 controller =
  AnimationController(duration: const Duration(seconds: 2), vsync: this);
 //动画开始、结束、向前移动或向后移动时会调用StatusListener
 controller.addStatusListener((status) {
  if (status == AnimationStatus.completed) {
  //动画从 controller.forward() 正向执行 结束时会回调此方法
  print("status is completed");
  } else if (status == AnimationStatus.dismissed) {
  //动画从 controller.reverse() 反向执行 结束时会回调此方法
  print("status is dismissed");
  } else if (status == AnimationStatus.forward) {
  print("status is forward");
  //执行 controller.forward() 会回调此状态
  } else if (status == AnimationStatus.reverse) {
  //执行 controller.reverse() 会回调此状态
  print("status is reverse");
  }
 });

执行动画的 widget

 //旋转
 Widget buildRotationTransition() {
 return Center(
  child: RotationTransition(
  //设置动画的旋转中心
  alignment: Alignment.center,
  //动画控制器
  turns: controller,
  //将要执行动画的子view
  child: Container(
   width: 100,
   height: 100,
   color: Colors.grey,
  ),
  ),
 );
 }
}

2 flutter RotationTransition实现无限循环旋转动画

实现方法 就是在动画结束的时候再开启动画

//动画开始、结束、向前移动或向后移动时会调用StatusListener
 controller.addStatusListener((status) {
  if (status == AnimationStatus.completed) {
  //动画从 controller.forward() 正向执行 结束时会回调此方法
  print("status is completed");
  //重置起点
  controller.reset();
  //开启
  controller.forward();
  } else if (status == AnimationStatus.dismissed) {
  //动画从 controller.reverse() 反向执行 结束时会回调此方法
  print("status is dismissed");
  } else if (status == AnimationStatus.forward) {
  print("status is forward");
  //执行 controller.forward() 会回调此状态
  } else if (status == AnimationStatus.reverse) {
  //执行 controller.reverse() 会回调此状态
  print("status is reverse");
  }
 });

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android开发之图形图像与动画(二)Animation实现图像的渐变/缩放/位移/旋转

    Android 平台提供了两类动画. 一类是Tween动画,就是对场景里的对象不断的进行图像变化来产生动画效果(旋转.平移.放缩和渐变). 下面就讲一下Tweene Animations. 主要类: Animation 动画 AlphaAnimation 渐变透明度 RotateAnimation 画面旋转 ScaleAnimation 渐变尺寸缩放 TranslateAnimation 位置移动 AnimationSet 动画集 一.AlphaAnimation 其中AlphaAnimatio

  • Android Tween动画之RotateAnimation实现图片不停旋转效果实例介绍

    主要介绍Android中如何使用rotate实现图片不停旋转的效果.Android 平台提供了两类动画,一类是 Tween 动画,即通过对场景里的对象不断做图像变换(平移.缩放.旋转)产生动画效果:第二类是 Frame 动画,即顺序播放事先做好的图像,跟电影类似.本文分析 Tween动画的rotate实现旋转效果. 在新浪微博客户端中各个操作进行中时activity的右上角都会有个不停旋转的图标,类似刷新的效果,给用户以操作中的提示.这种非模态的提示方式推荐使用,那么下面就分享下如何实现这种效果

  • Android实现屏幕旋转方法总结

    本文实例总结了Android实现屏幕旋转方法.分享给大家供大家参考.具体如下: 在介绍之前,我们需要先了解默认情况下android屏幕旋转的机制: 默认情况下,当用户手机的重力感应器打开后,旋转屏幕方向,会导致当前activity发生onDestroy-> onCreate,这样会重新构造当前activity和界面布局,如果在Camera界面,则表现为卡顿或者黑屏一段时间.如果是在横竖屏UI设计方面,那么想很好地支持屏幕旋转,则建议在res中建立layout-land和layout-port两个

  • Android 图片缩放与旋转的实现详解

    本文使用Matrix实现Android实现图片缩放与旋转.示例代码如下: 复制代码 代码如下: package com.android.matrix;import android.app.Activity;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.Matrix;import android.graphics.drawable.BitmapDrawable

  • Android编程中调用Camera时预览画面有旋转问题的解决方法

    本文实例讲述了Android编程中调用Camera时预览画面有旋转问题的解决方法.分享给大家供大家参考,具体如下: 在调用Camera写应用的时候,前后摄像头的情况有时候是不一样的.有时候,明明后摄像头没有问题,而调用到前摄像头时,却倒转了180°,或者其他角度,百思不得其解.在查看了Android源码之后,发现它的解决办法很是好,接下来贴个源码,以备日后查看. public static int getDisplayRotation(Activity activity) { int rotat

  • Android实现图片反转、翻转、旋转、放大和缩小

    ********************************************************************** android 实现图片的翻转 ********************************************************************** Resources res = this.getContext().getResources(); img = BitmapFactory.decodeResource(res, R.

  • Android 3D旋转动画效果实现分解

    这篇文章主要介绍一下如何实现View的3D旋转效果,实现的主要原理就是围绕Y轴旋转,同时在Z轴方面上有一个深入的缩放. 演示的demo主要有以下几个重点: 1,自定义旋转动画 2,动画做完后,重置ImageView 先看一下程序的运行效果:  1,自定义动画类 这里实现了一个Rotate3dAnimation的类,它扩展了Animation类,重写applyTransformation()方法,提供指定时间的矩阵变换,我们在这个方法里,就可以利用Camera类得得到一个围绕Y轴旋转的matrix

  • Android中利用matrix 控制图片的旋转、缩放、移动

    本文主要讲解利用android中Matrix控制图形的旋转缩放移动,具体参见一下代码: 复制代码 代码如下: /**  * 使用矩阵控制图片移动.缩放.旋转  */  public class CommonImgEffectView extends View { private Context context ;      private Bitmap mainBmp , controlBmp ;      private int mainBmpWidth , mainBmpHeight , c

  • Android UI之ImageView实现图片旋转和缩放

    这一篇,给大家介绍一下ImageView控件的使用,ImageView主要是用来显示图片,可以对图片进行放大.缩小.旋转的功能. android:sacleType属性指定ImageVIew控件显示图片的方式,例如:center表示图像以不缩放的方式显示在ImageView控件的中心,如果设置为fitCenter,表示图像按照比例缩放至合适的位置,并在ImageView控件的中心. 首先我们开发一个简单的案例,实现图片的放大缩小和旋转: 先看看实现的效果: 缩放截图1: 缩放截图2: 旋转截图1

  • Android开发 旋转屏幕导致Activity重建解决方法

    Android开发文档上专门有一小节解释这个问题.简单来说,Activity是负责与用户交互的最主要机制,任何"设置"(Configuration)的改变都可能对Activity的界面造成影响,这时系统会销毁并重建Activity以便反映新的Configuration. "屏幕方向"(orientation)是一个Configuration,通过查看Configuration类的javadoc可以看到其他Configuration还有哪些:如fontScale.ke

随机推荐