代码Stack({alignContent:Alignment.Center}){
 Item1()
 Item2()
 Item3()} 默认是居中对齐,后面的Item的优先级比前面的要高。
 特点:代码简洁,效率更高(绝对定位来说的)
“设置浮动位置”指的是在界面布局中调整某个组件(在你的例子中是按钮)相对于其父容器的位置。在你的代码中,使用 .position({ x: 70, y: 100 }) 来设置按钮的位置。这意味着按钮会在父容器(Stack)的坐标系中,以 x=70 和 y=100 的位置来展示。
下面是个例子你可以试试:
@Entry
@Component
struct CardWithButton {
  build() {
    Stack({ alignContent: Alignment.Center }) {
      // 卡片层
      Divider()
        .width(200)
        .height(150)
        .backgroundColor(Color.Orange)
      // 浮动按钮
      Button('Button')
        .width(70)
        .height(30)
        .backgroundColor(Color.Pink)
        .position({ x: 70, y: 100 })  // 设置浮动位置
        .borderRadius(10) // 圆形按钮
    }
  }
}
 

 
@Entry
 @Component
 struct StackExample {
 build() {
 Stack({ alignContent: Alignment.Center }) {
 // 第一层矩形
 Divider()
 .width(200)
 .height(100)
 .backgroundColor(Color.Yellow)
  // 第二层矩形
 Divider()
   .width(180)
    .height(90)
    .backgroundColor(Color.Green)
  // 第三层矩形
  Divider()
    .width(160)
    .height(80)
    .backgroundColor(Color.Blue)
}
 
}
 }
 

@Entry //页面的入口文件,一个文件只能有一个
@Component  //  组件
struct Index // 这个是index是 组件的名字, 只有写在第一个component里面的内容的首内容,下面写的所有都是第一个component的子组件
{
  @State message: string = 'Hello World??';
  // 用于声明全局(可修改的)变量
  build() {
    //build只能有一个根元素,一个根节点,row和colum可以嵌套
Stack({
  alignContent:Alignment.TopEnd
}){
Text("第一个")
  .width(250)
  .height(250)
  .backgroundColor(Color.Green)
  //可以手动调层级  .zIndex(3)
  .padding(50)
  Text("第二个")
    .width(150)
    .height(150)
    .backgroundColor(Color.Blue)
  //可以手动调层级  .zIndex(5)
  Text("第三个")
    .width(50)
    .height(50)
    .backgroundColor(Color.Red)
   //可以手动调层级 .zIndex(3)
}
.width(300)
    .height(600)
    .backgroundColor(Color.Pink)
  }
}
 




















