鸿蒙-Stage模式-UIAbility组件-优快云博客

UIAbility组件

每一个UIAbility实例，都对应一个最近任务列表中的任务
UIAbility是一种包含用户界面的应用组件，主要用于和用户进行交互

一个应用可以有一个 UIAbility 也可以有多个 UIAbility
单 UIAbility:任务列表只有一个任务。
多 UIAbility:在任务列表中会有多个任务。

鸿蒙-Stage模式-UIAbility组件_Text

应用，模块，UIAbility，page它们直接的关系

鸿蒙-Stage模式-UIAbility组件_微信_02

从这一张图我们可以可以看出来：

1个【应用】可以包含多个【模块】

1个【模块】可以包含多个【UIAbility】

1个【UIAbility】可以包含多个【page】

鸿蒙-Stage模式-UIAbility组件_支付宝_03

如何在项目中新增一个模块(运行模块要使用模拟器真机的哈)

点击项目》右点击》新建==》模块

鸿蒙-Stage模式-UIAbility组件_微信_04

我们目前都知道：1个【应用】可以包含多个【模块】

鸿蒙-Stage模式-UIAbility组件_支付宝_05

鸿蒙-Stage模式-UIAbility组件_支付宝_06

鸿蒙-Stage模式-UIAbility组件_支付宝_07

鸿蒙-Stage模式-UIAbility组件_微信_08

现在我们使用真机运行我们模块

鸿蒙-Stage模式-UIAbility组件_支付宝_09

鸿蒙-Stage模式-UIAbility组件_Text_10

如何在模块中找到UIAbility

鸿蒙-Stage模式-UIAbility组件_Text_11

我们都知道：1个【模块】可以包含多个【UIAbility】
通过上面的图，我们只要目前只有一个UIAbility

1个UIAbility下的多个页面之间互相跳转

//D:\hongmeng\applicationproject\ModuleTexst\src\main\ets\pages\home.ets
import { router } from '@kit.ArkUI';

@Entry
@Component
struct Home {
  @State message: string = 'Hello World';

  build() {
    Column(){
      Row(){
        Text('我是首页哈哈').fontSize(22)
      }
      Row(){
        Button('需要登录').onClick(()=>{
          router.pushUrl({
            url:'pages/Index'
          })
        })
      }
    }
    .height('100%')
    .width('100%')
  }
}

//D:\hongmeng\applicationproject\ModuleTexst\src\main\ets\pages\Index.ets
import { router } from '@kit.ArkUI';

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Column(){
      Row(){
        Text("123")
      }
      Row(){
        Button('需要登录').onClick(()=>{
          router.pushUrl({
            url:'pages/home'
          })
        })
      }
    }
    .height('100%')
    .width('100%')
  }
}