HarmonyOS学习--三方库

文章目录

• 一、三方库获取
• 二、常用的三方库
• • [1. UI库：](#1. UI库：)
  • [2. 网络库：](#2. 网络库：)
  • [3. 动画库：](#3. 动画库：)
• 三、使用开源三方库
• • [1. 安装与卸载](#1. 安装与卸载)
  • [2. 使用](#2. 使用)
• 四、问题解决
• • [1. zsh: command not found: ohpm](#1. zsh: command not found: ohpm)

一、三方库获取

1. 在Gitee网站中获取
   搜索OpenHarmony-TPC仓库，在tpc_resource中对三方库进行了资源汇总。
2. 通过OpenHarmony三方库中心仓获取
   根据类型或者直接搜索寻找需要的三方库。

二、常用的三方库

1. UI库：

• @ohos/textlayoutbuilder：可以定制任一样式的文本构建工具，包括字体间距、大小、颜色、富文本高亮显示等。
• @ohos/roundedimageview：可以生成圆角矩形、或者椭圆形等图片形状。

2. 网络库：

• @ohos/axios：可以运行在node.js 和浏览器中，基于Axios 原库v1.3.4版本进行适配，并沿用其现有用法和特性。

3. 动画库：

• @ohos/lottie：可以解析Adobe After Effects软件通过Bodymovin插件导出的json格式的动画，并在移动设备上进行本地渲染。
• @ohos/svg：可以解析SVG图片并渲染到页面上。

三、使用开源三方库

以lottie示例使用三方库

@ohos/lottie是基于lottie-web开发，集成在三方库社区内的开源版本，是HarmonyOS系统中复杂动画的一种解决方案。

1. 安装与卸载

• 安装

  ohpm install @ohos/lottie

• 卸载

  ohpm uninstall @ohos/lottie

安装完成后在根目录下的oh-package.json5中，可以找到lottie

2. 使用

1. 引入lottie模块

   import lottie from '@ohos/lottie'

2. 构建渲染上下文

   // 初始化渲染上下文
   private renderingSettings: RenderingContextSettings = new RenderingContextSettings(true);
   private renderingContext: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.renderingSettings);

3. 准备JSON文件

4. 关联画布

   // 加载Canvas画布
   Canvas(this.renderingContext)

5. 加载动画

   this.animateItem = lottie.loadAnimation({
   container: this.renderingContext,
   renderer: 'canvas',
   loop: 10,
   autoplay: true,
   name: this.animateName,
   path: 'common/lottie/data.json'
   });

6. 控制动画

   lottie.play();

四、问题解决

1. zsh: command not found: ohpm

MacOS实用ohpm命令时报错 zsh: command not found: ohpm 的解决方法：

1. 查询Ohpm路径

   /Users/xxx/Library/Huawei/ohpm

2. 修改.bash_profile

   vim .bash_profile

将ohpm环境变量配置到文件中：

# HUAWEI
export OHPM_HOME=/Users/xxx/Library/Huawei/ohpm 
export PATH=${PATH}:${OHPM_HOME}/bin
# HUAWEI END

并输入命令 source .bash_profile 使配置生效：

source .bash_profile

3. 如果退出后无效，把 bash shell 中.bash_profile 全部环境变量（也可以只复制暂时需要的环境变量）加入zsh shell里就可以。

   vim .zshrc
   sourch ~/.zshrc

4. 重启DevEco Studio后生效