如何将 "Listview.builder" 内的物品堆叠在一起？扑

Question

我想将物品堆叠在 Listview.builder 中，但是当我尝试使用 Align() 这样做时class 并设置其 heightfactor: , 它为 top 和 bottom 提供填充和我不想要那个，有人知道我该如何正确堆叠它们吗？

我的中心 SyncfusionLinearGauge：

                      //Center SyncfusionLinearGauge 
                      Expanded(
                        child: ScrollablePositionedList.builder(
                          itemScrollController: itemController,
                          itemCount: _provider.loadedContestants.length,
                          scrollDirection: Axis.vertical,
                          shrinkWrap: true,
                          itemBuilder: (context, index) {
                            final data = _provider.loadedContestants[index];
                            return Align(
                              heightFactor: 0.0001,
                              child: SfLinearGauge(
                                // showLabels: false,
                                // showTicks: false,
                                // showAxisTrack: false,
                                axisLabelStyle: TextStyle(color: Colors.white),
                                majorTickStyle: LinearTickStyle(
                                    color: Colors.white, length: 10),
                                minorTickStyle:
                                    LinearTickStyle(color: Colors.white),
                                axisTrackStyle:
                                    LinearAxisTrackStyle(color: Colors.red),
                                orientation: LinearGaugeOrientation.vertical,
                                minimum: 0,
                                maximum: 100,
                                animationDuration: 500,
                                markerPointers: [
                                  //User pointer
                                  LinearWidgetPointer(
                                    value: data.points,
                                    position: LinearElementPosition.cross,
                                    offset: 50.0,
                                    animationDuration: 2000,
                                    child: UserCardWidget(
                                      data: data,
                                    ),
                                  ),
                                ],
                              ),
                            );
                          },
                        ),
                      ),

我的用户卡：

class UserCardWidget extends StatelessWidget {
  UserCardWidget({Key key, this.data}) : super(key: key);

  DemoUserModel data;

  @override
  Widget build(BuildContext context) {
    bool _isKevinTeam = data.team == 'Kevin';
    return SingleChildScrollView(
      child: Padding(
        padding: const EdgeInsets.only(left: 167.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          // mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              width: 15,
              height: 15,
              decoration: BoxDecoration(
                color: const Color(0xff2da162),
                borderRadius: BorderRadius.all(
                  Radius.circular(50),
                ),
              ),
            ),
            Card(
              child: Padding(
                padding: const EdgeInsets.all(5.0),
                child: Text(
                  '${data.firstName.toString()}M',
                  style: TextStyle(
                    color: Colors.black,
                    fontWeight: FontWeight.w700,
                    fontFamily: "SFProText",
                    fontStyle: FontStyle.normal,
                    fontSize: 13.0,
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

我想要的：

我有：

Answer 1

我最后做的是一起删除 listview.builder 并将列表映射到 markerPointers:[], 所以这是结果。

我的 LinearGauge：

                Expanded(
                  flex: 4,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Expanded(
                        child: SizedBox(
                          height: size.height * 0.57,
                          child: SfLinearGauge(
                            showLabels: false,
                            showTicks: false,
                            showAxisTrack: false,
                            orientation: LinearGaugeOrientation.vertical,
                            minimum: 0,
                            maximum: 100,
                            animationDuration: 500,
                            markerPointers: _sortedList
                                .asMap()
                                .map(
                                  (i, data) {
                                    return MapEntry(
                                      i++,
                                      LinearWidgetPointer(
                                        value: data.points,
                                        position: LinearElementPosition.cross,
                                        animationDuration: 2000,
                                        offset: 500,
                                        child: UserCardWidget(
                                          data: data,
                                          index: i,
                                          isExpandedMethod: _isExpanded,
                                        ),
                                      ),
                                    );
                                  },
                                )
                                .values
                                .toList(),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),

这是结果：

如何将 "Listview.builder" 内的物品堆叠在一起？扑

How to stack the items inside a "Listview.builder" on top of each other? flutter

stack

listview

dart

flutter