Я пытаюсь вставить время задержки в начале и между моей анимацией, чтобы после окончания времени задержки анимация продолжала работать нормально.
Вот часть, которую я сделал, это анимация с вращением и масштабированием. Итак, если быть точным, то, что я хочу, это то, что до того, как анимация начнет вращаться и масштабироваться, она будет задержана/приостановлена на 0,3 секунды. После этого, когда анимация повернется на 180 градусов и увеличится, она снова будет задержана/приостановлена на 0,3 секунды. Затем он завершит последние 180 градусов и уменьшит масштаб. Затем процесс повторяется.
анимация.дротик
import 'package:flutter/material.dart';
import 'dart:math';
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 {
AnimationController _animationController;
Animation<double> _rotateAnimation;
Animation<double> _scaleAnimation;
@override
void initState() {
super.initState();
_animationController = AnimationController(
vsync: this, duration: const Duration(milliseconds: 3000));
_rotateAnimation = TweenSequence([
TweenSequenceItem(tween: Tween(begin: 2*pi, end: pi), weight: 1),
TweenSequenceItem(tween: Tween(begin: pi, end: 0.0), weight: 1)
]).animate(CurvedAnimation(parent: _animationController, curve: Curves.linear));
_scaleAnimation = TweenSequence([
TweenSequenceItem(tween: Tween(begin: 0.5, end: 1.0), weight: 1),
TweenSequenceItem(tween: Tween(begin: 1.0, end: 0.5), weight: 1),
]).animate(CurvedAnimation(parent: _animationController, curve: Curves.linear));
_animationController.repeat();
}
@override
void dispose() {
_animationController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Container(
height: 100,
width: 100,
child: AnimatedBuilder(
animation: _animationController,
builder: (_, child) {
return Transform(
alignment: Alignment.center,
transform: Matrix4.identity()
..scale(_scaleAnimation.value)
..rotateZ(_rotateAnimation.value),
child: Container(
color: Colors.red
)
);
}
)
),
),
);
}
}
Любая помощь или предложение очень ценятся. Спасибо.
Еще один вопрос, как указать продолжительность для ConstantTween?
Чтобы получить желаемую анимацию, вам нужно:
Что-то вроде этого:
@override
void initState() {
super.initState();
_animationController = AnimationController(
vsync: this, duration: const Duration(milliseconds: 3000));
_rotateAnimation = TweenSequence([
TweenSequenceItem(
tween: Tween(begin: 2 * pi, end: pi)
.chain(CurveTween(curve: Curves.linear)),
weight: 1),
TweenSequenceItem<double>(tween: ConstantTween<double>(pi), weight: 1),
TweenSequenceItem(
tween: Tween(begin: pi, end: 0.0)
.chain(CurveTween(curve: Curves.linear)),
weight: 1)
]).animate(
CurvedAnimation(
parent: _animationController,
curve: Interval(
0.3,
1,
curve: Curves.linear,
),
),
);
_scaleAnimation = TweenSequence([
TweenSequenceItem(
tween: Tween(begin: 0.5, end: 1.0)
.chain(CurveTween(curve: Curves.linear)),
weight: 1),
TweenSequenceItem<double>(
tween: ConstantTween<double>(1.0),
weight: 1,
),
TweenSequenceItem(
tween: Tween(begin: 1.0, end: 0.5)
.chain(CurveTween(curve: Curves.linear)),
weight: 1),
]).animate(
CurvedAnimation(
parent: _animationController,
curve: Interval(
0.3,
1,
curve: Curves.linear,
),
),
);
_animationController.repeat();
}
Анимация будет:
ладно, я не обратил внимание на ConstantTween. Я понял, спасибо за помощь