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 ，该文档还包含youtube视频

以下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
        ),),

      ),
    );
  }
}

Twitter应用程序加载如何处理飘动的应用程序？

1 个答案: