从图库中选择后摇动设置图像

Question

       File profileImg;

  Widget profilePic() {
        return Stack(
            children: <Widget>[
              new Image.file(profileImg),
              Positioned(
                left: 50.0,
                right: 50.0,
                bottom: 40.0,
                height: 64.0,

                child: RaisedGradientButton(
                  onPressed: () async {
                  File image= await ImagePicker.pickImage(source:ImageSource.gallery);
                  image=profileImg;
                   print(image.path);
                  },
                  child: new Text(
                    "Upload",
                    style: TextStyle(fontSize: 20.0, color: Colors.white),
                  ),
                  gradient: LinearGradient(
                    colors: <Color>[
                      const Color(0xFF000000),
                      const Color(0xFF000000),
                      const Color(0xFF40079B)
                    ],
                  ),
                ), // child widget
              ),
            ]);
      }

我创建了一个图像，在图像的底部，我有一个按钮可以从图库中选择图像。从图库中选择图像之前，我想为图像设置背景色，然后从图库中选择图像在图像视图中设置所选图像

Answer 1

使用Image_picker和FutureBuilder显示所选择的图库图像的最小示例。

Future<File> profileImg;

@override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: AppBar(
          title: Text("Gallery Image Picker"),
        ),
        body: profilePic());
  }

Widget profilePic() {
    return ListView(children: <Widget>[
      FutureBuilder(
        builder: (context, data) {
          if (data.hasData) {
            return Container(
              height: 200.0,
              child: Image.file(
                data.data,
                fit: BoxFit.contain,
                height: 200.0,
              ),
              color: Colors.blue,
            );
          }
          return Container(
            height: 200.0,
            child: Image.network('https://via.placeholder.com/150'),
            color: Colors.blue,
          );
        },
        future: profileImg,
      ),
      RaisedButton(
        color: Colors.blue,
        onPressed: () {
          profileImg = ImagePicker.pickImage(source: ImageSource.gallery)
              .whenComplete(() {
            setState(() {});
          });
        },
        child: new Text(
          "Pick Gallery Image",
          style: TextStyle(fontSize: 20.0, color: Colors.white),
        ),
      ),
    ]);
  }