翩翩如何动态获取我的页面和我的Listview.Builder的高度？

Question

我想知道如何动态获取我的页面高度，里面有一个Listview.Builder()`。这是我的页面树。

这是我的 新闻.飞镖

return SafeArea(
      child: Scrollbar(
              child: SingleChildScrollView(
                physics: BouncingScrollPhysics(),
                dragStartBehavior: DragStartBehavior.start,
                child: Container(
                  height: MediaQuery.of(context).size.height * 5,
                  margin: EdgeInsets.all(25),
                  child: Column(
                    children: <Widget>[
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
                          Column(
...

后来我们有了 Listview.Builder()

Expanded(child: Consumer<Model>(
                          builder: (context, myModel, child) {
                        return ListView.builder(
                          physics: NeverScrollableScrollPhysics(),
                          scrollDirection: Axis.vertical,
                          itemCount: list.length,
                          itemBuilder: (ctx, index) =>
                              ChangeNotifierProvider.value(
                            value: list[index],
                            child: GestureDetector(
                              onTap: () {
                                setState(() {
                              },
                              child: Item(),
                            ),
                          ),
                        );
                      })),

现在我下面 SingleChildScrollView() 我有一个高度为MediaQuery.of(context).size.height * 5的Container，我想让我的完整屏幕高度动态。如果我删除高度值，我就会得到渲染布局错误，因为没有父级定义一个大小。这个页面是TabbarNavigation的一部分，这是内容。

谁能告诉我如何获得动态的高度？ListView.Builder() ?

EDIT:

下面是我的Tabbar，我在这里定义了Tabbar里面的页面。其中一个是我的 新闻.飞镖

这是Tabbar.dart。

final List<Widget> _pages = [
    NewsScreen(),
    TrendScreen(),
    OtherScreen(),
  ];    


    return Scaffold(
      extendBodyBehindAppBar: true,
      body: _pages[provider.currentIndex],
      bottomNavigationBar: provider.currentIndex != 2
          ? Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
              CustomWidget(),
              BottomNavigationBar(
                onTap: _selectPage,
                backgroundColor: Theme.of(context).primaryColor,
                unselectedItemColor: Color.fromRGBO(130, 130, 130, 1),
                selectedItemColor: Color.fromRGBO(236, 37, 105, 1),
                selectedFontSize: 10,
                iconSize: 22,
                currentIndex: provider.currentIndex,
                type: BottomNavigationBarType.fixed,
                selectedLabelStyle: TextStyle(fontSize: 12),
                items: [
                  BottomNavigationBarItem(
                    backgroundColor: Theme.of(context).primaryColor,
                    icon: Icon(Icons.home),
                    title: Text(
                      'home',
                      style: TextStyle(
                        fontSize: 10,
                      ),
                    ),
                  ),
                  BottomNavigationBarItem(
                    backgroundColor: Theme.of(context).primaryColor,
                    icon: Icon(Icons.star),
                    title: Text(
                      'News',
                      style: TextStyle(
                        fontSize: 10,
                      ),
                    ),
                  ),
                  BottomNavigationBarItem(
                    backgroundColor: Theme.of(context).primaryColor,
                    icon: Icon(Icons.play_arrow),
                    title: Text('other',
                        style: TextStyle(
                          fontSize: 10,
                        )),
                  ),
                ],
              ),
            ])
          : null,
    );
  }

Answer 1

归功于 @pskink !

使用 CustomScrollView() 而不是 SingleChildScrollView(), SliverToBoxAdapter() 和 SliverList() 使得一切工作都如虎添翼!

return SafeArea(
      child: CustomScrollView(
        //scrollDirection: Axis.vertical,
        physics: BouncingScrollPhysics(),
        slivers: <Widget>[
          // Place sliver widgets here
          SliverToBoxAdapter(
              child: Padding(
                  padding: const EdgeInsets.fromLTRB(25, 30, 25, 20),
                  child: SizedBox(
                    height: 299,
                    child: Column(children: <Widget>[
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
...

还有一个列表的例子。

SliverList(
              delegate: SliverChildBuilderDelegate(
            (ctx, index) => ChangeNotifierProvider.value(
              value: list[index],
              child: GestureDetector(
                onTap: () {}),
childCount: rrr.length,
          )),

Answer 2

你可以使用已经使用的 "Flex "属性。Expanded() widget.首先移除顶部的容器。

return SafeArea(
  child: Scrollbar(
          child: SingleChildScrollView(
            physics: BouncingScrollPhysics(),
            dragStartBehavior: DragStartBehavior.start,
            child: Column(
                children: <Widget>[
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                      Column(

...

然后..,

栏目(

children: <Widget>[
    Expanded(
       flex : 1,
       child: Consumer<Model>(
           builder: (context, myModel, child) {
             return ListView.builder(
                physics: NeverScrollableScrollPhysics(),
                scrollDirection: Axis.vertical,
                itemCount: list.length,
                itemBuilder: (ctx, index) =>
                    ChangeNotifierProvider.value(
                      value: list[index],
                      child: GestureDetector(
                         onTap: () {
                            setState(() {
                            },
                         child: Item(),
                        ),
                      ),
                   ;
    })),
 ]),

API文档。https:/api.flutter.devflutterwidgetsExpanded-class.html。

本周的翩翩小工具: https:/www.youtube.comwatch?v=_rnZaagadyo