I am trying to use a TabBarDefaultDiew with a SinglechildVcrollView and a Column. when I build my app, I get this error:

RenderViewport#3997a NEEDS-LAYOUT NEEDS-PAINT

I have tried giving the containers height and width, but it did not suffice. I have seen this error before and it went away when I restricted the height and width of my containers.

here is my code:

class CategoryPage extends StatefulWidget {
  @override
  _CategoryPageState createState() => _CategoryPageState();
}

class _CategoryPageState extends State<CategoryPage> {
  final GlobalKey<ScaffoldState> _categoryScaffoldKey =
      new GlobalKey<ScaffoldState>();
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: DefaultTabController(
        length: 2,
        child: Scaffold(
          key: _categoryScaffoldKey,
          endDrawer: CustomDrawer(),
          body: _buildCategoryBody(context),
        ),
      ),
    );
  }

  Widget _buildCategoryBody(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: <Widget>[
          _buildAppBar(context),
          _buildTabNames(context),
          _buildTabs(context),
        ],
      ),
    );
  }

  Widget _buildAppBar(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 5, horizontal: 3),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(
            icon: Icon(Icons.search, color: Colors.black),
            onPressed: () {
            },
          ),
          Text(
            "test",
            style: TextStyle(fontWeight: FontWeight.bold),
          ),
          IconButton(
            icon: Icon(
              Icons.menu,
              color: Colors.black,
            ),
            onPressed: () => _categoryScaffoldKey.currentState.openEndDrawer(),
          ),
        ],
      ),
    );
  }

  Widget _buildTabNames(BuildContext context) {
    return TabBar(
      tabs: [
        Tab(
          text: "test",
        ),
        Tab(text: "test"),
      ],
    );
  }

  Widget _buildTabs(BuildContext context) {
    return TabBarView(
      children: <Widget>[
        _buildMenCategory(context),
        _buildWomenCategory(context)
      ],
    );
  }

  Widget _buildMenCategory(BuildContext context) {
    return Container(
      height: 10,
      width: 10,
    );
  }

  Widget _buildWomenCategory(BuildContext context) {
    return Container(
      height: 10,
      width: 10,
    );
  }
}

0 Answers