Flutter 旋转动画 线性变化的旋转动画

直接上代码

图片自己添加一张就好了

import 'dart:math';

import 'package:flutter/material.dart';

import 'package:flutter/animation.dart';

void main() => runApp(MyApp());
//旋转动画
class MyApp extends StatelessWidget {
  
  Widget build(BuildContext context) {
    return MaterialApp(
      color: Colors.blue,
      home: MyAnimatedWidget(),
    );
  }
}

class MyAnimatedWidget extends StatefulWidget {
  
  _MyAnimatedWidgetState createState() => _MyAnimatedWidgetState();
}

class _MyAnimatedWidgetState extends State<MyAnimatedWidget>
    with SingleTickerProviderStateMixin {
  late final AnimationController _repeatController;
  late final Animation<double> _animation;

  
  void initState() {
    super.initState();
    _repeatController = AnimationController(
      duration: const Duration(seconds: 3),
      vsync: this,
    )..repeat(); // 设置动画重复播放

    // 创建一个从0到1的补间动画   end: 1 * pi   转速
    _animation = Tween<double>(begin: 0, end: 1).animate(_repeatController);
  }

  
  Widget build(BuildContext context) {
    // 你的UI构建代码,使用_animation来控制动画
    // ...

    // 示例按钮来停止和继续动画
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Center(
          child: AnimatedSwitcher(
            duration: const Duration(milliseconds: 500),
            transitionBuilder: (child, animation) {
              return RotationTransition(
                turns: _animation!,
                child: child,
              );
            },
            child: Image.asset(
              'assets/shenji2.png',
            ),
          ),
        ),
        Text('Animation Example'),
        SizedBox(
          height: 20,
        ),
        ElevatedButton(
          onPressed: () {
            stopAnimation(); // 停止动画
          },
          child: Text('Stop Animation'),
        ),
        SizedBox(
          height: 20,
        ),
        ElevatedButton(
          onPressed: () {
            resumeAnimation(); // 继续动画
          },
          child: Text('Resume Animation'),
        ),
        SizedBox(
          height: 20,
        ),
        ElevatedButton(
          onPressed: () {
            resumeAnimationZY(); // 继续动画
          },
          child: Text('Resume Animation2'),
        ),
      ],
    );
  }

  void stopAnimation() {
    _repeatController.stop();
  }

  void resumeAnimation() {
    _repeatController.repeat(reverse: false);
    
  }

  void resumeAnimationZY() {
  ///左右转动
    _repeatController.repeat(reverse: true);
  
  }

  
  void dispose() {
    _repeatController.dispose(); // 不要忘记在dispose中释放资源
    super.dispose();
  }
}



创建一个动画组件给其他界面调用自己回收内存
不规则图片的中心旋转动画

import 'dart:math';

import 'package:flutter/material.dart';

class AnimatedBox extends StatefulWidget {
  // final Color color;
  // final Duration duration;

  const AnimatedBox({
    Key? key,
  }) : super(key: key);

  
  _AnimatedBoxState createState() => _AnimatedBoxState();
}

class _AnimatedBoxState extends State<AnimatedBox>
    with SingleTickerProviderStateMixin {
  late final AnimationController _repeatController;
  late final Animation<double> _animation;

  
  void initState() {
    super.initState();
    //启动动画
    _repeatController = AnimationController(
      duration: const Duration(seconds: 3),
      vsync: this,
    )..repeat(); // 设置动画重复播放

    // 创建一个从0到1的补间动画
    _animation =
        Tween<double>(begin: 0, end: 1 * pi).animate(_repeatController);
  }

  
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _repeatController,
      builder: (BuildContext context, Widget? child) {
        return Center(
          child: Stack(
            children: [
              Positioned(
                top: 0,
                bottom: 0,
                left: 0,
                right: 0,
                child: Center(
                  child: Image.asset(
                    'assets/ic_oxygen_pump_c_10.png', // 你想要居中的组件
                  ),
                ),
              ),
              Positioned(
                top: 0,
                bottom: 1.5,
                left: 0,
                right: 6,
                child: Center(
                  child: AnimatedSwitcher(
                    duration: const Duration(milliseconds: 500),
                    transitionBuilder: (child, animation) {
                      return RotationTransition(
                        turns: _animation,
                        child: child,
                      );
                    },
                    child: Image.asset(
                      'assets/ic_oxygen_pump_c_polat.png', // 你想要居中的组件
                    ),
                  ),
                ),
              ),
            ],
          ),
        );

        ///放大动画
        /*return Transform.scale(
          scale: _animation.value,
          child: Container(
            width: 100,
            height: 100,
            color: widget.color,
          ),
        );*/
      },
    );
  }

  
  void dispose() {
    ///回收动画
    _repeatController.dispose();
    super.dispose();
  }
}

图片是白色的

在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/488755.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

docker学习笔记 三-----docker安装部署

我使用的部署环境是centos 7.9 1、安装依赖工具 yum install -y yum-utils device-mapper-persistent-data lvm2 安装完成如下图 2、添加docker的软件信息源 yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo url地址为如…

如何启动极狐GitLab 静态网站Pages功能

本文作者&#xff1a;徐晓伟 GitLab 是一个全球知名的一体化 DevOps 平台&#xff0c;很多人都通过私有化部署 GitLab 来进行源代码托管。极狐GitLab 是 GitLab 在中国的发行版&#xff0c;专门为中国程序员服务。可以一键式部署极狐GitLab。 本文主要讲述了如何使用极狐GitLa…

MySQL进阶45讲【35】什么时候会使用内部临时表?

1 前言 在MySQL进阶45讲【15】“order by“是怎么工作的&#xff1f;和MySQL进阶45讲【32】到底可不可以使用join&#xff1f;文章中&#xff0c;分别介绍了sort buffer、内存临时表和join buffer。这三个数据结构都是用来存放语句执行过程中的中间数据&#xff0c;以辅助SQL语…

BSV区块链的应用开发前景——通过标准化来促进创新

​​发表时间&#xff1a;2024年3月5日 近年来区块链领域的发展日新月异&#xff0c;各种全新的技术和方法论正在迅猛涌现。在这个瞬息万变的环境之中&#xff0c;标准化不仅仅会为开发者们带来便利&#xff0c;同时也促进了应用之间的互操作性&#xff0c;并且推动着生态系统的…

天地图-坐标拾取

在网页使用高德&#xff0c;百度地图这些时&#xff0c;会因为没有购买他们的使用版权&#xff0c;从而出现以下水印&#xff0c;因此需要换一个地图-天地图 天地图官方文档&#xff1a;http://lbs.tianditu.gov.cn/ 然而天地图并不像其他地图一样这么方便&#xff0c;比如没有…

MyBatis题库详解

1、介绍下MyBatis中的工作原理 介绍MyBatis的基本情况&#xff1a;ORM&#xff0c;对象关系映射&#xff08;英语&#xff1a;Object Relational Mapping&#xff0c;简称ORM&#xff0c;或O/RM&#xff0c;或O/R mapping&#xff09;&#xff0c;是一种程序技术 MyBatis框架的…

2015年认证杯SPSSPRO杯数学建模D题(第一阶段)城市公共自行车全过程文档及程序

2015年认证杯SPSSPRO杯数学建模 D题 城市公共自行车 原题再现&#xff1a; 城市交通问题直接影响市民的生活和工作。在地形平坦的城市&#xff0c;公共自行车出行系统是一种很好的辅助手段。一般来说&#xff0c;公共自行车出行系统由数据中心、驻车站点、驻车桩、自行车&…

openlayers 入门教程(五):sources 篇

还是大剑师兰特&#xff1a;曾是美国某知名大学计算机专业研究生&#xff0c;现为航空航海领域高级前端工程师&#xff1b;CSDN知名博主&#xff0c;GIS领域优质创作者&#xff0c;深耕openlayers、leaflet、mapbox、cesium&#xff0c;canvas&#xff0c;webgl&#xff0c;ech…

Memcached分布式内存对象数据库

一 Memcached 概念 Memcached 是一个高性能的分布式内存对象缓存系统&#xff0c;用于动态 Web 应用以减轻数据库负载。它通过在内存中缓存数据和对象来减少读取数据库的次数&#xff0c;从而提高动态、数据库驱动网站的速度。 二 在架构中的位置 Memcached 处于前端或中间件后…

Vue 发送Ajax请求多种方式

1. 发送ajax请求的方式 方案一&#xff1a;jq 的ajax&#xff08;在 vue 中不推荐同时使用&#xff09;方案二&#xff1a;js 原始官方 fetch方法方案三&#xff1a;axios 第三方 2. 方案一 后端视图函数 from rest_framework.viewsets import ViewSet from rest_framework…

UE4 根据任意多个点,生成最近的线条

1.计算所有线条的组合 2.Clear0宏&#xff1a;清除掉数组Distance0的值。注意这里是设置成最大值&#xff0c;而不是使用Clear&#xff01; 3.清除掉数组中的最小值&#xff0c;避免重复生成相同长度的线条。注意这里是设置成最大值&#xff0c;而不是使用Clear&#xff01; …

python爬虫基础-----运算符(第三天)

&#x1f388;&#x1f388;作者主页&#xff1a; 喔的嘛呀&#x1f388;&#x1f388; &#x1f388;&#x1f388;所属专栏&#xff1a;python爬虫学习&#x1f388;&#x1f388; ✨✨谢谢大家捧场&#xff0c;祝屏幕前的小伙伴们每天都有好运相伴左右&#xff0c;一定要天天…

GitHub加速访问最简单的方法

Github是全球最大的代码开源平台&#xff0c;对于编程的小伙伴来说&#xff0c;这是一个巨大的宝库&#xff0c;也是编程学习的圣地。很对小伙伴在使用GitHub时会经常出现无法访问Github的情况。 一、解决方法——>修改hosts文件 通过 IP查询工具来获取当前Github网站的真实…

全民采矿石赚钱小程序源码,附带详细搭建教程

安装教程 1、环境用宝塔Nginxphp7.0或者以下版本 2、可以更换各种模板&#xff0c;懂代码和标签的可以改模板&#xff0c;不懂的可以直接上站 3、上站前记得添加关键词和内容库 4、伪静态在绑定完百度站长之后再添加 目录说明&#xff1a; data/keyword 放关键词 标签&#xff…

【扩散模型】论文精读:Denoising Diffusion Probabilistic Models(DDPM)

文章目录 前言Abstract1 Introduction2 Background3 Diffusion models and denoising autoencoders3.1 Forward process and LT3.2 Reverse process and L1:T −13.3 Data scaling, reverse process decoder, and L03.4 Simplified training objective 4 Experiments4.1 Sample…

C语言: 指针讲解

为什么需要指针? &#xff08;1&#xff09;指针的使用使得不同区域的代码可以轻易的共享内存数据。当然你也可以通过数据的复制达到相同的效果&#xff0c;但是这样往往效率不太好&#xff0c;因为诸如结构体等大型数据&#xff0c;占用的字节数多&#xff0c;复制很消耗性能…

Linux-进程控制(进程创建、进程终止、进程等待)

一、进程创建 1.1 fork函数介绍 在命令行下我们可以通过 ./ exe文件 来创建一个进程&#xff0c;通过fork函数&#xff0c;我们可以通过代码的形式从一个进程中创建一个进程&#xff0c;新进程为子进程&#xff0c;原进程为父进程&#xff0c;子进程在创建时&#xff0c;会与…

软件项目-详细设计说明书范文参考(46页Word原件)

一、 关于本文档 &#xff08;一&#xff09; 编写目的 &#xff08;二&#xff09; 预期读者 二、 项目概要 &#xff08;一&#xff09; 建设背景 &#xff08;二&#xff09; 建设目标 &#xff08;三&#xff09; 建设内容 三、 总体设计 &#xff08;一&#xff0…

git基础-撤销操作

撤销操作 在任何阶段&#xff0c;我们都可能希望撤消某些操作。在这里&#xff0c;我们将回顾一些基本工具&#xff0c;用于撤消之前所做的更改。操作要谨慎&#xff0c;因为这些撤销可能无法修复。这是 Git 中为数不多的几个领域之一由于操作不当&#xff0c;导致丢失一些工作…

一篇文章,告别Flutter状态管理争论,问题和解决

起因 每隔一段时间&#xff0c;都会出现一个新的状态管理框架&#xff0c;最近在YouTube上也发现了有人在推signals, 一个起源于React的状态管理框架&#xff0c;人们总是乐此不疲的发明各种好用或者为了解决特定问题而产生的方案&#xff0c;比如Bloc, 工具会推陈出新&#x…
最新文章