Estou tentando alinhar dois itens nos extremos, um à esquerda e outro à direita. Eu tenho uma linha que está alinhada à esquerda e, em seguida, um filho dessa linha está alinhado à direita. No entanto, parece que a linha filha está pegando a propriedade de alinhamento de seu pai. Este é o meu código
var SettingsRow = new Row(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Text("Right",softWrap: true,),
],
);
var nameRow = new Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Text("Left"),
SettingsRow,
],
);
como resultado eu recebo algo assim
Left Right
O que eu gostaria é
Left Right
Também há espaço suficiente na linha. Minha pergunta é por que o filho Row não está exibindo sua MainAxisAlignment.end
propriedade?
flutter
flutter-layout
MistyD
fonte
fonte
settingsRow
, que contémText("right")
mainAxisAlignment
da criança não ocorre. As propriedades dos pais superam as dos filhos?Uma solução simples seria usar
Spacer()
entre os dois widgetsRow( children: [ Text("left"), Spacer(), Text("right") ] );
fonte
Você pode fazer isso de várias maneiras.
Usando
mainAxisAlignment: MainAxisAlignment.spaceBetween
Usando
Spacer
Usando
Expanded
Usando
Flexible
Produto :
fonte
Stack
nesse caso.Stack
, com seu primeiro filho sendoAlign
(à direita) e o segundo poderia ser umCenter
ou simplesAlign
.Sim,
CopsOnRoad
está certo, através da pilha você pode alinhar um à direita e outro no centro.Stack( children: [ Align( alignment: Alignment.centerRight, child: Text("right"), ), Align( alignment: Alignment.center, child: Text("center"), ) ], )
fonte