我如何在网格视图中使用堆栈小部件（在网格视图中我传递图像列表）

Question

Gride 查看代码：

GridView.builder(
      padding: EdgeInsets.fromLTRB(0, 20, 0, 0),
      itemCount: myCards.length,
      gridDelegate:
           SliverGridDelegateWithFixedCrossAxisCount(
                   mainAxisSpacing: 3, crossAxisCount: 3),
      itemBuilder: (context, index) {
      return myCards[index];},
      ),

结果

我想在网格视图中使用堆栈权重实现什么：

Answer 1

更新答案 2021 年 1 月 31 日

需要导入

import 'package:collection/collection.dart';

另一种方法：首先定义卡片列表和卡片之间的space。

  final double cardSpace = 20;

  final List<Widget> list = [
    Container(width: 50, height: 80, color: Colors.red),
    Container(width: 50, height: 80, color: Colors.blue),
    Container(width: 50, height: 80, color: Colors.green),
    Container(width: 50, height: 80, color: Colors.amber)
  ];

然后在您的列、列表视图或任何您拥有的内容中：

            Stack(children: [
                // Card Deck
                SizedBox(width: 50 + (list.length - 1) * cardSpace, height: 80),
                // Cards
                ...list
                    .mapIndexed((index, widget) => Positioned(
                        left: index * cardSpace,
                        child: ClipRRect(
                            borderRadius: BorderRadius.circular(5),
                            child: widget)))
                    .toList()
              ])

结果：

这样您就可以使用卡片列表并对其编制索引。

改为使用堆栈小部件：

        Stack(
            children: [
              // Deck Size
              const SizedBox(width: 100),
              // Card 1
              Container(width: 50, height: 80, color: Colors.red),
              // Card 2
              Positioned(
                  left: 20,
                  child:
                      Container(width: 50, height: 80, color: Colors.blue)),
              // Card 3
              Positioned(
                  left: 40,
                  right: 0,
                  child: Container(
                      width: 50, height: 80, color: Colors.green)),
            ],
          ),

结果：

我如何在网格视图中使用堆栈小部件（在网格视图中我传递图像列表）

How i can use stack weidget in grid view (in grid view i am passing the lsit of images)

android

flutter

dart

gridview