颤动如何仅在加载颤动数据时显示启动画面

Question

当显示应用程序的启动画面时，它需要从 FTP 服务器下载文件并处理数据。为 flutter 实现了闪屏

class Home extends StatelessWidget {
  const Home({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    return FutureBuilder(
      future: Future.delayed(Duration(seconds: 3)),
      builder: (BuildContext context, AsyncSnapshot snapshot){
        if(snapshot.connectionState == ConnectionState.waiting)
          return SplashUI();    ///Splash Screen
        else
          return MainUI();       ///Main Screen
      },
    );
  }
}

现在，延迟 3 秒，启动屏幕显示 3 秒，在此期间从 FTP 下载文件并处理数据。我想保留启动画面直到数据处理完成，而不是指定的时间。

启动画面


Widget _splashUI(Size size){
    return SafeArea(
      child: Center(
        child: Container(
          width: size.width * 0.5,
          height: size.height * 0.1,
          child: Image(
            fit: BoxFit.fill,
            image: AssetImage('assets/images/elf_logo.png'),
          ),
        ),
      ),
    );
  }

 Widget build(BuildContext context) {

 getFtpFile();
 dataProgress();

 return Platform.isAndroid ?
    MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: _splashUI(_size),
      ),
    ) :
    CupertinoApp(
      debugShowCheckedModeBanner: false,
      home: CupertinoPageScaffold(
        child: _splashUI(_size),
      ),
    );
 }

我想知道如何在处理数据时保持 SplashScreen 而不是延迟处理 SplashScreen。谢谢。

Answer 1

你可以像其他人过去那样做；你应该让你的方法 getFTPFile 和 dataProgress return 成为 Future，然后你使用 Future.wait 等待两个 Futures，如这个答案

Future.wait([
   getFTPFile(),
   dataProgress(),     
], () {
  // once all Futures have completed, navigate to another page here
});

Answer 2

to keep SplashScreen while processing data rather than handling SplashScreen with delayed.

为什么不改延迟？

class Home extends StatelessWidget {
  const Home({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    return FutureBuilder(
      future: _processingData(),
      builder: (BuildContext context, AsyncSnapshot snapshot){
        if(snapshot.connectionState == ConnectionState.waiting)
          return SplashUI();    ///Splash Screen
        else
          return MainUI();       ///Main Screen
      },
    );
  }

  Future<List> _processingData() {
    return Future.wait[
      _getFtpFile(),
      _dataProgress(),
    ];
  }
}

Answer 3

软件包 flutter_native_splash 完全符合您的要求。在 runApp() 之前调用 FlutterNativeSplash.preserve() 以保持屏幕上的启动画面，然后在下载完成后 FlutterNativeSplash.remove();：

import 'package:flutter_native_splash/flutter_native_splash.dart';

void main() {
  WidgetsBinding widgetsBinding = WidgetsFlutterBinding.ensureInitialized();
  FlutterNativeSplash.preserve(widgetsBinding: widgetsBinding);
  runApp(const MyApp());
}

// when your download is completed, remove the splash screen:
    FlutterNativeSplash.remove();

完全披露：我维护这个包。

颤动如何仅在加载颤动数据时显示启动画面

Flutter How to show splash screen only while loading flutter data

flutter

dart

splash-screen