推特应用程序加载 如何进行颤动应用程序?

Question

我想制作我们在颤振中打开第一个Twitter应用程序时看到的应用程序。如何在应用程序中显示动画并显示我的第一页？

访问： https://facebook.github.io/react-native/blog/assets/loading-screen-01.gif ？

Answer 1

如果我清楚地了解您，您正在尝试构建启动画面
对于直接在本机部分中执行此操作，您可以参考此 https://medium.com/flutter-community/flutter-2019-real-splash-screens-tutorial-16078660c7a1 ，此文档还包含优酷视频

以下 Flutter 插件还可以帮助您
https://github.com/KarimMohamed2005/SplashScreenFlutterPackage
https://pub.dev/packages/flutter_splash_screen https://pub.dev/packages/animated_splash
https://github.com/MeshkaniMohammad/custom_splash_screen

以 https://github.com/KarimMohamed2005/SplashScreenFlutterPackage
为例 您可以设置计时器。 下面列出了完整的代码

import 'package:flutter/material.dart';
import 'package:splashscreen/splashscreen.dart';
void main(){
runApp(new MaterialApp(
home: new MyApp(),
));
}

class MyApp extends StatefulWidget {
@override
_MyAppState createState() => new _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return new SplashScreen(
seconds: 14,
navigateAfterSeconds: new AfterSplash(),
title: new Text('Welcome In SplashScreen',
style: new TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20.0
),),
image: new Image.network('https://i.imgur.com/TyCSG9A.png'),
backgroundColor: Colors.white,
styleTextUnderTheLoader: new TextStyle(),
photoSize: 100.0,
onClick: ()=>print("Flutter Egypt"),
loaderColor: Colors.red
);
}
}
class AfterSplash extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Welcome In SplashScreen Package"),
automaticallyImplyLeading: false
),
body: new Center(
child: new Text("Done!",
style: new TextStyle(
fontWeight: FontWeight.bold,
fontSize: 30.0
),),
),
);
}
}