Как сделать так, чтобы дочерний виджет ModalBottomSheet выступал вверх, как на этой картинке : - PullRequest
0 голосов
/ 05 августа 2020

Как сделать так, чтобы дочерний виджет ModalBottomSheet выступал наверху

как на этом рисунке :

введите описание изображения здесь

1 Ответ

3 голосов
/ 05 августа 2020

Вы можете использовать Stack, чтобы поместить значок корзины для покупок поверх модального окна. Размер 40 дюймов margin: EdgeInsets.only(top: 40), установленный для контейнера, составляет половину высоты значка корзины для покупок.

showModalBottomSheet(
            backgroundColor: Colors.transparent,
              context: context,
              builder: (context) => Stack(
                children: <Widget>[
                  Container(
                    margin: EdgeInsets.only(top: 40),
                    decoration: BoxDecoration(
                      shape: BoxShape.rectangle,
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(30.0),
                        topRight: Radius.circular(30.0),
                        bottomLeft: Radius.zero,
                        bottomRight: Radius.zero,
                      ),
                    ),
                  ),
                  Positioned(
                    left: 50,
                    child: Container(
                      height: 80,
                      width: 100,
                      child: Image.network('https://assets.webiconspng.com/uploads/2017/09/Shopping-Bag-PNG-Image-40241.png'),
                    ),
                  ),
                ],
              ));

Результат:

res

...