Flutter, как мне создать трехслойный стек - PullRequest
Новая
       0

Flutter, как мне создать трехслойный стек

0 голосов
/ 29 мая 2020

Мне нужно показать 3 контейнера, но для столбца, но нужно показать, как будто они перекрываются

Вот так

enter image description here

Как вы видите на изображении, мне нужно показать 3 виджета Image, тогда это создает новый заголовок учетной записи, чем другой контейнер.

Мой код просто показывает изображение и последний контейнер, который мне нужно знать, как я могу добавить это средний контейнер как на изображении 

Stack(
          children: <Widget>[
            Container(
              padding: EdgeInsets.only(top: statusBarHeight * 0.8),
              height: height * 0.4,
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: AssetImage(
                    'assets/images/place2.jpg',
                  ),
                  fit: BoxFit.fill,
                ),
              ),
            ),
            SingleChildScrollView(
              child: Padding(

                padding: EdgeInsets.only(top: height * 0.3),
                child: SingleChildScrollView(
                  child: ClipRRect(
                    borderRadius: BorderRadius.only(
                        topRight: Radius.circular(30), topLeft: Radius.circular(30)),
                    child: Container(
                      decoration: BoxDecoration(
                        color: Colors.white,
                      ),
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[

                          SizedBox(
                            height: height * 0.031,
                          ),
                          Container(
                            width: width,
                            margin: EdgeInsets.only(left: 10),
                            child: Text(
                              'PLACES',
                              textAlign: TextAlign.left,
                              style: TextStyle(fontSize: 30),
                            ),
                          ),
                          SizedBox(
                            height: height * 0.02,
                          ),

                        ],
                      ),
                    ),
                  ),
                ),
              ),
            ),
            GestureDetector(
              onTap: () {
                print('back');
              },
              child: Align(
                alignment: Alignment.topLeft,
                child: Container(
                  margin: EdgeInsets.only(left: width * 0.03),
                  padding: EdgeInsets.only(top: statusBarHeight * 2),

                  child: Icon(
                    Icons.arrow_back_ios,
                    size: 25,
                    color: Colors.white,
                  ),
                ),
              ),
            ),



          ],
        )

1 Ответ

1 голос
/ 29 мая 2020

Попробуйте использовать виджет «Стек». Он похож на столбец, но его дочерние элементы ставятся друг на друга. он представлен в виджете недели Flutter в Здесь Прочтите использование в Здесь

...