滚动条不显示在底部,Flutter中带有水平Listview

时间:2020-07-30 07:30:59

标签: flutter listview dart scrollbar

我正在开发带有滚动条的水平Listview,该滚动条在垂直Listview中可以完美地工作,但是在水平Listview中,滚动条在垂直之间显示而不是在底部显示

在android设备滚动条的另一侧显示在底部的正确位置, 这件事仅在ios设备上发生。

我也尝试了Scrollbar和CupertinoScrollbar,但结果相同。

我的Listview代码,

Container(
    height: 128.0,
//  color: Colors.yellow,
    child:
    CupertinoScrollbar(
//  Scrollbar(
        child:ListView.separated(
            scrollDirection: Axis.horizontal,
            separatorBuilder: (context, index) => Divider(),
            itemCount: arrayDates.length,
            itemBuilder: (context, index) {
                return 
                GestureDetector(
                    child: Container(
//                      color:Colors.yellow,
                        width: 70.0,
                        height: 180 - 50.0,
                        padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                        child: Center(
                            child: Container(
                                decoration: BoxDecoration(
                                    borderRadius: new BorderRadius.all(Radius.circular(8.0)),
                                    color: varSelectedDate == arrayDates[index] ? Color(0xff1f3666) : Colors.white,
                                ),
                                height: 180 - 50.0 - 25,
                                width: 60,
                                child: Column(
                                    children: <Widget>[
                                        SizedBox(height: 15,),

                                        Row(

                                            crossAxisAlignment: CrossAxisAlignment.center,
                                            mainAxisAlignment: MainAxisAlignment.center,

                                            children: <Widget>[
                                                Text(
                                                    DateFormat("EEE").format(DateTime.parse(arrayDates[index])),
                                                    textAlign: TextAlign.center ,
                                                    style :TextStyle(
                                                        color: varSelectedDate == arrayDates[index] ? Colors.white : Colors.grey[600], 
                                                        fontSize: 16.0,
                                                        fontWeight: FontWeight.normal
                                                        ),
                                                    ),
                                            ],
                                        ),

                                        SizedBox(height: 25,),

                                        Row(

                                            crossAxisAlignment: CrossAxisAlignment.center,
                                            mainAxisAlignment: MainAxisAlignment.center,

                                            children: <Widget>[
                                                Text(
                                                    DateFormat("dd").format(DateTime.parse(arrayDates[index])),
                                                    textAlign: TextAlign.center ,
                                                    style :TextStyle(color: varSelectedDate == arrayDates[index] ? Colors.white : Colors.grey[600], fontSize: 24.0,fontWeight: FontWeight.bold),
                                                ),
                                            ],
                                        ),
                                    ],
                                ),
                            )
                        )
                    ),

                onTap: () {
                    setState(() {
                        varSelectedDate = arrayDates[index];
                    });

                    print(varSelectedDate);
                },
            );} 
        )
    ),
),

enter image description here

水平滚动条是否需要编写其他代码。

0 个答案:

没有答案