Flutter Web中的滚动功能

3

我对Flutter Web还很陌生。 我在我的Flutter Web上有3行,第一行是欢迎消息,第二行是产品,最后一行是联系方式,用户需要在我的网站上滚动才能看到这些内容。但是我该如何使用Flutter Web中的Scroll函数包装我的代码呢?这是我的代码。

  class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Scaffold(
      body: Column(
        children: [
          Container(
            // Code Line 1
            height: size.height,
            width: size.width,
            decoration: BoxDecoration(
              image: DecorationImage(
                  image: AssetImage("assets/images/container.jpg"),
                  fit: BoxFit.fitWidth),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                CusAppBar(),
                Spacer(),
                Body(),
                Spacer(
                  flex: 1,
                ),
              ],
            ),
          ),
          Container(
              // Code Line 2 Here
              ),
          Container(
              // Code Line 3 Here
              )
        ],
      ),
    );
  }
}

我的背景是React,通常我们只需在容器外使用标记ScrollView,这样用户就可以滚动页面。但在Flutter Web上该如何实现呢?

谢谢。

1个回答

11

尝试在SingleChildScrollView中添加您的第一列,代码示例如下:

body: SingleChildScrollView(
   child:Column(
     children:[
      //Declare Your Widgets Here
     ],
   ),
),

6
我接受了,但是我不能点赞因为我的声望还不够。抱歉。 - Zeke

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接