• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2022 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 */
15import prompt from '@ohos.promptAction';
16
17@Entry
18@Component
19struct Index {
20  @State appName: string = 'Unknown'
21  @State deviceType: string = 'Unknown'
22  @State progressAngle: number = 0
23
24  async aboutToAppear() {
25    this.appName = globalThis.dialogInfo.appName
26    this.deviceType = globalThis.dialogInfo.deviceType
27    this.playRingAnimation()
28  }
29
30  playRingAnimation() {
31    let action = () => {
32      let keyframeAngle = this.progressAngle + 15
33      this.progressAngle = keyframeAngle > 360 ? keyframeAngle - 360 : keyframeAngle
34      this.playRingAnimation()
35    }
36    setTimeout(action, 500)
37  }
38
39  build() {
40    Row() {
41      Column() {
42        Row() {
43          Progress({
44            value: 50,
45            total: 100,
46            type: ProgressType.Ring
47          }).height(24)
48            .width(24)
49            .margin({
50              top: 16,
51              bottom: 16,
52              left: 16
53            })
54            .style({
55              strokeWidth: 2.67,
56            })
57            .linearGradient({ colors: ['#ff86c1ff', '#ff254FF7'] })
58            .rotate({ angle: this.progressAngle })
59            .animation({
60              duration: 500,
61              curve: Curve.Linear,
62              playMode: PlayMode.Normal,
63            })
64
65          Column() {
66            Text() {
67              Span($r('app.string.title')).fontSize(12).fontWeight(FontWeight.Bold)
68              Span(' ' + this.appName).fontSize(12).fontWeight(FontWeight.Bold)
69            }
70            .height(16)
71
72            Text() {
73              Span($r('app.string.from')).fontSize(10)
74              Span(' "' + this.deviceType + '"').fontSize(10)
75            }
76            .height(16)
77            .margin({ top: 2 })
78            .opacity(0.6)
79          }.padding({
80            top: 12,
81            left: 8,
82            bottom: 12
83          })
84
85          Column() {
86            Image($r('app.media.btn_cancel'))
87              .width(18)
88              .height(18)
89              .objectFit(ImageFit.Fill)
90              .margin({
91                top: 19,
92                bottom: 19,
93                right: 19,
94                left: 8
95              })
96          }.onClick(() => {
97            prompt.showToast({
98              message: $r('app.string.cancel'),
99              duration: 1000
100            });
101            setTimeout(() => {
102              globalThis.extensionWin.destroy()
103              globalThis.context.terminateSelf()
104            }, 1000)
105          })
106        }
107        .height(56)
108        .backgroundColor('#ffffff')
109        .shadow({
110          radius: 33,
111          color: '#4d000000',
112        })
113        .borderRadius(33)
114      }
115      .alignItems(HorizontalAlign.Center)
116      .justifyContent(FlexAlign.Center)
117      .padding({ top: 10 })
118    }
119    .alignItems(VerticalAlign.Top)
120    .justifyContent(FlexAlign.Center)
121    .height(74)
122    .width('100%')
123  }
124}