Closed zszen closed 4 years ago
@GIfatahTH
The animator is auto run when going into view. I want the animate delay for 500ms wait there.
I would like this feature too. I find that the animator has triggerOnInit, but I don't know how to start the animation if it set to false. This is the effect I want to achieve
@SonQBChau @zszen Try this code
import 'dart:async';
import 'package:animator/animator.dart';
import 'package:flutter/material.dart';
import 'package:states_rebuilder/states_rebuilder.dart';
class InOutModel extends StatesRebuilder {
var isFinished = false;
}
class InOutView extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Injector<InOutModel>(
models: [() => InOutModel()],
builder: (_, __) => MaterialApp(
home: Scaffold(
body: _Scaffold(),
),
),
);
}
}
class _Scaffold extends StatelessWidget {
final model = Injector.get<InOutModel>();
@override
Widget build(BuildContext context) {
final widget = Container(
margin: EdgeInsets.symmetric(vertical: 5, horizontal: 50),
color: Colors.black,
height: 40,
);
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Animator(
tween: model.isFinished
? Tween<Offset>(begin: Offset(0, 0), end: Offset(1, 0))
: Tween<Offset>(begin: Offset(-1, 0), end: Offset(0, 0)),
duration: Duration(milliseconds: 400),
curve: Curves.ease,
triggerOnInit: true,
builder: (anim) => FractionalTranslation(
translation: anim.value,
child: Column(
children: <Widget>[widget, widget],
),
),
),
Animator(
tween: model.isFinished
? Tween<Offset>(begin: Offset(0, 0), end: Offset(1, 0))
: Tween<Offset>(begin: Offset(-1, 0), end: Offset(0, 0)),
duration: Duration(milliseconds: 800),
triggerOnInit: true,
curve: Curves.easeInOut,
endAnimationListener: (animBloc) {
model.isFinished = !model.isFinished;
Timer(Duration(milliseconds: 500), () {
model.rebuildStates();
});
},
builder: (anim) => FractionalTranslation(
translation: anim.value,
child: widget,
),
),
],
);
}
}
@GIfatahTH thanks for the sample code, it works
can you be more explanatory! What do you mean by delay await in the context of animation.