首页 > 解决方案 > FutureBuilder 不返回小部件

问题描述

拍照后,我一直在尝试在屏幕上打印 base64 编码的图像字符串。以下是代码。

import 'dart:io';
import 'package:image_picker/image_picker.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:convert';

import 'package:http/http.dart' as http;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
    // This widget is the root of your application.
    @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> {

    File _image;







     Future<String> getb64Image() async {
        List<int> imageBytes= await _image.readAsBytes();
        String b64image= base64Encode(imageBytes);
        print('In future func: $b64image\n');
         return b64image;
     }

     void clickPic() async {
       var image= await ImagePicker.pickImage(source: ImageSource.camera);
       setState(() {
         _image=image;
       });
   }

  Widget getImage(){
    return FutureBuilder<String>(
    future: getb64Image(),
    builder: (BuildContext context,AsyncSnapshot<String> snapshot){
    if(snapshot.connectionState==ConnectionState.done){
      if(snapshot.hasData){
        print('In snapshot : ${snapshot.data}');
        return new Text(snapshot.data);
      }
      else{
        return CircularProgressIndicator();
      }
    }
    else{
      return CircularProgressIndicator();
    }
  },
);
}


@override
Widget build(BuildContext context) {

 return Scaffold(
   appBar: AppBar(

    title: Text(widget.title),
  ),
  body: Center(

    child: Column(

      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[



        Center(
          child: _image!=null?getImage():Container(child: Text(
            'Click below to take a snap',
            style: Theme.of(context).textTheme.display1,
          ),),
        ),



        RaisedButton.icon(onPressed: clickPic,
            icon: Icon(Icons.camera),

            label:Text('click me to take a snap'),

        )

      ],
    ),
  ),

);
 }
 }

我的颤振版本是 1.2.1,我正在使用 Android Studio 3.3。问题是当应用程序运行良好直到拍摄快照时,当试图将 b64 转换后的图像字符串放到屏幕上时,futurebuilder 不会构建任何东西。该应用程序在没有 CircularProgressIndicator 动画的情况下卡住并突然停止。除了“应用程序完成”或“与设备的连接丢失”之外,控制台不会打印任何错误。我在 FutureBuilder 和 b64Image 方法中放入的调试行有效,但唯一的问题是 FutureBuilder 在不打印字符串的情况下崩溃。请注意,我在 android 模拟器上运行该应用程序。

这是模拟器中代码运行示例的链接:https ://youtu.be/291sQtow3Q4

以下是控制台日志:

Launching lib/main.dart on Android SDK built for x86 in debug mode...
Initializing gradle...
Resolving dependencies...
Running Gradle task 'assembleDebug'...
Built build/app/outputs/apk/debug/app-debug.apk.
Installing build/app/outputs/apk/app.apk...
I/.flutter_pylen(12574): Background young concurrent copying GC freed      3846(621KB) AllocSpace objects, 3(60KB) LOS objects, 84% free, 1103KB/7247KB, paused 214us total 119.231ms
Syncing files to device Android SDK built for x86...
I/Choreographer(12574): Skipped 92 frames!  The application may be doing too much work on its main thread.
D/EGL_emulation(12574): eglMakeCurrent: 0xdb612b40: ver 2 0 (tinfo 0xdb608da0)
I/OpenGLRenderer(12574): Davey! duration=1686ms; Flags=1,    IntendedVsync=3188489793352, Vsync=3190023126624,   OldestInputEvent=9223372036854775807, NewestInputEvent=0, HandleInputStart=3190028534473, AnimationStart=3190028585003, PerformTraversalsStart=3190028607203, DrawStart=3190037234683, SyncQueued=3190038151683, SyncStart=3190052614713, IssueDrawCommandsStart=3190052729313, SwapBuffers=3190081882083,  FrameCompleted=3190190896713, DequeueBufferDuration=59694000,  QueueBufferDuration=238000, 
 D/        (12574): HostConnection::get() New Host Connection established 0xd68cab80, tid 12598
 D/        (12574): HostComposition ext ANDROID_EMU_CHECKSUM_HELPER_v1 ANDROID_EMU_dma_v1 GL_OES_vertex_array_object  GL_KHR_texture_compression_astc_ldr ANDROID_EMU_gles_max_version_2 
 D/EGL_emulation(12574): eglMakeCurrent: 0xec6e9660: ver 2 0 (tinfo 0xd67b6d40)
 D/EGL_emulation(12574): eglMakeCurrent: 0xdb612b40: ver 2 0 (tinfo 0xdb608da0)
 D/EGL_emulation(12574): eglCreateContext: 0xec6e9840: maj 2 min 0 rcv 2
 D/EGL_emulation(12574): eglMakeCurrent: 0xec6e9840: ver 2 0 (tinfo 0xd67b6c20)
 D/EGL_emulation(12574): eglMakeCurrent: 0xdb612b40: ver 2 0 (tinfo 0xdb608da0)
 D/EGL_emulation(12574): eglMakeCurrent: 0xec6e9840: ver 2 0 (tinfo 0xd67b6d40)
 I/flutter (12574): In future func: /9j/4AAQSkZJRgABAQAAAQABAAD /2wBDAAIBAQEBAQIBAQECAgICAgQDAgICAgUEBAMEBgUGBgYFBgYGBwkIBgcJBwYGCAsICQoKCgoKBggLDAsKDAkKCgr/2wBDAQICAgICAgUDAwUKBwYHCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgr/wAARCAUAA8ADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDATT/FMany9RR/96Omqni9Cd6wOPpg1ttaSx5IJ+oNIqzICTmvgVZn2hkC68Sw5zpsZ+jmnR65qyAibQnJHdWFaxaaT5hSKzjO6P8AHFGgGYviSRCRc6LcKPUJmnL4l00/ejnX/eiNayMGGMKfwqRI7N0Je2XPemrAZCeItFfKtdbT6MC
I/flutter (12574): In snapshot : /9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAIBAQEBAQIBAQECAgICAgQDAgICAgUEBAMEBgUGBgYFBgYGBwkIBgcJBwYGCAsICQoKCgoKBggLDAsKDAkKCgr/2wBDAQICAgICAgUDAwUKBwYHCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgr/wAARCAUAA8ADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDATT/FMany9RR/96Omqni9Cd6wOPpg1ttaSx5IJ+oNIqzICTmvgVZn2hkC68Sw5zpsZ+jmnR65qyAibQnJHdWFaxaaT5hSKzjO6P8AHFGgGYviSRCRc6LcKPUJmnL4l00/ejnX/eiNayMGGMKfwqRI7N0Je2XPemrAZCeItFfKtdbT6MCKs
 Application finished.

我遇到的问题是没有显示错误。所以,我无法理解问题是什么。有人可以在这里帮助我吗?

标签: androidflutter

解决方案


看起来您的 android 进程正在被杀死,因为 Dart VM 花费了太多时间来呈现您的“胖”文本数据。

您应该看到如下日志:

03-17 20:03:55.922   712   712 I Zygote  : Process 12250 exited due to signal (9)

I/Choreographer(20099): Skipped 72 frames!  The application may be doing too much work on its main thread.

exited due to signal在 android logcat 中搜索您的进程。

基本上Text widget could not handle string with millions of characters 它可能试图一次性在主线程上渲染太多文本。

虽然在这种情况下可能有来自 Flutter 的优雅的开发人员消息,但目前还没有。提出了同样的问题:https ://github.com/flutter/flutter/issues/29510


推荐阅读