开源鸿蒙应用项目开发教程（微课版）课件 第5次课 UI自适应布局-层叠与弹性布局.pptxVIP

《鸿蒙应用安全开发》在线开放课程项目2设计转盘式抽奖程序主讲：本课程团队UI自适应布局-层叠与弹性布局

目录ContentsUI常用布局-自适应布局一、层叠布局二、弹性布局三、拓展

一、层叠布局层叠布局用于在屏幕上预留一块区域来显示组件中的元素，提供元素可以重叠的布局。层叠布局通过Stack容器组件实现位置的固定定位与层叠，容器中的子元素（子组件）依次入栈，后一个子元素覆盖前一个子元素，子元素可以叠加，也可以设置位置。层叠布局具有较强的页面层叠、位置定位能力，其使用场景有广告、卡片层叠效果等。Stack，堆叠容器，子组件按照顺序依次入栈，后一个子组件覆盖前一个子组件。其接口如下：Stack(value?:{alignContent?:Alignment})

一、层叠布局【例2-3】Stack层叠布局，展示子元素位置的固定定位与层叠。实现此布局的思路：设置子元素依次入栈，后一个子元素覆盖前一个子元素，子元素可以叠加。//StackExam.ets@Entry@ComponentstructStackExam{build(){Stack({alignContent:Alignment.Center}){Text(子组件1，显示在底部).width(90%).height(100%).textAlign(TextAlign.Center