• 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 XComponentContext from '../interface/XComponentContext';
17import router from '@ohos.router';
18import Logger from '../utils/Logger';
19const TAG = '[XComponentDisplaySync]';
20
21@Entry
22@Component
23struct Index {
24  private xComponentContext1: XComponentContext | undefined = undefined;
25  private xComponentContext2: XComponentContext | undefined = undefined;
26
27  build() {
28    Column() {
29      Row() {
30        Text('30fps')
31          .fontWeight(FontWeight.Bold)
32          .fontSize(12)
33          .fontColor(Color.Red)
34          .textAlign(TextAlign.End)
35          .width(40)
36          .height(30)
37
38        XComponent({ id: 'xcomponentId_30', type: 'surface', libraryname: 'entry' })
39          .onLoad((xComponentContext) => {
40            this.xComponentContext1 = xComponentContext as XComponentContext;
41          }).width('832px')
42      }.height('40%')
43
44      Row() {
45        Text('120fps')
46          .fontWeight(FontWeight.Bold)
47          .fontSize(12)
48          .fontColor(Color.Red)
49          .textAlign(TextAlign.End)
50          .width(40)
51          .height(30)
52
53        XComponent({ id: 'xcomponentId_120', type: 'surface', libraryname: 'entry' })
54          .onLoad((xComponentContext) => {
55            this.xComponentContext2 = xComponentContext as XComponentContext;
56          }).width('832px')// Multiples of 64
57      }.height('40%')
58
59      Row() {
60        Button('Start')
61          .id('Start')
62          .fontSize(14)
63          .fontWeight(500)
64          .margin({ bottom: 20, right: 6, left: 6 })
65          .onClick(() => {
66            Logger.info(TAG, "Start click");
67            if (this.xComponentContext1) {
68              Logger.info(TAG, "Register1");
69              this.xComponentContext1.register();
70            }
71            if (this.xComponentContext2) {
72              Logger.info(TAG, "Register2");
73              this.xComponentContext2.register();
74            }
75          })
76          .width('30%')
77          .height(40)
78          .shadow(ShadowStyle.OUTER_DEFAULT_LG)
79
80        Button('Stop')
81          .id('Stop')
82          .fontSize(14)
83          .fontWeight(500)
84          .margin({ bottom: 20, left: 6 })
85          .onClick(() => {
86            Logger.info(TAG, "Stop click");
87            if (this.xComponentContext1) {
88              Logger.info(TAG, "Unregister1");
89              this.xComponentContext1.unregister();
90            }
91            if (this.xComponentContext2) {
92              Logger.info(TAG, "Unregister2");
93              this.xComponentContext2.unregister();
94            }
95          })
96          .width('30%')
97          .height(40)
98          .shadow(ShadowStyle.OUTER_DEFAULT_LG)
99
100        // 返回按钮
101        Button('Back')
102          .id('Back')
103          .fontSize(14)
104          .fontWeight(500)
105          .margin({ bottom: 20, left: 6 })
106          .onClick((): void => {
107            if (this.xComponentContext1) {
108              Logger.info(TAG, "Unregister1");
109              this.xComponentContext1.unregister();
110            }
111            if (this.xComponentContext2) {
112              Logger.info(TAG, "Unregister2");
113              this.xComponentContext2.unregister();
114            }
115            router.back();
116          })
117          .width('30%')
118          .height(40)
119          .shadow(ShadowStyle.OUTER_DEFAULT_LG)
120      }
121      .width('100%')
122      .justifyContent(FlexAlign.Center)
123      .shadow(ShadowStyle.OUTER_DEFAULT_SM)
124      .alignItems(VerticalAlign.Bottom)
125      .layoutWeight(1)
126    }
127  }
128}