Flutter在 release版本,打开后随机白屏不显示内容

使用命令行

flutter run --release --verbose

可以在模拟器上,模拟release上的运行状态,关掉app进程,再打开也有日志

白屏原因:

Flutter为加快应用启动速度,未等size赋值,就开始渲染界面。

解决办法:

监听window的尺寸变化,当不为空时,再runApp;runApp必须先WidgetsFlutterBinding.ensureInitialized(),确保有WidgetsFlutterBinding实例,不然会黑屏

Future<void> main() async {

  //如果size是0,则设置回调,在回调中runApp
  if(window.physicalSize.isEmpty){
    print("window size is zero");
    window.onMetricsChanged = (){
      //在回调中,size仍然有可能是0
      if(!window.physicalSize.isEmpty){
        window.onMetricsChanged = null;
        print("window onMetricsChanged,run app");
        runMyApp();
      }
    };
  } else{
    //如果size非0,则直接runApp
    print("window load success,run app");
    runMyApp();
  }
}

void runMyApp() async{

  print("window:  ${window.physicalSize.width}  ${window.physicalSize.height}");
  //需确保加载完成,才runApp
  WidgetsFlutterBinding.ensureInitialized();
  runApp(MyApp());
}

使用window需导入 dart:ui

import 'dart:ui';

  • 4
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
要在Flutter页面中显示一个随机数据的曲线图,可以使用Flutter中的charts_flutter库。以下是实现的步骤: 1. 在pubspec.yaml文件中添加charts_flutter库的依赖: ``` dependencies: charts_flutter: ^0.9.0 ``` 2. 导入charts_flutter库: ``` import 'package:charts_flutter/flutter.dart' as charts; ``` 3. 创建一个随机数据的List: ``` List<charts.Series> _createRandomData() { final data = [ new MyData(0, _getRandomInt()), new MyData(1, _getRandomInt()), new MyData(2, _getRandomInt()), new MyData(3, _getRandomInt()), new MyData(4, _getRandomInt()), new MyData(5, _getRandomInt()), ]; return [ new charts.Series<MyData, int>( id: 'Data', domainFn: (MyData data, _) => data.index, measureFn: (MyData data, _) => data.value, data: data, ) ]; } class MyData { final int index; final int value; MyData(this.index, this.value); } int _getRandomInt() { return new Random().nextInt(100); } ``` 4. 创建一个LineChart: ``` charts.LineChart( _createRandomData(), animate: true, animationDuration: Duration(milliseconds: 500), ) ``` 完整的示例代码如下: ``` import 'dart:math'; import 'package:flutter/material.dart'; import 'package:charts_flutter/flutter.dart' as charts; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(title: 'Flutter Demo Home Page'), ); } } class MyHomePage extends StatefulWidget { MyHomePage({Key key, this.title}) : super(key: key); final String title; @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: Center( child: charts.LineChart( _createRandomData(), animate: true, animationDuration: Duration(milliseconds: 500), ), ), ); } List<charts.Series> _createRandomData() { final data = [ new MyData(0, _getRandomInt()), new MyData(1, _getRandomInt()), new MyData(2, _getRandomInt()), new MyData(3, _getRandomInt()), new MyData(4, _getRandomInt()), new MyData(5, _getRandomInt()), ]; return [ new charts.Series<MyData, int>( id: 'Data', domainFn: (MyData data, _) => data.index, measureFn: (MyData data, _) => data.value, data: data, ) ]; } int _getRandomInt() { return new Random().nextInt(100); } } class MyData { final int index; final int value; MyData(this.index, this.value); } ``` 注意:由于图表是随机生成的,每次运行应用程序时都会有不同的结果。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值