HarmonyOS-启动应用内的UIAbility

在一个应用内，可以将某一块功能抽取成一个Ability。例如，在我的应用里设计了一个小工具：输入1900年到9999年的任何一个年份，响应你该年份对应的生肖。

设计为Ability的方便在于，从底部上滑时，可以在一个应用里显示多个窗口模块，方便用户切换。

创建

1. 在entry目录上右键新建 Ability。正常取名。例如：GuessChineseZodiac
2. 项目自动生成入口类文件：src/main/ets/guesschinesezodiac/GuessChineseZodiac.ets
3. 为该Ability配置启动页：src/main/ets/pages/GuessChineseZodiac/ZodiacMain.ets

  onWindowStageCreate(windowStage: window.WindowStage): void {
    windowStage.loadContent('pages/GuessChineseZodiac/ZodiacMain', (err) => {
      if (err.code) {
        return;
      }
    });
  }

拉起

1. 在 Index页面中 拉起GuessChineseZodiac，并传入用户名。

import { common, Want } from '@kit.AbilityKit';

@Entry
@Component
struct Index {
  message: string = '数据持久化';
  // 拉起其他 module 或者 ability时 需要上下文对象
  context: common.UIAbilityContext = getContext(this) as common.UIAbilityContext
  bundleName = getContext(this.context).applicationInfo.name

  build() {
    Column({ space: 30 }) {
      Text(this.message).fontSize(26)
      // 拉起应用内 UIAbility
      Button('生肖小游戏')
        .onClick(() => {
          let wantInfo: Want = {
            deviceId: '', // 本设备
            bundleName: this.bundleName, //也可动态获取
            moduleName: 'entry', // 目标 模块名称
            abilityName: 'GuessChineseZodiac',
            parameters: {
              username: "dxin"// 参数可以省略
            }
          }
          this.context.startAbility(wantInfo)
        })
   
    }
    .width('100%')
    .height('100%')
    .backgroundColor($r('app.color.theme_color'))
  }
}

2. GuessChineseZodiac Ability的入口类获取参数

  onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {
    // 拉起该 Ability 时获取username
    let username = want?.parameters?.username || '帝心'
    AppStorage.setOrCreate("username", username)
  }

3. GuessChineseZodiac Ability的首页src/main/ets/pages/GuessChineseZodiac/ZodiacMain.ets

import { router } from '@kit.ArkUI';

@Entry
@Component
struct ZodiacMain {

  // 获取主 Ability 的用户名
 @StorageProp("username") username :string = ""

  @State message: string = '年份<->生效速查';
  @State year: string = ""
  @State zodiac: string = "猴"
  // 查询是否成功的状态
  @State status: boolean = true

  build() {
    Column({ space: 30 }) {

      Text(this.message).fontSize(30).fontColor("#bf0e12ff")
      TextInput({ placeholder: "请输入年份1900-9999", text: $$this.year })
        .width("58%")
        .height(40)
        .backgroundColor("#fff")
        .onKeyEvent((event) => {
          //回车 2054
          if (event.keyCode === 2054) {
            this.zodiac = this.getChineseZodiac(this.year)
          }
        })
        .onFocus(() => {
          // 重新获焦的时候
          this.year = ""
        })
      Button("get zodiac")
        .width("50%")
        .onClick((event: ClickEvent) => {

          this.zodiac = this.getChineseZodiac(this.year)
        })
      Text(this.zodiac)
        .fontSize(this.status ? 30 : 20)
        .fontColor(this.status ? "#ff000000" : "#ffe70000")
        .decoration({type:TextDecorationType.Underline})

      Divider()
      Text() {
        Span("user:")
        Span(this.username).fontColor("#ff0eaba6")
          .onClick(() => {
            router.back()
          })
      }
      .fontSize(24)
      Blank()
    }
    .width('100%')
    .height('100%')
    .backgroundColor($r('app.color.theme_color'))
    .padding({ top: 50 })
  }

  getChineseZodiac(year: string) {

    let yearNum = parseInt(year)
    if (yearNum >= 1900 && yearNum <= 9999) {
      const zodiacs = ['鼠', '牛', '虎', '兔', '龙', '蛇', '马', '羊', '猴', '鸡', '狗', '猪'];
      // 1900年是鼠年，所以我们将年份减去1900，然后取模12来找到对应的生肖。
      let index = (yearNum - 1900) % 12;
      this.status = true
      return zodiacs[index];
    } else {
      this.status = false
      return "输入格式错误"
    }

  }
}

效果