CODEWITHSUNDEEP
flutterdartflutter-layout
Micheal Ross
Micheal Ross

Reputation: 211

Visualize any size of image without distortions flutter

I hope the title is clear. I need to visualize an image as background picture but it's dynamic, the user can change it when he/she wants.

The problem is that I would like to fit it in some box (Container, SizedBox....) without distorsions, compressions...The picture must be clear and good to look.

Do you know how I can do this?

I tried with : 

SizedBox(
      width : _screenWidth,
      height: _customLabelsHeight,
      child : SizedBox.expand(
        child : ClipRRect (
          borderRadius: BorderRadius.circular(20.0),
          child : _backGroundPicture==null
            ? new Image.asset('assets/images/io.png'
             )
             : _backGroundPicture,
        ),
      ),
    ),

But this isn't what I'm looking for because some pictures are cut, bigger, smaller...The size changes and sometimes pictures are weird...

"_backGroundPicture" comes from "ImagePicker" : 

var _backGroundPicture;

Future changeBackgroundPicture() async {
      var newImage2 = await ImagePicker.pickImage(source: 
      ImageSource.gallery);

      setState(() {
        _backGroundPicture=newImage2;
      });
  }

Update : the line with the error 

image : _backGroundPicture==null
                    ? new AssetImage('assets/images/io.png')
                    : _backGroundPicture,

Where _backGroundPicture is : var _backGroundPicture; And all is child of gestureDetector that onTap has : GestureDetector( onTap : changeBackgroundPicture, . . . Future changeBackgroundPicture() async { var newImage2 = await ImagePicker.pickImage(source: ImageSource.gallery);

 setState(() {
   _backGroundPicture = newImage2;
 });
}

Upvotes: 0

Views: 185

Answers (1)

dev-aentgs
dev-aentgs

Reputation: 1288

Modify your setState((){}) to have 

setState(() {
      _backGroundPicture = Image.file(File(pickedFile.path));
    });

Upvotes: 0

Related Questions