Flutter: Image BoxFit.cover doesnt work in Stack

5,653

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 :)

Share:
5,653
LeptonByte
Author by

LeptonByte

Just a random guy who loves coding

Updated on December 07, 2022

Comments

  • LeptonByte
    LeptonByte over 1 year

    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?