首页 > 解决方案 > flutter - 同时滚动浏览两个列表视图

问题描述

我想实现两个列表同时滚动的功能。我在列表中放了两个不可滚动的列表,但出现错误。

我从一个列表中获得了偏移量,而另一个提出了移动到该偏移量的想法,但我找不到方法。

我想让你告诉我该怎么做或建议一种新方法。这个问题对我很重要。请告诉我怎么做。

在此处输入图像描述

                  Row(
                    children: [
                      Expanded(
                        child: SizedBox(
                          height: 200,
                          child: ListView(
                            // scrollDirection: Axis.horizontal,
                            children: [
                              Container(
                                height: 36,
                                child: ListView.builder(
                                  physics: NeverScrollableScrollPhysics(),
                                  itemCount:
                                      _selectedTimeStartBtn ? 24 : 49,
                                  scrollDirection: Axis.horizontal,
                                  itemBuilder: (context, index) {
                                    return Container(
                                      alignment: Alignment.center,
                                      padding: const EdgeInsets.symmetric(
                                          horizontal: 17, vertical: 7),
                                      decoration: new BoxDecoration(
                                        color: Color(0xfffff2f1),
                                        border: Border.all(
                                          color: Color(0xffffdddb),
                                        ),
                                        borderRadius:
                                            BorderRadius.circular(5),
                                      ),
                                      child: Text(
                                        (index ~/ 24 == 2)
                                            ? '24:00'
                                            : (index % 24 < 10)
                                                ? '0${index % 24}:00'
                                                : '${index % 24}:00',
                                        textAlign: TextAlign.center,
                                        style: TextStyle(
                                          fontFamily: 'NotoSansKR',
                                          color: Color(0xfff03127),
                                          fontSize: 16,
                                          fontWeight: FontWeight.w400,
                                          fontStyle: FontStyle.normal,
                                        ),
                                      ),
                                    );
                                  },
                                ),
                              ),
                              Container(
                                height: 36,
                                child: ListView.builder(
                                  shrinkWrap: true,
                                  physics: NeverScrollableScrollPhysics(),
                                  itemCount:
                                      _selectedTimeStartBtn ? 24 : 49,
                                  scrollDirection: Axis.horizontal,
                                  itemBuilder: (context, index) {
                                    return Container(
                                      margin: index == 0
                                          ? EdgeInsets.only(left: 50)
                                          : null,
                                      alignment: Alignment.center,
                                      padding: const EdgeInsets.symmetric(
                                          horizontal: 17, vertical: 7),
                                      decoration: new BoxDecoration(
                                        color: Colors.grey,
                                        border: Border.all(
                                          color: Colors.grey,
                                        ),
                                        borderRadius:
                                            BorderRadius.circular(5),
                                      ),
                                      child: Text('DATA'),
                                    );
                                  },
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),

标签: flutterlistviewdart

解决方案


尝试这个:

  1. 将您的行包装在 SingleChildScrollView 中。
  2. 在 SingleChildScrollView 中使用 scrollDirection: Axis.horizo​​ntal。

推荐阅读