0

为什么会产生这个blank white?我需要滚动窗口在保持静止的小部件下方滚动。所有完整的代码都包含在下面。每个小部件nested by each of their ancestors(下面提供示例继承图像)。我注意到如果您直接elder child widget通过 bypass使用parent widget,那么效果很好。但我需要按如下方式使用它(需要使用所有小部件,包括parent)。

祖父小部件

import 'package:app3/screens/Parent.dart';
import 'package:flutter/material.dart';

int currentIndex1 = 0;

class GrandParent extends StatefulWidget {
  const GrandParent({Key? key}) : super(key: key);

  @override
  _GrandParentState createState() => _GrandParentState();
}

class _GrandParentState extends State<GrandParent>
    with SingleTickerProviderStateMixin {
  final pages = [
    Parent(),
  ];

  late TabController _tabbarcontroller;
  int _currentIndexNavBar = 0;

  @override
  void initState() {
    super.initState();
    _tabbarcontroller = new TabController(length: pages.length, vsync: this);
  }

  @override
  void dispose() {
    _tabbarcontroller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        // child: (pages[currentIndex1]),
        child: new TabBarView(
          controller: _tabbarcontroller,
          children: pages.toList(),
        ),
      ),
      bottomNavigationBar: new BottomNavigationBar(
        currentIndex: _currentIndexNavBar,
        onTap: (value) {
          setState(() {
            _tabbarcontroller.index = value;
            _currentIndexNavBar = value;
          });
        },
        items: [
          BottomNavigationBarItem(
              icon: Icon(Icons.home),
              label: 'Parent',
              backgroundColor: Colors.blue),
          BottomNavigationBarItem(
              icon: Icon(Icons.home),
              label: 'Parent',
              backgroundColor: Colors.blue),
        ],
      ),
    );
  }
}

父小部件

    import 'package:app3/widgets/Posts/SeenByOthers/PostBody/ElderChild.dart';
    import 'package:flutter/material.dart';
    
    class Parent extends StatefulWidget {
      const Parent({Key? key}) : super(key: key);
    
      @override
      _ParentState createState() => _ParentState();
    }
    
    class _ParentState extends State<Parent> {
      @override
      Widget build(BuildContext context) {
   
        return Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
 Container(
        width: 100,
        height: 2500,
        color: Colors.green,
        child: Text('Main bar'),
      ),
      ElderChild(),
            ]);
      }
    }

老孩子小部件

import 'package:app3/widgets/Posts/SeenByOthers/PostBody/YoungerChild.dart';
        import 'package:flutter/material.dart';
        
        class ElderChild extends StatefulWidget {
          const ElderChild({Key? key}) : super(key: key);
        
          @override
          _ElderChildState createState() => _ElderChildState();
        }
        
        class _ElderChildState extends State<ElderChild> {
          @override
          Widget build(BuildContext context) {
            return Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Container(
                  width: 100,
                  color: Colors.red,
                  child: Padding(
                    padding: EdgeInsets.all(5),
                    child: Text('Elder bar'),
                  ),
                ),
                Expanded(
                    child: SingleChildScrollView(
                        child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                      Padding(padding: EdgeInsets.all(15), child: YoungerChild())
                    ])))
              ],
            );
          }
        }

年幼的孩子小部件

import 'package:flutter/material.dart';

class YoungerChild extends StatefulWidget {
  const YoungerChild({Key? key}) : super(key: key);

  @override
  _YoungerChildState createState() => _YoungerChildState();
}

class _YoungerChildState extends State<YoungerChild> {
  @override
  Widget build(BuildContext context) {
    return Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
            width: 100,
            height: 2500,
            color: Colors.amber,
child: Text('This is a scroll view, This is a scroll view'),
          )
        ]);
  }
}

在此处输入图像描述

4

1 回答 1

0

如果您在一个又一个Column内部使用Column,那么它将抛出error高度unbounded以摆脱此错误尝试在具有bounded height或有时mainAxisSize属性的小部件中使用 Column 也可以帮助您

     Column(
            mainAxisSize: MainAxisSize.min,
            children: []
      )
于 2021-12-09T15:53:49.747 回答