Я не могу расположить виджет по центру
Я должен использовать виджеты Stack и Positioned для своего макета, но также мне нужно убедиться, что мои виджеты расположены по центру, чтобы я не мог использовать лево, право.
Widget _body() {
return Stack(
children: <Widget>[
Positioned(
left: 0,
child: _animation(),
),
Positioned(
top: 300,
child: Text(
"Centered Text",
style: TextStyle(color: Colors.black87, fontSize: 30),
),
Positioned(
top: 350,
child: Text(
"Second Centered Text",
style: TextStyle(color: Colors.black87, fontSize: 30),
),
),
],
);
}
Текстовый виджет должен располагаться по центру.
Ответы 2
Вы должны использовать Align во втором виджете.
Widget _body() {
return Stack(
children: <Widget>[
Positioned(
left: 0,
child: Text("Text here"),
),
Align(
child: Text(
"Centered Text",
style: TextStyle(color: Colors.black87, fontSize: 30),
),
),
],
);
}
Выдает исключение Делегат пользовательского макета с несколькими дочерними элементами _ScaffoldLayout забыл разместить следующие дочерние элементы.
Я просто использовал ваш код и заменил Positioned на Align. Вы уверены, что сделали все правильно?
Теперь это работает, но я хочу добавить третий виджет с выравниванием. Это не работает.
Можете ли вы обновить свой пост, я дам вам знать, как это сделать.
Я обновил старый код (не исправлен код, чтобы не испортить исходный вопрос)
Если вы не хотите использовать Align, тогда нет проблем, вот что вы можете сделать.
Widget _body() {
return Stack(
alignment: Alignment.center, // you need this
children: <Widget>[
Positioned(
top: 0,
left: 0,
child: Text("Text here"),
),
Positioned(
top: 300,
child: Text(
"Centered Text",
style: TextStyle(color: Colors.black87, fontSize: 30),
),
),
Positioned(
top: 350,
child: Text(
"Second Centered Text",
style: TextStyle(color: Colors.black87, fontSize: 30),
),
),
],
);
}
На самом деле я не могу сказать, что не хочу использовать или хочу использовать тот или иной подход. Если есть подход, который позволяет мне не записывать жестко закодированные значения пикселей, такие как выравнивание, я предпочитаю его. При таком подходе я просто добавляю top: 300, top: 350 и т. д.
Хорошо, я дам вам лучшее решение.
Я обновил свой второй ответ, теперь он также будет центрировать ваш третий виджет.