颤振如何隐藏滚动条上的容器

时间:2020-05-23 03:34:47

标签: flutter

我在一列中显示2个小部件。当第二个窗口小部件滚动时,我需要隐藏第一个窗口小部件。

类似这样的东西。

enter image description here

这是我的代码,我有一个容器,其中我在列中显示了2个小部件

Container(
      padding: EdgeInsets.only(top: statusBarHeight * 2),
      child: Column(
        children: <Widget>[
          Container(
            child: Text('PLACES', textAlign: TextAlign.left, style: TextStyle(fontSize: 30),),
          ),
          Expanded(
            child: Container(
              margin: EdgeInsets.only(left: 50),
              width: MediaQuery.of(context).size.width * 0.5,
              child: ListView.builder(
                  itemCount: _places.length,
                  itemBuilder: (ctx, int index) {
                    return Container(
                      padding: EdgeInsets.only(top: 10),
                      child: Column(
                        children: <Widget>[
                          Text(
                            _places[index]['name'],
                            style: TextStyle(fontSize: 20),
                          ),
                          GestureDetector(
                            onTap: (){
                              Navigator.push(
                                context,
                                MaterialPageRoute(builder: (context) => PlaceDetails()),
                              );
                            },
                            child: Container(

                              padding: EdgeInsets.only(top: 20),
                              child: ClipRRect(
                                borderRadius: BorderRadius.circular(20.0),
                                child: Card(
                                  elevation: 40.0,
                                  child: Container(
                                    width: 200,
                                    child: Image(
                                        image:
                                            AssetImage('assets/images/place.jpg')),
                                  ),
                                ),
                              ),
                            ),
                          ),
                          Padding(
                              padding: const EdgeInsets.only(top: 7),
                              child: Row(
                                children: <Widget>[
                                  Icon(Icons.favorite_border, size: 20),
                                  Spacer(),
                                  Text(
                                    _places[index]['where'],
                                  ),
                                ],
                              )),
                        ],
                      ),
                    );
                  }),
            ),
          )
        ],
      ),
    );

它看起来像这样

enter image description here

希望我已经解释了我的问题,但我找不到如何隐藏这样的容器的好方法

1 个答案:

答案 0 :(得分:0)

您可以将CustomScrollViewSilverAppBar配合使用。

CustomScrollView(
 slivers: <Widget>[
  SliverAppBar(
    title: Text('PLACES'),
    expandedHeight: 100,
  ),
  SliverFixedExtentList(
    itemExtent: 150.0,
    delegate: SliverChildListDelegate(
      [
       // Your Items, you can use "List.generate"
      ],
    ),
   ),
 ],
),