Как выровнять содержимое внутри моего контейнера во Flutter? - PullRequest
0 голосов
/ 07 марта 2020

У меня есть несколько кнопок, которые я добавил внутри этого закругленного контейнера. Я хочу выровнять все go в середине. Первоначально, когда я их добавил, они были идеально выровнены, но когда я изменил размер текста под кнопками, выравнивание также изменилось. Вот код:

  Stack(
              children: <Widget>[
                Padding(
                  padding:
                      const EdgeInsets.only(top: 290.0, left: 8, right: 8),
                  child: Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius:
                          const BorderRadius.all(Radius.circular(16.0)),
                    ),
                    height: 110,
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.only(top: 110.0),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      Padding(
                        padding: const EdgeInsets.only(top: 198.0, left: 0),
                        child: Column(
                          children: <Widget>[
                            Container(
                                height: 50,
                                width: 50,
                                decoration: new BoxDecoration(
                                  gradient: LinearGradient(
                                    colors: [
                                      const Color(0xFFFF8C3B),
                                      const Color(0xFFFE524B)
                                    ],
                                    begin: Alignment.centerLeft,
                                    end: Alignment.centerRight,
                                  ),
                                  color: Colors.orange,
                                  shape: BoxShape.circle,
                                ),
                                child: Icon(Entypo.login,
                                    color: Colors.white)),
                            SizedBox(
                              height: 5,
                            ),
                            Text('Sign In', style: TextStyle(
                                color: Color(0xFFFF8C3B),
                                fontFamily: "Netflix",
                                fontWeight: FontWeight.bold,
                                fontSize: 17)),
                          ],
                        ),
                      ),
                      Padding(
                        padding:
                            const EdgeInsets.only(top: 198.0, left: 25),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.start,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Container(
                                height: 50,
                                width: 50,
                                decoration: new BoxDecoration(
                                  gradient: LinearGradient(
                                    colors: [
                                      const Color(0xFFFF8C3B),
                                      const Color(0xFFFE524B)
                                    ],
                                    begin: Alignment.centerLeft,
                                    end: Alignment.centerRight,
                                  ),
                                  color: Colors.orange,
                                  shape: BoxShape.circle,
                                ),
                                child: Padding(
                                  padding: const EdgeInsets.only(
                                      left: 2.0, top: 1),
                                  child: Container(
                                      child: Icon(Entypo.credit,
                                          color: Colors.white)),
                                )),
                            SizedBox(
                              height: 5,
                            ),
                            Text('Payments', style: TextStyle(
                                color: Color(0xFFFF8C3B),
                                fontFamily: "Netflix",
                                fontWeight: FontWeight.bold,
                                fontSize: 17)),
                          ],
                        ),
                      ),
                      Padding(
                        padding:
                            const EdgeInsets.only(top: 198.0, left: 15),
                        child: Column(
                          children: <Widget>[
                            Container(
                                height: 50,
                                width: 50,
                                decoration: new BoxDecoration(
                                  gradient: LinearGradient(
                                    colors: [
                                      const Color(0xFFFF8C3B),
                                      const Color(0xFFFE524B)
                                    ],
                                    begin: Alignment.centerLeft,
                                    end: Alignment.centerRight,
                                  ),
                                  color: Colors.orange,
                                  shape: BoxShape.circle,
                                ),
                                child: Padding(
                                  padding: const EdgeInsets.all(8.0),
                                  child: Container(
                                      child: Icon(Entypo.log_out,
                                          color: Colors.white)),
                                )),
                            SizedBox(
                              height: 5,
                            ),
                            Text('Sign Out', style: TextStyle(
                                color: Color(0xFFFF8C3B),
                                fontFamily: "Netflix",
                                fontWeight: FontWeight.bold,
                                fontSize: 17)),

                          ],
                        ),
                      ),
                      Padding(
                        padding:
                            const EdgeInsets.only(top: 198.0, left: 20),
                        child: Column(
                          children: <Widget>[
                            Container(
                                height: 50,
                                width: 50,
                                decoration: new BoxDecoration(
                                  gradient: LinearGradient(
                                    colors: [
                                      const Color(0xFFFF8C3B),
                                      const Color(0xFFFE524B)
                                    ],
                                    begin: Alignment.centerLeft,
                                    end: Alignment.centerRight,
                                  ),
                                  color: Colors.orange,
                                  shape: BoxShape.circle,
                                ),
                                child: Padding(
                                  padding: const EdgeInsets.all(8.0),
                                  child: Container(
                                      child: Icon(Entypo.info,
                                          color: Colors.white)),
                                )),
                            SizedBox(
                              height: 5,
                            ),
                            Text('About Us', style: TextStyle(
                                color: Color(0xFFFF8C3B),
                                fontFamily: "Netflix",
                                fontWeight: FontWeight.bold,
                                fontSize: 17)),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),

Вот как выглядит выравнивание: enter image description here

Ответы [ 2 ]

2 голосов
/ 07 марта 2020

Вы можете поместить кнопки в ряд. Затем вы можете установить свойство MainAxisAlignment в центр.

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

Положите кнопки в ряд. Затем вы можете установить свойство MainAxisAlignment в центр.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...