首页 > 解决方案 > 定位容器内的颤动Listview没有滚动

问题描述

我有一个定位的小部件,它有一个容器作为孩子。该容器有一个 Listview.seperated 作为子级,但 listview 没有滚动。我试图更改底部属性的值,但在一系列值中,列表视图在顶部有一个小的滚动空间,但其他地方不会影响滚动。

body: Stack(
    overflow: Overflow.visible,
    children: <Widget>[
      Container(
        height: screenSize.height * 0.2 + 150,
        width: screenSize.width,
        color: Color.fromRGBO(43, 49, 109, 1.0),
      ),
      Positioned(
          left: 20,
          top: -25,
          child: Lottie.asset('assets/gerdali.json',
            height: 400,
            width: 400,
            repeat: false
          )),
      Positioned(
        top: screenSize.height * 0.2 + 20 ,
        bottom: -screenSize.height,
        right:0.0 ,
        left: 0.0,
        child: Container(
          height: screenSize.height,
          width: screenSize.width,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(80.0),
              topRight: Radius.circular(80.0)
            )
          ),
          child: ListView.separated(
            padding: EdgeInsets.only(left: 20.0,right: 20.0,top:80.0),
              itemBuilder:(context,index){
                return TextField(
                  decoration: InputDecoration(
                    filled: true,
                    fillColor: Colors.white,
                    hintText: "",
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(40.0)
                    )
                  ),
                );
              },
              separatorBuilder: (BuildContext,int index){
                return SizedBox(
                  height: 10.0,
                );
              },
              itemCount: 8),
        ),
      ),
      Positioned(
        top: screenSize.height * 0.2 - 60 ,
        left: screenSize.width / 2 - 75,
        child: RawMaterialButton(
          padding: EdgeInsets.all(40.0),
          fillColor: Colors.white,
          shape: CircleBorder(
            side: BorderSide(
              color: Colors.black,
              width: 1.0
            )
          ),
          elevation: 0.0,
          child: Icon(
            Icons.camera_alt,
            color: Colors.grey,
            size: 70.0,
          ),
          onPressed: (){},
        ),)
    ],

标签: flutter

解决方案


你可以查看这段代码,我只是单独设置了一个滚动视图来手动调整它。

Widget build(BuildContext context) {
    final screenSize = MediaQuery.of(context).size;
    return Scaffold(
      body: Stack(
        overflow: Overflow.visible,
        children: <Widget>[
          Positioned(
            top: 0,
            child: Container(
              height: screenSize.height * 0.2 + 150,
              width: screenSize.width,
              color: Color.fromRGBO(43, 49, 109, 1.0),
            ),
          ),
          Positioned(
              left: 20,
              top: -25,
              child: Image.asset('assets/gerdali.json',
                  height: 400, width: 400, repeat: false)),
          Positioned(
            top: screenSize.height * 0.2 + 20,
            bottom: -screenSize.height,
            right: 0.0,
            left: 0.0,
            child: Container(
              height: screenSize.height - (screenSize.height * 0.2 + 20),
              width: screenSize.width,
              decoration: BoxDecoration(
                  color: Colors.red,
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(80.0),
                      topRight: Radius.circular(80.0))),
              child: Column(
                children: [
                  SizedBox(
                    height: 50,
                  ),
                  Container(
                    height: screenSize.height - (screenSize.height * 0.2 + 70),
                    width: screenSize.width,
                    child: ListView.separated(
                        padding:
                            EdgeInsets.only(left: 20.0, right: 20.0, top: 30.0),
                        itemBuilder: (context, index) {
                          return TextField(
                            decoration: InputDecoration(
                                filled: true,
                                fillColor: Colors.white,
                                hintText: "",
                                border: OutlineInputBorder(
                                    borderRadius: BorderRadius.circular(40.0))),
                          );
                        },
                        separatorBuilder: (BuildContext, int index) {
                          return SizedBox(
                            height: 10.0,
                          );
                        },
                        itemCount: 10),
                  ),
                ],
              ),
            ),
          ),
          Positioned(
            top: screenSize.height * 0.2 - 60,
            left: screenSize.width / 2 - 75,
            child: RawMaterialButton(
              padding: EdgeInsets.all(40.0),
              fillColor: Colors.white,
              shape: CircleBorder(
                  side: BorderSide(color: Colors.black, width: 1.0)),
              elevation: 0.0,
              child: Icon(
                Icons.camera_alt,
                color: Colors.grey,
                size: 70.0,
              ),
              onPressed: () {},
            ),
          ),
        ],
      ),
    );
  }

推荐阅读