源码 https://github.com/webabcd/HarmonyDemo
作者 webabcd
开天辟地 HarmonyOS(鸿蒙) - 开发基础: HAR(Harmony Archive)
示例如下:
pages\basic\HarDemo.ets
/** HAR(Harmony Archive) - 静态共享包* 支持独立发布(比如要发布你自己实现的第三方库时,就可以将其封装为一个 har 包)* 支持 UIAbility 组件,但是不支持 ExtensionAbility 组件* 不支持在 main_pages.json 中声明页面,也就是说无法通过页面地址跳转到 har 包内的页面,但是可以通过命名路由的方式跳转到 har 包内的页面* 在编译时与应用程序链接,代码直接嵌入到应用二进制文件中*/import { TitleBar } from '../TitleBar';
import { MainPage as har1_MainPage, hello as har1_hello } from 'har1' // 源码方式引用本地的 har 模块的示例
import { MainPage as har2_MainPage, hello as har2_hello } from 'har2' // 文件方式引用指定的 har 文件时示例
import { DialogHelper } from '@pura/harmony-dialog' // 引用第三方 har 包的示例
import { router } from '@kit.ArkUI';@Entry
@Component
struct HarDemo {build() {Column() {TitleBar()Tabs() {TabContent() { MySample1() }.tabBar('基础').align(Alignment.Top)}.scrollable(true).barMode(BarMode.Scrollable).layoutWeight(1)}}
}/** HAR(Harmony Archive)是静态共享包* 右键单击全局项目,然后 New -> Module... -> Static Library 即可创建新 har 包* 在 har 项目中的 oh-package.json5 的 main 指定的文件中,配置需要导出的功能* 如需编译打包,则选中 har 模块,然后在 Build 菜单中编译即可,编译后是 .har 文件** 源码方式引用本地的 har 模块时,如果需要在 entry 模块中引用,则在 entry/oh-package.json5 中做类似如下的配置* {* "dependencies": {* "har1": "../har1"* }* }* 然后执行 ohpm install 后即可* 导入的方法类似如下 import { MainPage as har1_MainPage } from 'har1'** 文件方式引用指定的 har 文件时,如果需要在 entry 模块中引用,则在 entry/oh-package.json5 中做类似如下的配置* {* "dependencies": {* "har2": "../library/har2.har"* }* }* 然后执行 ohpm install 后即可(如果文件更新了则需要再执行 ohpm install)* 导入的方法类似如下 import { MainPage as har2_MainPage } from 'har2'** 引用第三方 har 包时,先在 https://ohpm.openharmony.cn/ 中找到需要的第三方包* 如果需要在全局项目中引用,则在全局目录下执行类似如下的命令即可 ohpm i @pura/harmony-dialog* 然后会发现,在全局项目中的 oh-package.json5 中多了类似如下的配置* {* "dependencies": {* "@pura/harmony-dialog": "^1.1.3"* }* }*/
@Component
struct MySample1 {@State message: string = ""aboutToAppear(): void {// 调用 har 包中的接口this.message += `${har1_hello("webabcd")}\n` // 参见 har1/src/main/ets/utils/Helper.etsthis.message += `${har2_hello("webabcd")}\n` // 参见 har2/src/main/ets/utils/Helper.ets}build() {Column({ space: 10 }) {Text(this.message)// 显示 har 包中的页面har1_MainPage({param1: "value1"}).height(120) // 参见 har1/src/main/ets/components/MainPage.etshar2_MainPage({param1: "value1"}).height(120) // 参见 har2/src/main/ets/components/MainPage.ets// 跳转到 har 包中的指定的页面Button("通过命名路由跳转到 har 包的指定的页面").onClick(() => {router.pushNamedRoute({name: 'routeName1', // 命名路由的名称,参见 har1/src/main/ets/components/MyPage.etsparams: { // 传参param1: "value1",}})})Button("通过命名路由跳转到 har 包的指定的页面").onClick(() => {router.pushNamedRoute({name: 'routeName2', // 命名路由的名称,参见 har2/src/main/ets/components/MyPage.etsparams: { // 传参param1: "value1",}})})Button("第三方库测试").onClick(() => {DialogHelper.showToast('第三方库测试');})}}
}
\har1\Index.ets
// 注:在项目中的 oh-package.json5 的 main 标签需要配置为本文件(Index.ets)// 当前 HAR 库需要导出的功能
export { MainPage } from './src/main/ets/components/MainPage'
export { MyPage } from './src/main/ets/components/MyPage'
export { hello } from './src/main/ets/utils/Helper'
\har1\src\main\ets\utils\Helper.ets
export function hello(name: string) {return `hello(har1):${name}`
}
\har1\src\main\ets\components\MainPage.ets
@Component
export struct MainPage {// 组件参数,在调用此组件的时候可以对其初始化param1: string = ""@State message: string = 'hello har1\n';aboutToAppear(): void {this.message += `param1: ${this.param1}`}build() {Row() {Column() {Text(this.message).fontSize(36).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}
\har1\src\main\ets\components\MyPage.ets
import { router } from "@kit.ArkUI";/** @Entry() - 通过 routeName 指定命名路由的名称,其他包可以通过 router.pushNamedRoute() 导航至指定名称的页面*/
@Entry({ routeName: "routeName1" })
@Component
export struct MyPage {@State message: string = 'hello routeName1\n';aboutToAppear(): void {/** router.getParams() - 获取 router 传递过来的数据*/const params = router.getParams() as Record<string, string>this.message += `param1: ${params.param1}`}build() {Row() {Column() {Text(this.message).fontSize(36).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}
\har2\Index.ets
// 注:在项目中的 oh-package.json5 的 main 标签需要配置为本文件(Index.ets)// 当前 HAR 库需要导出的功能
export { MainPage } from './src/main/ets/components/MainPage'
export { MyPage } from './src/main/ets/components/MyPage'
export { hello } from './src/main/ets/utils/Helper'
\har2\src\main\ets\utils\Helper.ets
export function hello(name: string) {return `hello(har2):${name}`
}
\har2\src\main\ets\components\MainPage.ets
@Component
export struct MainPage {// 组件参数,在调用此组件的时候可以对其初始化param1: string = ""@State message: string = 'hello har2\n';aboutToAppear(): void {this.message += `param1: ${this.param1}`}build() {Row() {Column() {Text(this.message).fontSize(36).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}
\har2\src\main\ets\components\MyPage.ets
import { router } from "@kit.ArkUI";/** @Entry() - 通过 routeName 指定命名路由的名称,其他包可以通过 router.pushNamedRoute() 导航至指定名称的页面*/
@Entry({ routeName: "routeName2" })
@Component
export struct MyPage {@State message: string = 'hello routeName2\n';aboutToAppear(): void {/** router.getParams() - 获取 router 传递过来的数据*/const params = router.getParams() as Record<string, string>this.message += `param1: ${params.param1}`}build() {Row() {Column() {Text(this.message).fontSize(36).fontWeight(FontWeight.Bold)}.width('100%')}.height('100%')}
}
源码 https://github.com/webabcd/HarmonyDemo
作者 webabcd