【问题标题】:Grid view image View difference Problem in Flutter?网格视图图像视图差异 Flutter 中的问题?
【发布时间】:2021-12-22 10:36:11
【问题描述】:

我在 gridview 上显示图像,但我遇到了问题。我想让图像的高度和宽度相等。

这是图片,我想让右边的图片和左边一样宽和高。或者至少在缺失的部分放一个白色的封面。

这是我的代码:

child: Consumer<Images>(
                        builder: (ctx, titles, ch) => GridView.builder(
                            physics: ScrollPhysics(),
                            itemCount: titles.items.length,
                            gridDelegate:
                                SliverGridDelegateWithFixedCrossAxisCount(
                              crossAxisCount: getSize(_currentSliderValue),
                              mainAxisSpacing: 50,
                              childAspectRatio: 115/162.05,
                              crossAxisSpacing: 5,
                            ),
                            itemBuilder: (ctx, index) {

                              saveallimages(titles.items);


                              return GestureDetector(
                                onTap: () => add(titles.items[index].image),
                                //()=>add(titles.items[index].image),
                                child: selected.contains(titles
                                    .items[index].image.path
                                    .toString()) ?

                                Container(child: selectedimage(titles.items[index].image)) :

                                  Container(child:  nonselected(titles.items[index].image))


                              );

这是我的小部件功能:

Widget selectedimage(image) {
    return Stack(children: <Widget>[
      Image.file(image, fit: BoxFit.cover),
      Positioned(
        right: 12,
        bottom: 10,
        child: Image.asset("assets/images/selected.png", width: 26, height: 26),
      )
    ]);
  }

  Widget nonselected(image) {
    return Stack(children: <Widget>[
      Image.file(image, fit: BoxFit.cover),
    ]);
  }

selectedimage 功能是在图像被选中时放上勾号。

【问题讨论】:

    标签: flutter flutter-layout flutter-image flutter-gridview


    【解决方案1】:

    您可以尝试使用 AssetImageFileImage 而不是使用 Image.fileImage.asset 作为孩子> 容器内装饰如:

    Container(
      decoration: BoxDecoration(
        image: DecorationImage(
          image: FileImage(image),
          fit: BoxFit.cover,
        ),
      )
    )
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2023-03-07
      • 1970-01-01
      • 2016-07-01
      • 2011-06-11
      • 2019-06-01
      相关资源
      最近更新 更多