• 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 { Log } from '../../utils/Log'
17import { getStore } from '../../redux/store'
18import { Action } from '../../redux/actions/Action'
19
20let localState = (state) => {
21  return {
22    mode: state.ModeReducer.mode,
23  }
24}
25
26let localDispatcher = (dispatch) => {
27  return {
28    updateShowBigTextFlag: (flag: boolean) => {
29      dispatch(Action.updateShowBigTextFlag(flag))
30    },
31    updateUiState: (state: boolean) => {
32      dispatch(Action.uiState(state))
33    }
34//    updateBigTextOpacity: (opacity: number) => {
35//      dispatch(Action.updateBigTextOpacity(opacity))
36//    }
37  }
38}
39
40class StateStruct {
41  mode
42  updateShowBigTextFlag : Function
43  updateUiState : Function
44}
45
46@Component
47export struct BigText {
48  private TAG: string = '[BigText]:'
49  private mConnect: any
50  private modeResource = {
51    'MULTI': $r('app.string.multi_mode'),
52    'PHOTO': $r('app.string.photo_mode'),
53    'VIDEO': $r('app.string.video_mode')
54  }
55
56  @State state: StateStruct = new StateStruct()
57  @State bigTextOpacity: number = 0
58
59  public aboutToAppear() {
60    Log.info(`${this.TAG} aboutToAppear E`)
61    this.mConnect = getStore().connect(localState, localDispatcher)(this.state)
62    Log.info(`${this.TAG} aboutToAppear X`)
63  }
64
65  public aboutToDisappear(): void {
66    Log.info(`${this.TAG} aboutToDisappear E`)
67    this.mConnect?.destroy()
68    Log.info(`${this.TAG} aboutToDisappear X`)
69  }
70
71  build() {
72    Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
73      Text(this.modeResource[this.state.mode])
74        .fontSize(60)
75        .fontColor(Color.White)
76        .fontWeight(300)
77        .textAlign(TextAlign.Center)
78        .width('100%')
79        .opacity(this.bigTextOpacity)
80        .onAppear(() => {
81          animateTo({ duration: 150,
82            curve: Curve.Sharp,
83            delay: 0,
84            onFinish: () => {
85              animateTo({ duration: 150,
86                curve: Curve.Sharp,
87                delay: 1000,
88                onFinish: () => {
89                  this.state.updateShowBigTextFlag(false)
90                  this.state.updateUiState(true)
91                }
92              }, () => {
93                this.bigTextOpacity = 0
94              })
95            }
96          }, () => {
97            this.bigTextOpacity = 1
98          })
99        })
100    }
101    .width('100%')
102    .height('96vp')
103  }
104}
105