• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2023 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 * http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16import displaySync from '@ohos.graphics.displaySync';
17import router from '@ohos.router';
18import Logger from '../utils/Logger';
19const TAG = '[CustomDrawDisplaySync]';
20
21@Entry
22@Component
23struct Index {
24  @State drawFirstSize: number = 25;
25  @State drawSecondSize: number = 25;
26  private backDisplaySyncSlow: displaySync.DisplaySync | undefined = undefined;
27  private backDisplaySyncFast: displaySync.DisplaySync | undefined = undefined;
28  private isBigger_30:boolean = true;
29  private isBigger_60:boolean = true;
30
31  @Builder doSomeRenderFirst() {
32    Text('30')
33      .fontSize(this.drawFirstSize)
34  }
35
36  @Builder doSomeRenderSecond() {
37    Text('60')
38      .fontSize(this.drawSecondSize)
39  }
40
41  CreateDisplaySyncSlow() {
42    let range : ExpectedFrameRateRange = {
43      expected: 30,
44      min: 0,
45      max: 120
46    };
47
48    let draw30 = (ii: displaySync.IntervalInfo) => {
49      if (this.isBigger_30) {
50        this.drawFirstSize += 1;
51        if (this.drawFirstSize > 150) {
52          this.isBigger_30 = false;
53        }
54      } else {
55        this.drawFirstSize -= 1;
56        if (this.drawFirstSize < 25) {
57          this.isBigger_30 = true;
58        }
59      }
60      Logger.info(TAG, '[Draw30] Timestamp:' + ii.timestamp + ' TargetTimeStamp: ' + ii.targetTimestamp);
61    };
62
63    this.backDisplaySyncSlow = displaySync.create();
64    this.backDisplaySyncSlow.setExpectedFrameRateRange(range);
65    this.backDisplaySyncSlow.on("frame", draw30);
66  }
67
68  CreateDisplaySyncFast() {
69    let range : ExpectedFrameRateRange = {
70      expected: 60,
71      min: 0,
72      max: 120
73    };
74
75    let draw60 = (ii: displaySync.IntervalInfo) => {
76      if (this.isBigger_60) {
77        this.drawSecondSize += 1;
78        if (this.drawSecondSize > 150) {
79          this.isBigger_60 = false;
80        }
81      } else {
82        this.drawSecondSize -= 1;
83        if (this.drawSecondSize < 25) {
84          this.isBigger_60 = true;
85        }
86      }
87
88      Logger.info(TAG, '[Draw60] Timestamp:' + ii.timestamp + ' TargetTimeStamp: ' + ii.targetTimestamp);
89    };
90
91    this.backDisplaySyncFast= displaySync.create();
92    this.backDisplaySyncFast.setExpectedFrameRateRange(range);
93    this.backDisplaySyncFast.on("frame", draw60);
94  }
95
96  aboutToDisappear() {
97    if (this.backDisplaySyncSlow) {
98      this.backDisplaySyncSlow.stop();
99      this.backDisplaySyncSlow = undefined;
100    }
101    if (this.backDisplaySyncFast) {
102      this.backDisplaySyncFast.stop();
103      this.backDisplaySyncFast = undefined;
104    }
105
106    Logger.info(TAG, 'DisplaySyncDestructor set all displaySync null');
107  }
108
109  build() {
110    Column() {
111      Row() {
112        this.doSomeRenderFirst();
113      }
114      .height('40%')
115
116      Row() {
117        this.doSomeRenderSecond();
118      }
119      .height('40%')
120
121      Row() {
122        Button('Start')
123          .id('CustomDrawStart')
124          .fontSize(14)
125          .fontWeight(500)
126          .margin({ bottom: 10, left: 5 })
127          .fontColor(Color.White)
128          .onClick((): void => {
129            if (this.backDisplaySyncSlow == undefined) {
130              this.CreateDisplaySyncSlow();
131            }
132            if (this.backDisplaySyncFast == undefined) {
133              this.CreateDisplaySyncFast();
134            }
135            if (this.backDisplaySyncSlow) {
136              this.backDisplaySyncSlow.start();
137            }
138            if (this.backDisplaySyncFast) {
139              this.backDisplaySyncFast.start();
140            }
141          })
142          .width('20%')
143          .height(40)
144          .shadow(ShadowStyle.OUTER_DEFAULT_LG)
145
146        Button('Stop')
147          .id('CustomDrawStop')
148          .fontSize(14)
149          .fontWeight(500)
150          .margin({ bottom: 10, left: 5 })
151          .fontColor(Color.White)
152          .onClick((): void => {
153            if (this.backDisplaySyncSlow) {
154              this.backDisplaySyncSlow.stop();
155            }
156            if (this.backDisplaySyncFast) {
157              this.backDisplaySyncFast.stop();
158            }
159          })
160          .width('20%')
161          .height(40)
162          .shadow(ShadowStyle.OUTER_DEFAULT_LG)
163
164        Button('Back')
165          .id('CustomDrawBack')
166          .fontSize(14)
167          .fontWeight(500)
168          .margin({ bottom: 10, left: 5 })
169          .fontColor(Color.White)
170          .onClick((): void => {
171            if (this.backDisplaySyncSlow) {
172              this.backDisplaySyncSlow.stop();
173            }
174            if (this.backDisplaySyncFast) {
175              this.backDisplaySyncFast.stop();
176            }
177            router.back();
178          })
179          .width('20%')
180          .height(40)
181          .shadow(ShadowStyle.OUTER_DEFAULT_LG)
182      }
183      .width('100%')
184      .justifyContent(FlexAlign.Center)
185      .shadow(ShadowStyle.OUTER_DEFAULT_SM)
186      .alignItems(VerticalAlign.Bottom)
187      .layoutWeight(1)
188    }
189  }
190}