• 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 ConfigData from '../Utils/ConfigData';
16
17/**
18 * Sub-Page Entry Component
19 */
20@Component
21export struct TitleComponent {
22  private title:string | Resource;
23  private fontSize:string = '20vp';
24  private stateChangeFlag: boolean = false;
25  private pinRequiredFlag: boolean = false;
26  private bondStateChangeFlag: boolean = false;
27  @State bgColor: string | Resource = '';
28  @State isTouched:boolean = false;
29  @StorageLink('on_stateChange') state: string = 'on:stateChange';
30  @StorageLink('on_pinRequired') pin: string = 'on:pinRequired';
31  @StorageLink('on_bondStateChange') bondState: string = 'on:bondStateChange';
32
33  build() {
34    Column(){
35      Flex({ justifyContent: FlexAlign.SpaceBetween, alignItems:ItemAlign.Center }) {
36        Text(this.stateChangeFlag ? this.state : (this.pinRequiredFlag ? this.pin : (this.bondStateChangeFlag ? this.bondState : this.title)))
37          .textAlign(TextAlign.Center)
38          .width("100%")
39          .fontSize(this.fontSize)
40          .fontColor($r('app.color.font_color_182431'))
41          .fontWeight(FontWeight.Medium)
42      }
43      .height(ConfigData.WH_100_100)
44      .width(ConfigData.WH_100_100)
45      .backgroundColor(this.bgColor)
46      .linearGradient(this.isTouched ? {
47         angle: 90,
48         direction: GradientDirection.Right,
49         colors: [[$r("app.color.DCEAF9"), 0.0], [$r("app.color.FAFAFA"), 1.0]]
50      } : {
51         angle: 90,
52         direction: GradientDirection.Right,
53         colors: [[$r("sys.color.ohos_id_color_foreground_contrary"), 1], [$r("sys.color.ohos_id_color_foreground_contrary"), 1]]})
54      .onTouch((event: TouchEvent) => {
55        if (event.type === TouchType.Down) {
56          this.isTouched = true;
57        }
58        if (event.type === TouchType.Up) {
59          this.isTouched = false;
60        }
61      })
62    }
63    .padding($r('app.float.distance_4'))
64    .height("40vp")
65    .backgroundColor($r("sys.color.ohos_id_color_foreground_contrary"));
66  }
67}