Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter: Image BoxFit.cover doesnt work in Stack

I want two images stack over each other in a gridview and both showing a

image witch covers the whole tile.

But when i add the stackwidget, the Image behaves like there is no

fit: BoxFit.cover

in its build method.

build method of my GridView:

@override
Widget build(BuildContext context) {
    if (widgetsList.length != 0) {
      return new GridView.count(
        primary: false,
        crossAxisCount: 2,
        children: widgetsList,
      );
    } else {
      return Container();
    }   
} 

Gridtile (widget in widgetsList):

@override
  Widget build(BuildContext context) {
    return new Stack(
      children: <Widget>[
        new CustomImage(compareTime: lastUpdatedPictureTime),
        new CustomImage(compareTime: lastUpdatedIconTime)
      ],
    );
  }

build method of my CustomImage:

@override
  Widget build(BuildContext context) {
    var img = imageBytes != null
        ? Image.memory(
            imageBytes,
            fit: BoxFit.cover,
          )
        : Text(errorMsg != null ? errorMsg : "Loading...");
    return new Container(child: img);
  }

When i use no stack and only use one CustomImage per Gridtile it works. So maybe this is a bug?

like image 968
LeptonByte Avatar asked Nov 18 '18 20:11

LeptonByte


1 Answers

Try to add this line inside your Stack widget:

@override
Widget build(BuildContext context) {
  return new Stack(
    fit: StackFit.expand,
    children: <Widget>[
      new CustomImage(compareTime: lastUpdatedPictureTime),
      new CustomImage(compareTime: lastUpdatedIconTime)
    ],
  );
}

This worked for me :)

like image 194
Samy Amine Avatar answered Oct 24 '22 12:10

Samy Amine