实战案例-欢迎页面业务（源于黑马程序员）

判断用户是否同意隐私协议，使用用户首选项和自定义弹窗来实现。

UserprivacyDialog页面（使用@previewer可以预览页面）：实现用户隐私协议对话框。

//通过dialog实现代码补全
import { CommonConstants } from '../../common/constants/CommonConstants'
@Preview
@CustomDialog//自定义弹窗
export default struct UserPrivacyDialog{// 使用@CustomDialog装饰器声明弹窗组件
  controller:CustomDialogController
  confirm:()=>void
  cancel:()=>void

  build(){
    Column({space:CommonConstants.SPACE_10}){
      //1.标题（CommonConstants：常量值）
      Text($r('app.string.user_privacy_title'))
        .fontSize(20)
        .fontWeight(CommonConstants.FONT_WEIGHT_700)//字体加粗
      //2.内容
      Text($r('app.string.user_privacy_content'))
      //3.按钮
      Button($r('app.string.agree_label'))
        .width(150)
        .backgroundColor($r('app.color.primary_color'))
        .onClick(()=>{
          this.confirm()
          this.controller.close()
        })
      Button($r('app.string.refuse_label'))
        .width(150)
        .backgroundColor($r('app.color.lightest_primary_color'))
        .fontColor($r('app.color.light_gray'))
        .onClick(()=>{
          this.confirm()
          this.controller.close()
        })
    }
    .width('100%')
    .padding(10)
  }
}

@previewer（可预览）视图下的截图：

WelcomePage页面：在上次的基础上添加页面弹窗内容（同意就跳转到首页，不同意则退出app，在此基础上添加了延时时间）。

import UserPrivacyDialog from '../view/welcome/UserPrivacyDialog'
import preferenceUtil from '../common/utils/PreferenceUtil';
import router from '@ohos.router';
import common from '@ohos.app.ability.common';

//优化代码：提取代码Text中的统一部分，并给opacityWhiteText参数可以改变字体大小和透明度
@Extend(Text) function opacityWhiteText(opacity:number,fontSize:number=10){
  .fontSize(fontSize)
  .opacity(opacity)//透明度
  .fontColor(Color.White)
}

const PREF_KEY = 'userPrivacyKey'//用户隐私协议
//在页面中声明弹出窗控制器，并利用其控制弹窗
@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(()=>{//添加延时时间
      router.replaceUrl({
        url:'pages/Index'
      })
    },1000)
  }

  onConfirm(){
    //1.保存首选项
    preferenceUtil.putPreferenceValue(PREF_KEY,true)
    //2.跳转到页面
    this.jumpToIndex()
  }

  exitApp(){
    //退出App（terminateSelf()终结）
    this.context.terminateSelf()
  }

  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')
          .border({style:BorderStyle.Solid,width:1,color:Color.White,radius:15})
          .opacityWhiteText(0.8)
          .padding({left:5,right:5})//内边距：使文字与边框之间留有距离
        Text('网络')
          .opacityWhiteText(0.8,12)
      }
      Text(`'减更多'指黑马健康App希望通过软件工具的形式，帮助更多用户实现身材管理`)
        .opacityWhiteText(0.6)
      Text('浙ICP备0000000号-36D')
        .opacityWhiteText(0.6)
        .margin({bottom:35})//外边距：防止贴底，与底部留有距离
    }
    .width('100%')
    .height('100%')
    .backgroundColor($r('app.color.welcome_page_background'))
  }
}

在EntryAbility页面中添加加载用户首选项代码，且加载页由默认index页面改为WelcomePage页面。

onCreate(want, launchParam) {
    //1.加载用户首选项
    preferenceUtil.loadPreference(this.context)
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
  }

onWindowStageCreate(windowStage: window.WindowStage) {
    // Main window is created, set main page for this ability
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');

    windowStage.loadContent('pages/WelcomePage', (err, data) => {
      if (err.code) {
        hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
        return;
      }
      hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
    });
  }

另在main_pages.json页面中添加WelcomePage。

{
  "src": [
    "pages/Index",
    "pages/WelcomePage"
  ]
}

运行结果：（点击不同意直接退出app，点击同意就会进入首页，且退出后再点击app也不会有弹窗出现）