• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 图形图像开发常见问题
2
3
4## 如何获取设备的dpi值(API 9)
5
6**解决措施**
7
8导入\@ohos.display包，通过getDefaultDisplaySync()方法获取。
9
10**代码示例**
11
12```
13import display from '@ohos.display';
14let displayClass = null;
15try {
16  displayClass = display.getDefaultDisplaySync();
17  console.info('Test densityDPI:' + JSON.stringify(displayClass.densityDPI));
18} catch (exception) {
19  console.error('Failed to obtain the default display object. Code: ' + JSON.stringify(exception));
20}
21```
22
23
24## 如何获取窗口的宽高信息(API 9)
25
26**解决措施**
27
28引入窗口模块\@ohos.window，获取指定窗口对象Window后，在该对象上使用getWindowProperties()获取窗口各个属性，在属性windowRect中获取窗口宽高信息。
29
30**代码示例**
31
32```
33import window from '@ohos.window';
34let windowClass = null;
35try {
36    let promise = window.getLastWindow(this.context);
37    promise.then((data)=> {
38        //获取窗口对象
39        windowClass = data;
40        try {
41            //获取窗口属性
42            let properties = windowClass.getWindowProperties();
43            let rect = properties.windowRect;
44            //rect.width: 窗口宽度；rect.height: 窗口高度
45        } catch (exception) {
46             console.error('Failed to obtain the window properties. Cause: ' + JSON.stringify(exception));
47        }
48        console.info('Succeeded in obtaining the top window. Data: ' + JSON.stringify(data));
49    }).catch((err)=>{
50        console.error('Failed to obtain the top window. Cause: ' + JSON.stringify(err));
51    });} catch (exception) {
52    console.error('Failed to obtain the top window. Cause: ' + JSON.stringify(exception));
53}
54```
55
56
57## 如何对图片进行高斯模糊处理(API 9)
58
59**解决措施**
60
61导入图像处理（\@ohos.multimedia.image）和图像效果（\@ohos.effectKit）模块，对图像进行处理并添加模糊效果。
62
63**代码示例**
64
65```
66import image from "@ohos.multimedia.image";
67import effectKit from "@ohos.effectKit";
68
69  const color = new ArrayBuffer(96);
70  let opts = { editable: true, pixelFormat: 3, size: { height: 4, width: 6 } };
71  image.createPixelMap(color, opts).then((pixelMap) => {
72    let radius = 5;
73    let headFilter = effectKit.createEffect(pixelMap);
74    if (headFilter != null) {
75      headFilter.blur(radius);
76    }
77  })
78```
79**参考链接：**
80
81[图片添加模糊效果](../reference/apis-arkgraphics2d/js-apis-effectKit.md#blur)
82
83
84## EGL绘制操作是否只能在主线程，可以放子线程中执行吗(API 10)
85
86**解决措施**
87
88EGL操作可以在子线程中操作，可以通过创建SharedContext，实现EGL在子线程中操作。创建SharedContext示例代码如下。
89
90**代码示例**
91```cpp
92void CreateShareEglContext()
93{
94  if (renderContext == nullptr) { // renderContext是主线程context
95      RS_LOGE("renderContext_ is nullptr");
96      return;
97  }
98  eglShareContext = renderContext->CreateShareContext();
99  if (eglShareContext == EGL_NO_CONTEXT) {
100      RS_LOGE("eglShareContext is EGL_NO_CONTEXT");
101      return;
102  }
103  if (!eglMakeCurrent(renderContext->GetEGLDisplay(), EGL_NO_SURFACE, EGL_NO_SURFACE, eglShareContext)) {
104      RS_LOGE("eglMakeCurrent failed");
105      return;
106  }
107}
108```
109
110## 如何使用EGL绘制自定义动画(API 10)
111
112**解决措施**
113
114自定义动画需要开发者自主实现，可以采用OpenGL进行绘制。
115关于动画的实现主要是业务方的逻辑，首先业务方需要识别动画触发事件，根据业务诉求获取动画的起点和终点。
116然后根据时间轴和动画曲线计算每一帧的绘制内容。最后调用OpenGL的接口绘制这部分内容。
117
118**参考链接：**
119
120[Native XComponent组件的使用（ArkTS）](https://gitee.com/openharmony/codelabs/tree/master/NativeAPI/XComponent)
121
122## 如何在EGL多线程绘制的场景下同时操作一块buffer进行图形绘制(API 10)
123
124**解决措施**
125
126可以通过每个线程各自产生一块纹理，再将这些纹理合成到一块buffer。
127可以使用sharedContext，实现EGL在子线程中操作。另外绘制操作可通过调用OpenGL实现。
128
129**代码示例**
130```cpp
131void CreateShareEglContext()
132{
133  if (renderContext == nullptr) { // renderContext是主线程context
134      RS_LOGE("renderContext_ is nullptr");
135      return;
136  }
137  eglShareContext = renderContext->CreateShareContext();
138  if (eglShareContext == EGL_NO_CONTEXT) {
139      RS_LOGE("eglShareContext is EGL_NO_CONTEXT");
140      return;
141  }
142  if (!eglMakeCurrent(renderContext->GetEGLDisplay(), EGL_NO_SURFACE, EGL_NO_SURFACE, eglShareContext)) {
143      RS_LOGE("eglMakeCurrent failed");
144      return;
145  }
146}
147```
148## 从一个Ability跳转到另外一个Ability时，是否支持自定义转场动画的设置，如何实现(API 10)
149
150**解决措施**
151
152不支持，UIAbility会在多任务界面只显示一个卡片，为了动效一致性，不开放给开发者定制。
153UIAbility不能用来组合应用内界面，用应用内导航组件Navigation来实现应用内的跳转。
154
155**参考链接：**
156
157[Navigation的使用](../ui/arkts-navigation-navigation.md)
158
159
160
161
162