水平列表视图的列表可一起滚动Flutter [英] List of Horizontal List view to scroll together Flutter

问题描述

我想创建一个水平列表视图的垂直列表.我已经使用此实现了它.但是我的问题是每个项目都在水平方向分别滚动，我不希望这样.我需要完整的回收站视图一起水平滚动.这是我正在使用的代码.

I want to create a vertical list of a horizontal list view. I have achieved it using this. But my issue is that each item is scrolling separately horizontally and I don't want that. I need that complete recycler view scrolls horizontally together. This is the code I'm using.

ListView.builder(
                itemCount: memberItemArray.length,
                shrinkWrap: true,
                itemBuilder: (BuildContext context, int index) {
                  return SingleChildScrollView(
                    scrollDirection: Axis.horizontal,
                    child: Row(
                      children: <Widget>[
                        scrollItem(
                            75,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sID),
                        scrollItem(
                            200,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sName),
                        scrollItem(
                            150,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sMobile),
                        scrollItem(
                            150,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sPlan != null &&
                                memberItemArray[index].sPlan !=
                                    'null' &&
                                memberItemArray[index].sPlan != ''
                                ? memberItemArray[index].sPlan
                                : '-'),
                        scrollItem(
                            150,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sExpDate != null &&
                                memberItemArray[index].sExpDate !=
                                    'null' &&
                                memberItemArray[index].sExpDate !=
                                    ''
                                ? memberItemArray[index].sExpDate
                                : '-'),
                        scrollItem(
                            100,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sAmount != null &&
                                memberItemArray[index]
                                    .sAmount
                                    .toString() !=
                                    'null' &&
                                memberItemArray[index]
                                    .sAmount
                                    .toString() !=
                                    ''
                                ? memberItemArray[index]
                                .sAmount
                                .toString()
                                : '-'),
                        scrollItem(
                            100,
                            const Color(0x00FFFFFF),
                            const Color(0x50000000),
                            memberItemArray[index].sDue != null &&
                                memberItemArray[index]
                                    .sDue
                                    .toString() !=
                                    'null' &&
                                memberItemArray[index]
                                    .sDue
                                    .toString() !=
                                    ''
                                ? memberItemArray[index]
                                .sDue
                                .toString()
                                : '-'),
                      ],
                    ),
                  );
                })

欢迎任何帮助或建议

推荐答案

经过2天的研究，我终于找到了答案.只需使用 SingleChildScrollView 作为提供滚动方向为水平方向的父级，它的子级将是一个大小框，其 width 将是 static ，正如我所知道的那样列表视图的宽度，并在此大小框内，我们可以直接使用ListView.Builder和此ListView.Builder的子级，它很简单 Row

After 2 days of research, I finally got the answer to this. Simply use SingleChildScrollView as a parent giving scroll direction as horizontal and its child will be a sized box whose width will be static as I already know the width of the list view, and inside this sized box, we can directly use the ListView.Builder and child of this ListView.Builder will be simple Row

SingleChildScrollView(
                    scrollDirection: Axis.horizontal,
                    child: Container(
                      margin: EdgeInsets.only(left: 5, right: 5),
                      child: SizedBox(
                        width: 975,
                        child: ListView.builder(
                            itemCount: memberItemArray.length,
                            shrinkWrap: true,
                            itemBuilder: (BuildContext context, int index) {
                              return Row(
                                children: <Widget>[
                                  scrollItem(
                                      75,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sID),
                                  scrollItem(
                                      200,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sName),
                                  scrollItem(
                                      150,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sMobile),
                                  scrollItem(
                                      150,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sPlan != null &&
                                              memberItemArray[index].sPlan !=
                                                  'null' &&
                                              memberItemArray[index].sPlan != ''
                                          ? memberItemArray[index].sPlan
                                          : '-'),
                                  scrollItem(
                                      150,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sExpDate != null &&
                                              memberItemArray[index].sExpDate !=
                                                  'null' &&
                                              memberItemArray[index].sExpDate !=
                                                  ''
                                          ? memberItemArray[index].sExpDate
                                          : '-'),
                                  scrollItem(
                                      100,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sAmount != null &&
                                              memberItemArray[index]
                                                      .sAmount
                                                      .toString() !=
                                                  'null' &&
                                              memberItemArray[index]
                                                      .sAmount
                                                      .toString() !=
                                                  ''
                                          ? memberItemArray[index]
                                              .sAmount
                                              .toString()
                                          : '-'),
                                  scrollItem(
                                      100,
                                      const Color(0x00FFFFFF),
                                      const Color(0x50000000),
                                      memberItemArray[index].sDue != null &&
                                              memberItemArray[index]
                                                      .sDue
                                                      .toString() !=
                                                  'null' &&
                                              memberItemArray[index]
                                                      .sDue
                                                      .toString() !=
                                                  ''
                                          ? memberItemArray[index]
                                              .sDue
                                              .toString()
                                          : '-'),
                                ],
                              );
                            }),
                      ),
                    ),
                  )

这篇关于水平列表视图的列表可一起滚动Flutter的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！