Question

基本上，我正在尝试实现PageView，因为我知道必须在PageView的父级中定义一个高度才能工作。在gif中，您可以看到，如果我未定义高度，则其父级中会出现错误，但是如果我定义高度，则错误会消失。

实际代码中的Text("hola")元素将动态生成，因此无法定义固定高度。实际上，您可以看到，如果我放一个高度，则会出现另一个错误，因为PageView的内容的高度大于我定义的高度。（MediaQuery.of(context).size.height）

我该如何解决这个问题？

这是我的代码：

  import 'package:flutter/material.dart';

  void main() {
    runApp(MyApp());
  }

  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      print("main");
      return MaterialApp(title: 'Provider Example', initialRoute: '/', routes: {
        '/': (context) => Home(),
        'home': (context) => Home(),
      });
    }
  }

  class Home extends StatelessWidget {
    Home() {
      print("home");
    }

    @override
    Widget build(BuildContext context) {
      return Scaffold(
          backgroundColor: Colors.white,
          appBar: AppBar(
            title: const Text('home'),
          ),
          body: Stack(overflow: Overflow.visible, children: <Widget>[
            Positioned.fill(
                top: 40,
                child: Align(
                  alignment: Alignment.topCenter,
                  child: SingleChildScrollView(
                    child: Column(
                      children: <Widget>[
                        Text("text1"),
                        Text("text2",
                            style: Theme.of(context).textTheme.bodyText2),
                        Container(
                            height: MediaQuery.of(context).size.height,
                            margin: EdgeInsets.symmetric(
                                vertical: 50, horizontal: 20),
                            child: PageView(
                                physics: NeverScrollableScrollPhysics(),
                                children: [
                                  Container(
                                    color: Colors.yellow,
                                    child: Column(
                                      children: <Widget>[
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                        Text("hola"),
                                      ],
                                    ),
                                  ),
                                  Container(color: Colors.blue)
                                ])),
                      ],
                    ),
                  ),
                )),
          ]));
    }
  }

Answer 1

尝试将展开的小部件更改为SingleChildScrollView（）

Answer 2

删除SingleChildScrollView并将下面的代码与Expanded一起使用：

Column(
  children: <Widget>[
    Text("text1"),
    Text("text2", style: Theme.of(context).textTheme.bodyText2),
    Expanded(
      child: Container(
        //height: MediaQuery.of(context).size.height * 1.6,
        margin:
            EdgeInsets.symmetric(vertical: 50, horizontal: 20),
        child: PageView(
          physics: NeverScrollableScrollPhysics(),
          children: [
            Container(
              color: Colors.yellow,
              child: ListView(          //ListView to scroll the content
                children: <Widget>[
                  Column(              //just to center the widgets inside the ListView
                    children: <Widget>[
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                      Text("hola"),
                    ],
                  )
                ],
              ),
            ),
            Container(color: Colors.blue),
          ],
        ),
      ),
    ),
  ],
),

Answer 3

主要问题是您需要将PageView包装在具有一定大小的父级中，否则它将以无穷大的方式扩展，因此您可以将该小部件包装在LimitedBox或{ {3}}，例如，尝试下一个：

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        title: const Text('home'),
      ),
      body: Stack(
        overflow: Overflow.visible,
        children: <Widget>[
          Positioned.fill(
            top: 40,
            child: Align(
              alignment: Alignment.topCenter,
              child: SingleChildScrollView(
                child: Column(
                  children: <Widget>[
                    Text("text1"),
                    Text("text2", style: Theme.of(context).textTheme.bodyText2),
                    Container(
                      margin: EdgeInsets.symmetric(
                        vertical: 50,
                        horizontal: 20,
                      ),
                      child: ConstrainedBox(
                        //Add a constrained box to wrap your widget
                        constraints: BoxConstraints(
                          //Give it a max height you think you will use
                          maxHeight: MediaQuery.of(context).size.height * 2,
                        ),
                        child: PageView(
                          physics: NeverScrollableScrollPhysics(),
                          children: [
                            Container(
                              color: Colors.yellow,
                              child: Column(
                                //make your column occupy only the necessary space
                                mainAxisSize: MainAxisSize.min,
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceAround,
                                children: <Widget>[
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                  Text("hola"),
                                ],
                              ),
                            ),
                            Container(color: Colors.blue)
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

希望有帮助。

PageView需要父级具有定义的高度。如何容纳PageView内容的父级高度？

3 个答案: