Stack实现叠层布局的方式

Stack实现叠层布局的方式

HarmonyOS
2024-07-31 10:33:01
浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
NGKSWCIDT

Stack组件作为一种容器组件,其内部可承载多种子元素。这些子元素在Stack内部默认以居中堆叠的方式进行布局。在Stack的约束之下,子元素能够自主定义其样式并进行排列,从而实现多样化的界面设计。

// xxx.ets
let MTop:Record<string,number> = { 'top': 50 }

@Entry
@Component
struct StackExample {
  build() {
    Column(){
      Stack({ }) {
        Column(){}.width('90%').height('100%').backgroundColor('#ff58b87c')
        Text('text').width('60%').height('60%').backgroundColor('#ffc3f6aa')
        Button('button').width('30%').height('30%').backgroundColor('#ff8ff3eb').fontColor('#000')
      }.width('100%').height(150).margin(MTop)
    }
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
分享
微博
QQ
微信
回复
2024-07-31 18:51:19


相关问题
页面导航如何实现两个页面
2141浏览 • 1回复 待解决
页面导航如何实现A B两个页面
829浏览 • 1回复 待解决
RelativeContainer布局嵌套Stack失效
653浏览 • 1回复 待解决
HarmonyOS Native获取应用路径方式
828浏览 • 1回复 待解决
Stack布局实现吗?
950浏览 • 1回复 待解决
使用List组件设置多列布局方式
884浏览 • 1回复 待解决