鸿蒙开发———黑马健康app（首页开发）

应用启动时首先展示给用户的页面，用于提供应用的初次引导、用户隐私政策同意、版权信息展示等功能。

使用 布局组件Column、Row、Image、Text 来构建页面的结构。例如，使用 Column 来垂直排列页面内容，Row 来创建水平排列的元素组。

通过 router 模块来处理页面跳转逻辑。例如，在用户同意隐私政策后，使用 router.replaceUrl 方法跳转到应用的首页。

使用 UserPrivacyDialog 组件来创建一个对话框，让用户可以选择同意或拒绝隐私政策。

对话框包含确认和取消按钮，分别对应不同的函数。如果用户选择不同意隐私政策并退出应用，使用 context.terminateSelf 方法来结束当前应用的上下文。

import common from '@ohos.app.ability.common'
import router from '@ohos.router'

import PreferenceUtil from '../common/utils/PreferenceUtil'

import UserPrivacyDialog from '../view/welcome/UserPrivacyDialog'


@Extend(Text) function opacityWhiteText(opacity: number, fontSize: number = 10) {
  .fontSize(fontSize) // 设置字体大小，默认为10
  .opacity(opacity) // 设置透明度
  .fontColor(Color.White) // 设置字体颜色为白色
}

// 定义一个常量，用于在本地偏好设置中存储用户是否同意隐私协议
const PREF_KEY = 'userPrivacyKey'

// 使用Entry装饰器标记这个组件作为应用的入口点
@Entry
@Component
struct WelcomePage {
  // 定义组件的上下文环境
  context = getContext(this) as common.UIAbilityContext
  // 创建自定义对话框控制器实例
  controller: CustomDialogController = new CustomDialogController({
    builder: UserPrivacyDialog({
      // 定义对话框的确认和取消回调函数
      confirm: () => this.onConfirm(),
      cancel: () => this.exitApp()
    })
  })

  // 组件即将显示时调用的方法
  async aboutToAppear(){
    // 1.从本地偏好设置中异步获取用户是否同意隐私协议
    let isAgree = await PreferenceUtil.getPreferenceValue(PREF_KEY, false)
    // 2.根据用户是否同意进行不同的操作
    if(isAgree){
      // 2.1.如果同意，跳转到首页
      this.jumpToIndex()
    }else{
      // 2.2.如果不同意，显示隐私协议对话框
      this.controller.open()
    }
  }

  // 定义跳转到首页的方法
  jumpToIndex(){
    setTimeout(() => {
      // 使用路由模块替换当前页面URL，实现页面跳转
      router.replaceUrl({
        url: 'pages/Index' // 指定要跳转的页面URL
      })
    }, 1000) // 延迟1秒执行跳转
  }

  // 定义用户点击确认按钮时调用的方法
  onConfirm(){
    // 1.将用户同意隐私协议的状态保存到本地偏好设置
    PreferenceUtil.putPreferenceValue(PREF_KEY, true)
    // 2.跳转到首页
    this.jumpToIndex()
  }

  // 定义用户点击取消按钮时调用的方法
  exitApp(){
    // 调用上下文的terminateSelf方法退出应用
    this.context.terminateSelf()
  }

  // 定义组件的UI布局
  build() {
    Column({ space: 10 }) {
      // 1.中央显示Slogan图片
      Row() {
        Image($r('app.media.home_slogan')).width(260)
      }
      .layoutWeight(1) // 设置布局权重

      // 2.显示logo图片
      Image($r('app.media.home_logo')).width(150)

      // 3.显示文字描述
      Row() {
        Text('黑马健康支持').opacityWhiteText(0.8, 12)
        Text('IPv6')
          .opacityWhiteText(0.8)
          .border({ style: BorderStyle.Solid, width: 1, color: Color.White, radius: 15 })
          .padding({ left: 5, right: 5 })
        Text('网络').opacityWhiteText(0.8, 12)
      }

      // 显示应用介绍文字
      Text(`'减更多'指黑马健康App希望通过软件工具的形式，帮助更多用户实现身材管理`)
        .opacityWhiteText(0.6)
      // 显示备案信息
      Text('浙ICP备0000000号-36D')
        .opacityWhiteText(0.4)
        .margin({ bottom: 35 })
    }
    .width('100%') 
    .height('100%') 
    .backgroundColor($r('app.color.welcome_page_background')) // 设置背景颜色
  }
}