Próbuję wyrównać dwa elementy na skraju, jeden po lewej, a drugi po prawej. Mam jeden wiersz wyrównany do lewej, a następnie element podrzędny tego wiersza jest wyrównany do prawej. Jednak wydaje się, że wiersz podrzędny pobiera właściwość wyrównania od swojego rodzica. To jest mój kod
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,
],
);
w rezultacie otrzymuję coś takiego
Left Right
Chciałbym
Left Right
Jest też wystarczająco dużo miejsca na rzędzie. Moje pytanie brzmi: dlaczego podrzędny Row nie wykazuje swojej MainAxisAlignment.end
własności?
flutter
flutter-layout
MistyD
źródło
źródło
settingsRow
, który zawieraText("right")
mainAxisAlignment
Dziecka nie występuje. Czy właściwości rodziców przewyższają właściwości dzieci?Prostym rozwiązaniem byłoby użycie
Spacer()
między dwoma widżetamiRow( children: [ Text("left"), Spacer(), Text("right") ] );
źródło
Możesz to zrobić na wiele sposobów.
Za pomocą
mainAxisAlignment: MainAxisAlignment.spaceBetween
Za pomocą
Spacer
Za pomocą
Expanded
Za pomocą
Flexible
Wyjście :
źródło
Stack
w takim przypadku.Stack
, z pierwszym dzieckiemAlign
(po prawej), a drugim może byćCenter
lub prosteAlign
.Tak
CopsOnRoad
, masz rację, dzięki stosowi możesz wyrównać jeden po prawej, a drugi do środka.Stack( children: [ Align( alignment: Alignment.centerRight, child: Text("right"), ), Align( alignment: Alignment.center, child: Text("center"), ) ], )
źródło