1/* 2 * Copyright (c) 2022-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 commonController from '../controller/commonController'; 18 19@Preview 20@Component 21export default struct BackComponent { 22 private prevTag: string = ''; 23 private title: string | Resource = ''; 24 private tag : string = 'BackComponent'; 25 @State isTouch: boolean = false; 26 @StorageLink('CONTENT_TYPE_WIDTH') CONTENT_TYPE_WIDTH: number = 0; 27 28 aboutToAppear() { 29 this.tag = this.prevTag + 'BackComp:'; 30 } 31 32 build() { 33 Row() { 34 Image($r('app.media.back_op')) 35 .height('24vp') 36 .width('24vp') 37 .backgroundColor(this.isTouch ? $r('sys.color.ohos_id_color_click_effect') : '#00000000') 38 .onClick(() => { 39 Log.info(this.tag, 'back image onClick +') 40 commonController.routeBack() 41 Log.info(this.tag, 'back image onClick -') 42 }) 43 .margin({ 44 top: '16vp', 45 bottom: '16vp', 46 left: '24vp', 47 right: '16vp' 48 }) 49 .responseRegion({ x: '-12vp', y: '-16vp', width: '48vp', height: '56vp' }) 50 .onTouch((event?: TouchEvent) => { 51 Log.info(this.tag, 'touch event') 52 if (event !== undefined) { 53 if (event.type === TouchType.Down) { 54 this.isTouch = true; 55 } 56 if (event.type === TouchType.Up) { 57 this.isTouch = false; 58 } 59 } 60 }) 61 Text(this.title) 62 .fontColor($r('sys.color.ohos_id_color_titlebar_text')) 63 .fontSize($r('sys.float.ohos_id_text_size_headline8')) 64 .fontWeight(FontWeight.Bold) 65 .maxLines(1) 66 .textOverflow({ overflow: TextOverflow.Ellipsis }) 67 .margin({ right: '16vp' }) 68 } 69 .height('56vp') 70 .width(this.CONTENT_TYPE_WIDTH) 71 .alignItems(VerticalAlign.Center) 72 .align(Alignment.Start) 73 } 74}