SliverAppBar без выцветания в AppBar - PullRequest
Новая
       119

SliverAppBar без выцветания в AppBar

0 голосов
/ 26 марта 2020

Мне очень нравится использовать Slivers, но у меня действительно есть проблема с SliverAppBar: обычно я использую виджет SliverAppBar для создания панели приложений с фоновым изображением с эффектом параллакса. Поэтому все, что я использую, - это гибкое пространство, которое, к сожалению, блокируется порцией AppBar при прокрутке вниз. Я попытался сделать прозрачной часть AppBar, установив прозрачность для значения цвета, но все, что он делает, - это делает все это, включая Flexible Space, прозрачным.

Есть ли способ использовать только гибкое пространство SliverAppBar? без выцветания в части AppBar при прокрутке вниз?

вот код, который я использую: 

SliverAppBar(
          expandedHeight: 220,
          pinned: false,
          forceElevated: true,
          backgroundColor: Colors.transparent,
          stretch: true,
          leading: Container(),
          flexibleSpace: FlexibleSpaceBar(
            collapseMode: CollapseMode.pin,
            background:Stack(
              children: <Widget>[
                Image(
                  fit: BoxFit.cover,
                  width: MediaQuery.of(context).size.width,
                  image: AssetImage('assets/images/image2.png'),
                ),
                Positioned(
                  bottom: 0,
                  child: Container(
                    height: 110,
                    width: MediaQuery.of(context).size.width,
                    color: Colors.grey,
                  ),
                ),
                Positioned(
                  bottom: 10,
                  left: 10,
                  child: CircleAvatar(
                    radius: 45,
                    backgroundImage: AssetImage('assets/images/image.png'),
                  ),
                ),
                Positioned(
                  bottom: 77,
                  left: 110,
                  child: Container(
                    width: MediaQuery.of(context).size.width -110 -60,

                    child: Text(
                      'Name...',
                      overflow: TextOverflow.ellipsis,
                      maxLines: 1,
                      style: TextStyle(
                          fontSize: 20,
                          color: Colors.white
                      ),
                    ),
                  ),
                ),
                Positioned(
                  bottom: 63,
                  left: 110,
                  child: Container(
                    width: MediaQuery.of(context).size.width -110 -60,

                    child: Text(
                      'description...',
                      overflow: TextOverflow.ellipsis,
                      maxLines: 1,
                      style: TextStyle(
                          fontSize: 14,
                          color: Colors.white70
                      ),
                    ),
                  ),
                ),

                Positioned(
                  bottom: 5,
                  left: 110,
                  child: Container(
                    width: MediaQuery.of(context).size.width-110,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,

                      children: <Widget>[

                      ],
                    ),
                  ),
                ),

              ],
            ),
          ),

        ),

Надеюсь, что эти изображения помогут объяснить мою проблему: гибкое пространство выглядит следующим образом: Изображение 1 , но как только вы прокрутите вниз, гибкое пространство исчезает, как показано на этом рисунке: Изображение 2 Я не хочу, чтобы гибкое пространство исчезало.

...