HarmonyOS 鸿蒙Next：在一个Stack中，添加一个Column组件，如何让Column组件位于Stack组件的底部

发布于 1周前 作者 yuanlaile 最后一次编辑是 5天前 来自 鸿蒙OS

HarmonyOS 鸿蒙Next：在一个Stack中，添加一个Column组件，如何让Column组件位于Stack组件的底部

在一个Stack中， 添加一个 Column组件， 如何让Column组件位于 Stack组件的地步

Harmonyos Next教程
4 回复

使用 .align(Alignment.Bottom)

cke_124.png

[@Entry](/user/Entry)
[@Component](/user/Component)
struct Page35 {
  [@State](/user/State) message: string = 'Hello World';

build() {
Stack() {
Column().width(‘100lpx’).height(‘50lpx’).backgroundColor(Color.Pink)
}.backgroundColor(Color.Blue)
.align(Alignment.Bottom)
.height(‘50%’)
.width(‘50%’)
}
}<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

感谢哈。

这样子不行的 老铁

在HarmonyOS中，要实现Column组件位于Stack组件的底部，可以通过调整Stack的alignment属性或者使用Positioned组件来实现。

  1. 调整Stack的alignment属性（如果适用）：在某些情况下，Stack的alignment属性可能不足以精确控制Column的位置到最底部，因为这主要控制的是子组件在水平或垂直方向上的对齐方式。

  2. 使用Positioned组件：更推荐的方式是在Stack内使用Positioned组件来包裹Column，并设置Positioned的bottom属性为0，这样可以确保Column始终位于Stack的底部。

示例代码片段：

<Stack>
    <!-- 其他组件 -->
    <Positioned bottom="0">
        <Column>
            <!-- Column 内容 -->
        </Column>
    </Positioned>
</Stack>

如果问题依旧没法解决请加我微信，我的微信是itying888。

回到顶部