鸿蒙应用开发用常用组件感恩父亲节

用常用组件感恩父亲节

效果

本次我们主要通过Image组件，Text组件，Stack组件，实现上图的效果

Stack

Stack组件作为堆叠容器，子组件按照顺序依次入栈，后一个子组件覆盖前一个子组件。

Text

显示一段文本的组件。

Image

Image为图片组件，常用于在应用中显示图片。Image支持加载PixelMap、ResourceStr和DrawableDescriptor类型的数据源，支持png、jpg、jpeg、bmp、svg、webp和gif类型的图片格式。

完整代码

/**
 *
 * @author: 坚果派
 * @date: 2024/6/16
 * @phone：17752170152
 * website：nutpi.com.cn
 * @organization：坚果派
 */
​
​
@Entry
@Component
struct FatherPage {
  build() {
    Stack({ alignContent: Alignment.Bottom }) {
​
      Image($r("app.media.father"))
        .enableAnalyzer(true)
      Text("坚果派")
        .fontSize(50)
        .fontColor(Color.White)
        .width('50%')
        .height('18%')
        .align(Alignment.Center)
      Text("电话：17752170152")
        .fontSize(30)
        .fontColor(Color.White)
​
        .align(Alignment.Center).padding({
        top: 10
      })
​
    }
    .height('100%')
    .width('100%')
  }
}

完毕。