我想讓文字向右，到目前為止我在做什么
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
static const String _judul = 'Private Chat';
static var _warnaTema = Colors.pink[100];
Widget _dummyExpanded() {
return Expanded(
child: Container(), //contain empty data,
); //just for fill remaining space
}
@override
Widget build(BuildContext context) {
return MaterialApp(
title: _judul,
theme: ThemeData(
primaryColor: _warnaTema,
),
home: Column(
children: [
Container(
child: Row(
children: [
this._dummyExpanded(),
Text('this is real data 1'),
],
),
),
Container(
child: Row(
children: [
this._dummyExpanded(),
Text('this is real data 2'),
],
),
)
],
),
);
}
}
布局輸出是我所期望的（文本在右邊），但是有不需要的代碼。
正如你所看到的，我使用了不必要的方法_dummyExpanded來填充可用空間，它只是用空容器擴展。當然，由于有許多嵌套的行和列，這將很難閱讀，我如何洗掉不需要的方法而不會丟失我期望的布局輸出？
我相信我應該使用對齊方式，但我不知道如何使用
uj5u.com熱心網友回復：
方法一。
Container(
child: Row(
mainAxisAlignment:MainAxisAlignment.end,
children: [
Text('this is real data 2'),
],
),
)
方法二。
我更喜歡這種方法，你可以用這種方法換行。您還可以使用Flexible小部件代替Expanded
Container(
child: Row(
children: [
Expanded(child: Text('this is real data 2', textAlign:TextAlign.end )),
],
),
)
方法三。
如果您只有Text小部件作為小部件的子Column部件，那么您可以crossAxisAlignment: CrossAxisAlignment.end,為您的父Column小部件設定。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/392809.html