颤振：图像 BoxFit.cover 在堆栈中不起作用

Posted 2023-02-23

【中文标题】颤振：图像 BoxFit.cover 在堆栈中不起作用

【英文标题】：Flutter: Image BoxFit.cover doesnt work in Stack

【发布时间】：2019-04-21 06:17:03

【问题描述】：

我希望两个图像在网格视图中相互堆叠，并且都显示一个

图像女巫覆盖了整个瓷砖。

但是当我添加堆栈小部件时，图像的行为就像没有

适合：BoxFit.cover

在其构建方法中。

我的 GridView 的构建方法：

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

Gridtile（widgetsList 中的小部件）：

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

我的 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);
  

当我不使用堆栈并且每个 Gridtile 只使用一个 CustomImage 时，它​​可以工作。 所以也许这是一个错误？

【问题讨论】：

我会尝试使用Positioned - 最有可能使用Positioned.fill

@pskink 是的，这行得通:) thx

当然，不客气

【参考方案1】：

尝试在 Stack 小部件中添加这一行：

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

这对我有用:)