在我的欢迎屏幕中,我有两次遇到持续时间非常奇怪的问题。
首先,我将图标放置在AvatarGlow中并进行设置:
duration: const Duration(seconds: 5)
第二,我正在使用延迟动画来建立欢迎屏幕:
DelayedAnimation(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
],
),
delay: delayedAmount + 750,
),
我猜现在我的问题与设备有关。当我在任何Android设备仿真器上构建应用程序时,持续时间是完全正确的,因此头像发光效果的持续时间为5秒,但当我在物理上的小米Mi A2上构建该应用程序时,整个持续时间加快了10倍。我必须将持续时间设置为50秒才能实际达到5秒。
似乎它只影响我的欢迎屏幕,因为我在另一个屏幕上用Duration()测试了一个简单的倒数计时,实际上一秒钟就是一秒钟。
import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; // statusbar color
import 'delayed_animation.dart';
import 'package:avatar_glow/avatar_glow.dart';
class WelcomeView extends StatefulWidget {
WelcomeView({Key key, this.title}) : super(key: key);
final String title;
@override
_WelcomeView createState() => new _WelcomeView();
}
class _WelcomeView extends State<WelcomeView> with SingleTickerProviderStateMixin {
final int delayedAmount = 500;
double _scale;
AnimationController _controller;
@override
void initState() {
_controller = AnimationController(
vsync: this,
duration: Duration(
milliseconds: 200,
),
lowerBound: 0.0,
upperBound: 0.1,
)..addListener(() {
setState(() {});
});
super.initState();
}
@override
Widget build(BuildContext context) {
_scale = 1 - _controller.value;
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarIconBrightness: Brightness.light,
statusBarColor: Colors.transparent,
));
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Color(0xFF221f1c),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
SizedBox(height: 20),
DelayedAnimation(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
AvatarGlow(
repeat: true,
endRadius: 100,
showTwoGlows: false,
glowColor: Color(0xFFb69862),
duration: const Duration(seconds: 4),
repeatPauseDuration: Duration(milliseconds: 500),
startDelay: Duration(seconds: 0),
child: Material(
elevation: 0.0,
shape: CircleBorder(),
child: CircleAvatar(
backgroundColor: Color(0xFF000000),
child: Image.asset('assets/images/logo.png', width: 70,),
radius: 60.0,
)
),
animate: true,
curve: Curves.fastOutSlowIn
),
],
),
delay: delayedAmount + 500, // Avatar
),
SizedBox(height: 30.0),
DelayedAnimation(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
],
),
delay: delayedAmount + 750,
),
DelayedAnimation(
child: Text(
),
delay: delayedAmount + 1000,
),
SizedBox(height: 130.0),
DelayedAnimation(
child: GestureDetector(
onTap: () {},
child: Transform.scale(
scale: _scale,
child: _animatedButtonUI,
),
),
delay: delayedAmount + 1500,
),
SizedBox(height: 50.0),
DelayedAnimation(
child: GestureDetector(
onTap: () {},
child: Text(
),
),
delay: delayedAmount + 1500,
),
],
),
)
),
);
}
Widget get _animatedButtonUI => Column(
children: <Widget>[
Container(
height: 60,
width: 270,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(88.0),
color: Color(0xFFb69862),
),
child: Center(
child: Text(
'REGISTRIEREN',
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.bold,
color: Color(0xFFFFFFFF),
),
),
),
),
],
);
}
delayed_animation.dart
import 'dart:async';
import 'package:flutter/material.dart';
class DelayedAnimation extends StatefulWidget {
final Widget child;
final int delay;
DelayedAnimation({@required this.child, this.delay});
@override
_DelayedAnimationState createState() => _DelayedAnimationState();
}
class _DelayedAnimationState extends State<DelayedAnimation>
with TickerProviderStateMixin {
AnimationController _controller;
Animation<Offset> _animOffset;
@override
void initState() {
super.initState();
_controller =
AnimationController(vsync: this, duration: Duration(milliseconds: 10000));
final curve =
CurvedAnimation(curve: Curves.easeIn, parent: _controller);
_animOffset =
Tween<Offset>(begin: const Offset(0.0, 0.35), end: Offset.zero)
.animate(curve);
if (widget.delay == null) {
_controller.forward();
} else {
Timer(Duration(milliseconds: widget.delay), () {
_controller.forward();
});
}
}
@override
void dispose() {
super.dispose();
_controller.dispose();
}
@override
Widget build(BuildContext context) {
return FadeTransition(
child: SlideTransition(
position: _animOffset,
child: widget.child,
),
opacity: _controller,
);
}
}