如何在Flutter中对齐单个小部件？

如何对齐小部件要将子窗口小部件在其父窗口中对齐，请使用该Align窗口小部件。如果您知道如何使用Center小部件，那么您是对的，因为Center这只是的特例Align。

将您希望对齐的小部件与“对齐”小部件包装并设置其对齐属性。例如，这将使文本小部件与父级的右中间对齐。

Align(  alignment: Alignment.centerRight,  child: Text("widget"),)

Other options are

```
Alignment.topLeft
```
```
Alignment.topCenter
```
```
Alignment.topRight
```
```
Alignment.centerLeft
```
```
Alignment.center
```
```
Alignment.centerRight
```
```
Alignment.bottomLeft
```
```
Alignment.bottomCenter
```
```
Alignment.bottomRight
```

Here is what that looks like:

您不仅限于这些位置。您可以在任何位置对齐窗口小部件。通过指定x，y对，其中

(0,0)

是视图的中心，而边缘是

1.0

围绕它的单位。也许图像会有所帮助：

任何相对位置在哪里

(x,y)

```
Alignment.topLeft
```
is
```
Alignment(-1.0, -1.0)
```
```
Alignment.topCenter
```
is
```
Alignment(0.0, -1.0)
```
```
Alignment.topRight
```
is
```
Alignment(1.0, -1.0)
```

Alignment.centerLeft

Alignment(-1.0, 0.0)

```
Alignment.center
```
is
```
Alignment(0.0, 0.0)
```

Alignment.centerRight

Alignment(1.0, 0.0)

Alignment.bottomLeft

Alignment(-1.0, 1.0)

Alignment.bottomCenter

Alignment(0.0, 1.0)

Alignment.bottomRight

Alignment(1.0, 1.0)

请注意，图像中的对齐方式

(x,y)

不必在该范围内

[-1, +1]

。对齐

(1,2)

意味着它位于小部件的右侧，位于小部件的下方，高度又是其高度的一半。

这是自定义对齐位置的示例。

Align(  alignment: Alignment(0.7, -0.5),  child: Text("widget"),)

补充代码这是

main.dart

用于制作上述示例的代码，以便于剪切和粘贴。

import 'package:flutter/material.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      home: Scaffold(        appBar: AppBar(),        body: myLayoutWidget(),      ),    );  }}Widget myLayoutWidget() {  return Align(    alignment: Alignment(0.7, -0.5),    child: Text(      "widget",      style: TextStyle(fontSize: 30),    ),  );}

如何在Flutter中对齐单个小部件？

面试问答相关栏目本月热门文章