【OpenHarmony】 鸿蒙 UI开发之shimmer-ohos

简介

shimmer是一个简单灵活的为应用视图添加闪烁效果的库，主要有由左到右倾斜，由左到右竖直，由左到右圆形，由上到下水平等闪光效果

下载安装

ohpm install @ohos/shimmer

使用说明

shimmer引用及使用

import { Shapes, Directions, Shimmer, ShimmerElement } from '@ohos/shimmer'

  var mShimmer: Shimmer = new Shimmer()
  //自定义内容
  @Builder content() {
    ...
  }
  //页面展示shimmer效果
  build() {
    Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Center }) {
      ShimmerElement({ mShimmer: this.mShimmer, content: this.content })
    }
    .width('100%')
    .height('100%')
    .backgroundImage('/components/background.jpg', ImageRepeat.XY)
    .backgroundImageSize({ width: 1080, height: 2560 })
    .opacity(0.8)
  }

接口说明

1. 设置效果方向 setDirection(direction: number): Shimmer
2. 设置效果形状 setShape(shape: number): Shimmer
3. 设置闪烁的倾斜角度 setTilt(tilt: number): Shimmer
4. 设置重复模式 setRepeatMode(mode: PlayMode): Shimmer
5. 设置闪烁渐变的速度 setDropoff(dropoff: number): Shimmer
6. 设置闪烁时长 setDuration(millis: number): Shimmer
7. 设置基本alpha值 setBaseAlpha(alpha: number): Shimmer

DD一下： 鸿蒙开发各类文档，也可关注公众号<程序猿百晓生>获取。

1.OpenHarmony开发基础
2.OpenHarmony北向开发环境搭建
3.鸿蒙南向开发环境的搭建
4.鸿蒙生态应用开发白皮书V2.0 & V3.0
5.鸿蒙开发面试真题（含参考答案） 
6.TypeScript入门学习手册
7.OpenHarmony 经典面试题(含参考答案)
8.OpenHarmony设备开发入门【最新版】
9.沉浸式剖析OpenHarmony源代码
10.系统定制指南
11.【OpenHarmony】Uboot 驱动加载流程
12.OpenHarmony构建系统--GN与子系统、部件、模块详解
13.ohos开机init启动流程
14.鸿蒙版性能优化指南
.......

约束与限制

在下述版本验证通过：

• DevEco Studio NEXT Developer Beta3: (5.0.3.530), SDK: API12 (5.0.0.35(SP3))

目录结构

|---- shimmer-ohos  
|     |---- entry  # 示例代码文件夹
|     |---- shimmer  # shimmer库文件夹
|     |     |   └─src
|     |     |   │---└─main  
|     |     |   |----   └─ets
|     |     |   │----      └──components  #默认存在的目录
|     |     |   │----             └──MainPage #默认存在的目录
|     |     |                        │----Shimmer.ets #设置shimmer属性类
|     |     |                        │----ShimmerElement.ets #自定义shimmer样式
|     |     |---- index.ets  # 对外接口
|     |---- README.md  # 安装使用方法