flutter 单个子滚动视图在抖动中未滚动

aydmsdu9  于 2023-06-07  发布在  Flutter
关注(0)|答案(2)|浏览(172)

我正在创建一个博客应用程序与博客。我使用的是hildscrollview来实现滚动功能。但滚动不工作。但没有渲染溢出错误。
当您有一个通常完全可见的单个框时,此小部件非常有用,例如时间选择器中的钟面,但您需要确保如果容器在一个轴(滚动方向)上变得太小,则可以滚动它。

body: SingleChildScrollView(
        child: Container(
          child: Column(
            children: <Widget>[
              SizedBox(height: 12),
              ListView.builder(
                scrollDirection: Axis.vertical,
                shrinkWrap: true,
                padding: const EdgeInsets.all(8),
                itemCount: blogs.length,
                itemBuilder: (BuildContext context, int index) {
                  return Container(
                    child: SingleChildScrollView(
                      child: Center(
                        child: Column(
                          children: <Widget>[
                            Container(
                              height: 350,
                              width: double.infinity,
                              decoration: BoxDecoration(
                                gradient: LinearGradient(
                                  begin: Alignment.topLeft,
                                  end: Alignment.bottomRight,
                                  colors: <Color>[
                                    Colors.orange,
                                    Colors.red,
                                  ],
                                ),
                                borderRadius: BorderRadius.circular(20),
                              ),
                              child: FlatButton(
                                onPressed: () {
                                  Navigator.push(
                                    context,
                                    MaterialPageRoute(
                                      builder: (context) => BlogExpanded(
                                        title: blogs[index].title,
                                        content: blogs[index].content,
                                        pic1: Image.asset('hoilogo.png'),
                                        pic2: Image.asset('hoilogo.png'),
                                      ),
                                    ),
                                  );
                                },
                                child: SingleChildScrollView(
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.center,
                                    children: <Widget>[
                                      Text(
                                        blogs[index].title,
                                        textAlign: TextAlign.center,
                                        style: kTitleHeadingBlogCard,
                                      ),
                                      SizedBox(height: 30),
                                      Image.asset('assets/images/hoilogo.png'),
                                    ],
                                  ),
                                ),
                              ),
                            ),
                            SizedBox(height: 20),
                          ],
                        ),
                      ),
                    ),
                  );
                },
              ),
            ],
          ),
        ),
      ),

我甚至试图添加容器,但它不滚动

toiithl6

toiithl61#

找到下面删除SingleChildScrollview的代码&它需要Image小部件的一些静态高度和宽度。

Container(
        child:  ListView.builder(
          scrollDirection: Axis.vertical,
          shrinkWrap: true,
          padding: const EdgeInsets.all(8),
          itemCount: 5,
          itemBuilder: (BuildContext context, int index) {
            return Container(
              child: Center(
                child: Column(
                  children: <Widget>[
                    Container(
                      height: 350,
                      width: double.infinity,
                      decoration: BoxDecoration(
                        gradient: LinearGradient(
                          begin: Alignment.topLeft,
                          end: Alignment.bottomRight,
                          colors: <Color>[
                            Colors.orange,
                            Colors.red,
                          ],
                        ),
                        borderRadius: BorderRadius.circular(20),
                      ),
                      child: FlatButton(
                        onPressed: () {
                        },
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: <Widget>[
                            Text(
                              "fjj ",
                              textAlign: TextAlign.center,
                            ),
                            SizedBox(height: 30),
                            Image.asset('assets/images/image.jpg', fit: BoxFit.cover,height: 300, width: 900,),
                          ],
                        ),
                      ),
                    ),
                    SizedBox(height: 20),
                  ],
                ),
              ),
            );
          },
        ),
      )
pxiryf3j

pxiryf3j2#

在您的代码中,您正在使用shrinkWrap: true嵌套多个滚动视图。然而,使用收缩 Package 效果的性能,如在this视频中提到的(必须观看)。
我建议使用CustomScrollView代替SliverList

相关问题