代码之家  ›  专栏  ›  技术社区  ›  Darshan

如何在屏幕上立即显示从相机拍摄的图像?

  •  0
  • Darshan  · 技术社区  · 7 年前

    目前,我能够从中保存和检索图像 firebase storage 在屏幕上,但我面临的问题是,如果我单击“来自摄影机的图片”,它不会立即显示在屏幕上(尽管该图像已保存)。当我返回到其他屏幕并返回时,将显示新拍摄的照片。但我想在屏幕上立即显示从相机拍摄的图像。其中一个解决方案来自 this 邮政是使用 Image.file Image.network 显示从中检索的图像的步骤 firebase 火基 ClipOval 小部件)

    @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
              title: Text('Edit Profile'),
              actions: <Widget>[
                new Center(child: new Text('SAVE')),
              ],
            ),
            body: new Stack(
              children: <Widget>[
                Positioned(
                  width: 410.0,
                  top: MediaQuery
                      .of(context)
                      .size
                      .height / 25,
                  child: Column(children: <Widget>[
                    Container(
                      child: user.profilePhoto == ""
                          ? Image.file(_imageFile,fit: BoxFit.cover,
                          height: 110.0,
                      width: 110.0,)
                          : ClipOval(
                        child: _imageUrl == null ? Image.asset('icons/default_profile_icon.png', height: 110.0,)
                        :Image.network(_imageUrl,fit: BoxFit.cover,
                        width: 110.0,
                        height: 110.0,)
                      ),
                    ),
    

    这就是我在点击相机中的图片,然后上传到屏幕上后,试图在屏幕上显示图像的方式 火基

    //display image selected from camera
      imageSelectorCamera() async {
        Navigator.pop(context);
        var imageFile = await ImagePicker.pickImage(
          source: ImageSource.camera,
        );
        setState(() {
          _imageFile = imageFile;
        });
    
        uploadFile(imageFile);
      }
    
    // Uploads image to firebase storage
      Future<String> uploadFile(imageFile) async {
        String fileName = 'images/profile_pics/' + this.firebaseUser.uid + ".jpeg";
        StorageReference reference = FirebaseStorage.instance.ref().child(fileName);
        StorageUploadTask uploadTask = reference.putFile(imageFile);
    
        var downloadUrl = await (await uploadTask.onComplete).ref.getDownloadURL();
        String url = downloadUrl.toString();
        return url;
    
      }
    
    1 回复  |  直到 7 年前
        1
  •  2
  •   magicleon94    7 年前

    你的 uploadFile

    假设 _imageUrl

    String resultString = await uploadFile(imageFile);
    
    setState((){
        _imageUrl = resultString;
    });
    

    如果我理解了您要做的事情和代码,这应该会有所帮助。

    当您的 上传文件

    顺便说一下,我建议你去看看 StreamBuilder ,它允许您根据正在使用的数据流构建(和重建)小部件 Firebase ,根据经验,我可以告诉你 具有 StreamBuilder

    如果您感兴趣,请查看 this medium article the docs !

    Firebase Firestore 和 StreamBuilder here .