为什么不使用anchors而使用Layout.alignment

在 QML 中，`anchors` 和 `Layout.alignment` 都可以用于控制组件的位置和对齐方式，但它们各自适用于不同的场景和布局类型。这里是它们的主要区别，以及为什么在某些情况下选择使用 `Layout.alignment` 而不是 `anchors`：

### `anchors`

- **用途**: `anchors` 用于设置组件在其父组件中的位置，通常用于不涉及布局的场景。它允许你将组件的边缘与父组件的边缘对齐，或者与其他组件对齐。
- **功能**: `anchors` 提供了一种更直接的方式来管理位置，例如将组件居中、对齐左边缘或右边缘等。

**示例:**
```qml
Rectangle {
    width: 200
    height: 200

    Text {
        text: "Hello"
        anchors.centerIn: parent
    }
}
```

在这个例子中，`anchors.centerIn` 将 `Text` 组件居中对齐到其父组件 `Rectangle`。

### `Layout.alignment`

- **用途**: `Layout.alignment` 主要用于 `RowLayout`、`ColumnLayout`、`GridLayout` 等布局管理器中。它控制组件在布局中的对齐方式，尤其是在这些布局管理器中，组件的位置由布局管理器控制。
- **功能**: 在布局管理器中，组件的实际位置和大小由布局管理器决定，而不是通过绝对位置。`Layout.alignment` 用于设置组件在布局单元中的对齐方式，例如在 `ColumnLayout` 中垂直和水平居中。

**示例:**
```qml
ColumnLayout {
    width: 200
    height: 200

    Label {
        text: "Top"
        Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
    }

    Label {
        text: "Center"
        Layout.alignment: Qt.AlignHCenter
    }

    Label {
        text: "Bottom"
        Layout.alignment: Qt.AlignBottom | Qt.AlignHCenter
    }
}
```

在这个例子中，`Layout.alignment` 用于设置 `Label` 组件在 `ColumnLayout` 中的对齐方式。

### 为什么使用 `Layout.alignment` 而不是 `anchors`

- **布局管理**: 在使用布局管理器（如 `ColumnLayout`）时，`Layout.alignment` 是控制组件对齐的适当方式，因为布局管理器会自动处理组件的位置和大小。`anchors` 在布局管理器中不起作用，因为布局管理器已经在管理这些属性。
- **布局控制**: `Layout.alignment` 可以与其他布局属性（如 `Layout.fillWidth` 和 `Layout.fillHeight`）结合使用，以获得更精细的布局控制。它允许你在布局单元内对齐组件，而 `anchors` 则不适用于这种场景。

### 总结

- 使用 `anchors` 适合直接控制组件的位置和对齐，不涉及布局管理器的场景。
- 使用 `Layout.alignment` 适合在布局管理器中控制组件的对齐方式，因为布局管理器负责组件的位置和大小。

在你提供的 QML 代码中，使用 `Layout.alignment` 是因为 `ColumnLayout` 是一个布局管理器，它管理了子组件的位置，因此需要使用 `Layout.alignment` 来控制组件在布局中的对齐方式。