HarmonyOS 鸿蒙Next Canvas绘制的颜色无法使用颜色资源

发布于 1周前 作者 yuanlaile 来自 鸿蒙OS

HarmonyOS 鸿蒙Next Canvas绘制的颜色无法使用颜色资源

Canvas绘制的颜色类型无法使用$r,需要通过resourceManager.getColorSync转换成number或者string才行。
项目中大量重复使用的颜色,想使用静态变量存储。

但resourceManager需要使用上下文context,如果静态变量文件所在的库在EntryAbility中有引用(如要处理onForeground事件),静态变量会在上下文初始化之前进行加载,导致启动崩溃。

有没有更好的解决方案可以支持使用静态变量存储颜色值~~


更多关于HarmonyOS 鸿蒙Next Canvas绘制的颜色无法使用颜色资源的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

参考以下demo:

//EntryAbility.ets

 onForeground(): void {
   // Ability has brought to foreground
   hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onForeground');
   console.info('app is foreground');
   let context = GlobalContext.getContext().getObject('Context') as common.Context
   let a = context?.resourceManager.getColorSync($r('app.color.start_window_background'))
   console.info('onForeground: '+a?.toString())
 }


// Index.ets
import { GlobalContext } from './GlobalContext';
import { common } from '[@kit](/user/kit).AbilityKit';
[@Entry](/user/Entry)
[@Component](/user/Component)
struct Index {
 private settings: RenderingContextSettings = new RenderingContextSettings(true)
 private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)
 private offCanvas: OffscreenCanvas = new OffscreenCanvas(600, 600)
 aboutToAppear(): void {
   let context = getContext(this)
   GlobalContext.getContext().setObject('Context', context)
   let context1 = GlobalContext.getContext().getObject('Context') as common.Context
   let a = context1?.resourceManager.getColorSync($r('app.color.start_window_background'))
   console.info('aboutToAppear: '+a?.toString())
 }
 build() {
   Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
     Canvas(this.context)
       .width('100%')
       .height('100%')
       .backgroundColor('#ffff00')
       .onReady(() => {
         let a = getContext(this).resourceManager.getColorSync($r('app.color.start_window_background'))
         let offContext = this.offCanvas.getContext("2d", this.settings)
         offContext.shadowBlur = 30
         offContext.shadowColor = a.toString()
         offContext.fillStyle = a.toString()
         offContext.fillRect(30, 30, 100, 100)
         let image = this.offCanvas.transferToImageBitmap()
         this.context.transferFromImageBitmap(image)
       })
   }
   .width('100%')
   .height('100%')
 }
}


//GlobalContext.ets
export class GlobalContext {
 private constructor() {
 }
 private static instance: GlobalContext;
 private _objects = new Map<string, Object>();
 public static getContext(): GlobalContext {
   if (!GlobalContext.instance) {
     GlobalContext.instance = new GlobalContext();
   }
   return GlobalContext.instance;
 }
 getObject(value: string): Object | undefined {
   return this._objects.get(value);
 }
 setObject(key: string, objectClass: Object): void {
   this._objects.set(key, objectClass);
 }
}

更多关于HarmonyOS 鸿蒙Next Canvas绘制的颜色无法使用颜色资源的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙系统中,Next Canvas绘制颜色无法使用颜色资源的问题通常与资源引用方式或资源定义不正确有关。

  1. 确认资源定义:首先确保在resources目录下的colors.xml文件中正确定义了颜色资源。例如:
<resources>
    <color name="my_color">#FF0000</color>
</resources>
  1. 正确引用资源:在代码中引用颜色资源时,应使用ResourceTable类。例如:
// 注意:这里不使用Java代码,但逻辑类似
// var color = ResourceTable.Color_my_color; // 在实际鸿蒙开发中,应有类似方式引用

在鸿蒙的ArkUI(TS/JS)中,引用资源的方式会有所不同,通常通过$r前缀:

let color = $r('color.my_color');
  1. 检查资源ID生成:确保编译后资源ID正确生成,并且没有冲突。

  2. 更新和同步:确保所有资源文件都已正确保存,并且开发环境已同步最新资源。

  3. 重新编译:清理并重新编译项目,以确保所有更改生效。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部