如何让 SingleChildScrollView 在 Flutter 中嵌套有小部件的列上工作

时间:2021-07-01 13:11:58

标签: flutter flutter-layout scrollview

请帮助我正在尝试创建一个滚动列,以下内容只是引发错误。我究竟做错了什么 :-( 我试过嵌套扩展和列,但似乎无法让下面的代码正常工作。任何人都可以建议吗?

   child: SingleChildScrollView(
              child: Column(
                children: [
                  ConstrainedBox(
                    constraints: BoxConstraints(maxHeight: 290, minHeight: 200.0),
                    //height: 285, // card height
                    //width: 400,
                    child: PageView.builder(
                      itemCount: videObj.results.length,
                      controller: PageController(viewportFraction: 0.7),
                      //onPageChanged: (int index) => setState(() => _index = index),
                      itemBuilder: (_, i) {
                        String vidKey = videObj.results[i].key;
                        String thumbPath = VideoDetails.thumbURL.replaceAll('xxxxxx', vidKey);
                        String videoPath = VideoDetails.videoURL + vidKey;

                return Transform.scale(
                  scale: i == _index ? 1 : 0.9,
                  child: new InkWell(
                    //onFocusChange: (hasFocus){ _index++;},
                    onTap: (){
                      videoPath ;
                      print(videoPath);
                           Uri.parse(
                          videoPath);
                    },
                    child: Card(
                      clipBehavior: Clip.antiAlias,
                      child: Column(
                        children: [
                          Image.network(
                            thumbPath,
                            //height: 200.0,
                            //width: 500.0,
                            fit: BoxFit.cover,
                          ),
                          ListTile(
                            title: Text(videObj.results[i].name),
                          ),
                        ],
                      ),
                    ),
                  ),
                );
              },
            ),
          ),
          Expanded(
            // A flexible child that will grow to fit the viewport but
            // still be at least as big as necessary to fit its contents.
            child: Container(
              color: const Color(0xff000000), // Red
              height: 20.0,
              alignment: Alignment.topLeft,
              padding: EdgeInsets.all(30.0),
              child: Text(widget.movieDets.title,
                  textAlign: TextAlign.justify,
                  style: const TextStyle(
                      fontWeight: FontWeight.bold,
                      fontSize: 25.0,
                      color: Colors.white70)

              ),
            ),
          ),
          Spacer(),
          Text('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse semper iaculis elit accumsan lacinia. Nullam non sem non elit sagittis vestibulum id a eros. Proin vitae magna rutrum, hendrerit est nec, aliquam magna. Proin lobortis iaculis felis nec tempus. Nam a consequat ante. Aliquam eu arcu nec velit varius rutrum ac a nisl. Quisque id augue iaculis, convallis massa ut, pretium elit. Suspendisse fringilla ipsum erat, quis feugiat lorem dictum quis. Nullam et iaculis orci, sit amet auctor augue.', style: const TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 25.0,
              color: Colors.white70),),

        ],
      ),
    ),

======== 渲染库捕获的异常 ================================== ==================== 在 performLayout() 期间抛出了以下断言: RenderFlex 子级具有非零 flex,但传入的高度约束是无界的。

1 个答案:

答案 0 :(得分:0)

首先,不要使用 Expanded 小部件或 Spacer - 它们会导致 Column 具有无限高度,这在 SingleChildScrollView 等可滚动小部件中不起作用。