1/* 2 * Copyright (c) 2021-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 */ 15 16import Log from '../../../../../../../../common/src/main/ets/default/Log'; 17import EventManager from "../../../../../../../../common/src/main/ets/default/event/EventManager"; 18import { obtainStartAbility } from "../../../../../../../../common/src/main/ets/default/event/EventUtil"; 19import Constants from '../common/Constants'; 20import StyleConfiguration, { ControlCenterUpTitleStyle } from '../common/StyleConfiguration'; 21 22const TAG = 'Control-UpTitle'; 23 24@Component 25export default struct UpTitle { 26 private touchMoveCallback: Function; 27 private simpleToggleLayoutEditStartCallback: Function; 28 startX: number = 0; 29 startY: number = 0; 30 @State moveX: number = 0; 31 @State moveY: number = 0; 32 @State mSettingIsHover: boolean = false; 33 @State mEditIsHover: boolean = false; 34 @State style: ControlCenterUpTitleStyle = StyleConfiguration.getControlCenterUpTitleStyle(); 35 36 aboutToAppear() { 37 Log.showInfo(TAG, 'aboutToAppear'); 38 } 39 40 aboutToDisappear() { 41 Log.showInfo(TAG, 'aboutToDisappear'); 42 } 43 44 build() { 45 Row() { 46 Text($r('app.string.control_center')) 47 .height('100%') 48 .margin({left: this.style.marginLeft}) 49 .fontColor(this.style.fontColor) 50 .fontSize(this.style.fontSize) 51 .fontWeight(FontWeight.Medium) 52 53 Blank().height('100%') 54 55 Stack() { 56 Flex() 57 .backgroundColor(this.mSettingIsHover ? this.style.imageHoverColor : this.style.imageTransparentColor) 58 .clip(new Rect({ 59 width: this.style.imageHoverWidth, 60 height: this.style.imageHoverHeight 61 }).radius(this.style.imageHoverRadius)) 62 .width(this.style.imageHoverWidth) 63 .height(this.style.imageHoverHeight) 64 Image($r('app.media.ic_public_settings')) 65 .objectFit(ImageFit.Contain) 66 .size({ width: this.style.imageWidth, 67 height: this.style.imageHeight }) 68 .fillColor(this.style.titleImageColor) 69 .onClick(this.settingClick.bind(this)) 70 .onHover((isHover) => { 71 this.mSettingIsHover = isHover; 72 }) 73 } 74 .width(this.style.imageHoverWidth) 75 .height(this.style.imageHoverHeight) 76 77 Stack() { 78 Flex() 79 .backgroundColor(this.mEditIsHover ? this.style.imageHoverColor : this.style.imageTransparentColor) 80 .clip(new Rect({ 81 width: this.style.imageHoverWidth, 82 height: this.style.imageHoverHeight 83 }).radius(this.style.imageHoverRadius)) 84 .width(this.style.imageHoverWidth) 85 .height(this.style.imageHoverHeight) 86 Image($r('app.media.ic_public_edit')) 87 .objectFit(ImageFit.Contain) 88 .size({ width: this.style.imageWidth, 89 height: this.style.imageHeight }) 90 .fillColor(this.style.titleImageColor) 91 .onClick(this.editClick.bind(this)) 92 .onHover((isHover) => { 93 this.mEditIsHover = isHover; 94 }) 95 } 96 .width(this.style.imageHoverWidth) 97 .height(this.style.imageHoverHeight) 98 .margin({left: this.style.upTitleSpace, right: this.style.marginRight}) 99 } 100 .width('100%') 101 .height('100%') 102 .alignItems(VerticalAlign.Center) 103 .onTouch(this.touchEvent.bind(this)) 104 } 105 106 settingClick() { 107 Log.showDebug(TAG, `settingClick`); 108 EventManager.publish(obtainStartAbility('com.ohos.settings', 'com.ohos.settings.MainAbility')); 109 } 110 111 editClick() { 112 Log.showDebug(TAG, `editClick`); 113 if (this.simpleToggleLayoutEditStartCallback) { 114 this.simpleToggleLayoutEditStartCallback(); 115 }; 116 } 117 118 touchEvent(event: TouchEvent) { 119 if (event.type == Constants.TOUCHTYPE_DOWN) { 120 this.startX = event.touches[0].screenX; 121 this.startY = event.touches[0].screenY; 122 Log.showDebug(TAG, `quicklySetting touchStart2=======startX: ${this.startX}, startY: ${this.startY}`); 123 } else if (event.type == Constants.TOUCHTYPE_MOVE) { 124 this.moveX = event.touches[0].screenX - this.startX; 125 this.moveY = event.touches[0].screenY - this.startY; 126 } else if (event.type == Constants.TOUCHTYPE_UP) { 127 Log.showDebug(TAG, `quicklySetting touchEnd2, moveX: ${this.moveX}, moveY: ${this.moveY}`); 128 if (this.moveX < -30) { 129 if (this.touchMoveCallback) { 130 this.touchMoveCallback({ 'direction': 'left' }); 131 }; 132 } else if (this.moveX > 30) { 133 if (this.touchMoveCallback) { 134 this.touchMoveCallback({ 'direction': 'right' }); 135 }; 136 }; 137 }; 138 } 139}