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 '../default/Log'; 17import StyleConfiguration, { IconTitleBaseStyle } from './common/StyleConfiguration' 18import iconComponent from './iconComponent' 19 20const TAG = 'iconTitleBase' 21 22@Component 23export default struct iconBaseComponent { 24 private iconOn: any 25 private iconOff: any 26 @State iconOffStr: string = "" 27 @State iconOnStr: string = "" 28 @Link mTitle: Resource 29 @State mTitleStr: string = "" 30 private useIconStr = false 31 private useTitleStr = false 32 private mClickEvent: Function 33 private mLongClickEvent: Function 34 @State mTextIsHover: boolean = false 35 @Link changeSwitch: boolean 36 @State style: IconTitleBaseStyle = StyleConfiguration.getIconTitleBaseStyle() 37 38 aboutToAppear() { 39 Log.showInfo(TAG, 'aboutToAppear') 40 } 41 42 aboutToDisappear() { 43 Log.showInfo(TAG, 'aboutToDisappear') 44 } 45 46 build() { 47 Row() { 48 Row() { 49 iconComponent({ 50 useIconStr: this.useIconStr, 51 iconOff: this.iconOff, 52 iconOn: this.iconOn, 53 iconOffStr: this.iconOffStr, 54 iconOnStr: this.iconOnStr, 55 changeSwitch: $changeSwitch, 56 }) 57 } 58 .height('100%') 59 .margin({left: this.style.marginLeft, right: this.style.componentGap}) 60 .onClick(() => { 61 Log.showDebug(TAG, `start clickEvent ${this.changeSwitch}`); 62 if (this.mClickEvent) { 63 this.mClickEvent() 64 } 65 Log.showDebug(TAG, `end clickEvent ${this.changeSwitch}`); 66 }) 67 68 Row() { 69 Text(this.useTitleStr ? this.mTitleStr : this.mTitle) 70 .fontSize(this.style.titleSize) 71 .fontColor(this.style.titleColor) 72 .textOverflow({ overflow: TextOverflow.Ellipsis }) 73 .maxLines(2) 74 .margin({left: this.style.textMargin, right: this.style.textMargin}) 75 .onHover((isHover) => { 76 this.mTextIsHover = isHover; 77 }) 78 } 79 .width(this.style.textHoverWidth) 80 .height(this.style.textHoverHeight) 81 .margin({right: this.style.marginRight}) 82 .backgroundColor(this.mTextIsHover ? this.style.hoverColor : this.style.transparentColor) 83 .borderRadius(this.style.textHoverRadius) 84 .clip(true) 85 } 86 .borderRadius(this.style.borderRadius) 87 .clip(true) 88 .backgroundColor(this.style.backgroundColor) 89 .height('100%') 90 .width('100%') 91 } 92}