我有一个要在AnimatedCrossFade中使用的.Mov文件,但是我无法使视频与渐变一起使用。我出现黑屏,交叉淡入淡出从未发生。到目前为止,这是我的代码:
VideoPlayerController _buddiesAnimatedController;
Future<void> _initializeVideoPlayerFuture;
bool firstStateEnabled = true;
AnimatedCrossFade(
firstChild: _showBuddiesLogo(),
secondChild: _signIn(),
duration: Duration(seconds: 3),
crossFadeState: firstStateEnabled
? CrossFadeState.showFirst
: CrossFadeState.showSecond,
firstCurve: Curves.easeOut,
secondCurve: Curves.easeIn,
sizeCurve: Curves.bounceIn,
),
初始化状态
@override
void initState() {
_buddiesAnimatedController = VideoPlayerController.asset('assets/BuddiesLogo.mov');
_initializeVideoPlayerFuture = _buddiesAnimatedController.initialize();
_buddiesAnimatedController.setLooping(false);
super.initState();
}
第一个孩子
Widget _showBuddiesLogo() {
return FutureBuilder(
future: _initializeVideoPlayerFuture,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return AspectRatio(
aspectRatio: _buddiesAnimatedController.value.aspectRatio,
child: VideoPlayer(_buddiesAnimatedController),
);
} else{
return CircularProgressIndicator();
}
},
);
}
第二个孩子
Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
splashColor: Colors.greenAccent,
elevation: 8.0,
color: buddiesGreen,
child: Container(
width: 100,
child: Center(
child: Text(
'Sign In',
style: TextStyle(
color: Colors.white, fontFamily: 'Roboto'),
),
),
), //`Text` to display
shape: StadiumBorder(),
onPressed: () {
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (BuildContext context) =>
SignIn()));
},
),
SizedBox(
width: 15,
),
RaisedButton(
highlightColor: Colors.greenAccent,
splashColor: Colors.greenAccent,
elevation: 10.0,
color: Colors.white,
child: Container(
width: 100,
child: Center(
child: Text(
'Sign Up',
style: TextStyle(fontFamily: 'Roboto'),
),
),
), //`Text` to display
shape: StadiumBorder(),
onPressed: () {
Navigator.of(context).pushReplacement(
MaterialPageRoute(
builder: (BuildContext context) =>
Walkthrough()));
}),
],
),
看到圆形进度指示器后,屏幕变黑。我已经在yaml文件中声明了视频,并且已经导入import'package:video_player / video_player.dart';进入页面。验证命名正确。我希望播放动画,然后让第二个屏幕显示登录按钮。任何帮助将不胜感激