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 { TintContentInfo } from '../../../../../../../../common/src/main/ets/default/TintStateManager' 18import { PluginComponentData } from "../../../../../../../../common/src/main/ets/plugindatasource/common/Constants" 19import StyleConfigurationCommon, { CommonStyle 20} from '../../../../../../../../common/src/main/ets/default/StyleConfiguration' 21import StyleConfiguration, { PluginIconItemComponentStyle } from '../common/StyleConfiguration' 22import ViewModel from '../viewmodel/StatusBarVM' 23 24const TAG = 'PluginIconItemComponent' 25 26@Component 27export default struct PluginIconItemComponent { 28 private keyId: string 29 @State @Watch('onPluginDataChange') mPluginData: PluginComponentData = new PluginComponentData() 30 @State @Watch('onTintContentChange') mTintContentInfo: TintContentInfo = new TintContentInfo() 31 @State style: PluginIconItemComponentStyle = StyleConfiguration.getPluginIconItemComponentStyle() 32 @State @Watch('onCommonStyleChange') styleCommon: CommonStyle = StyleConfigurationCommon.getCommonStyle() 33 34 aboutToAppear() { 35 Log.showInfo(TAG, `aboutToAppear Start, keyId: ${this.keyId}`) 36 this.linkItemData() 37 this.mTintContentInfo = ViewModel.getPluginTintContentInfo(this.keyId) 38 } 39 40 aboutToDisappear() { 41 Log.showInfo(TAG, `aboutToDisappear`) 42 } 43 44 linkItemData() { 45 Log.showInfo(TAG, `linkItemData, keyId: ${this.keyId}`) 46 this.mPluginData = ViewModel.getPluginData(this.keyId) 47 } 48 49 onPluginDataChange(propName: string): void { 50 Log.showInfo(TAG, `onPluginDataChange, propName: ${propName} template: ${JSON.stringify(this.mPluginData.template)} data: ${JSON.stringify(this.mPluginData.data)}`) 51 } 52 53 onTintContentChange(propName: string): void { 54 Log.showInfo(TAG, `onTintContentChange, propName: ${propName} value: ${this.mTintContentInfo.contentColor}`) 55 this.setStyle() 56 } 57 58 onCommonStyleChange(propName: string): void { 59 Log.showInfo(TAG, `onCommonStyleChange, propName: ${propName} value: ${this.styleCommon.statusBarFontSize}`) 60 this.setStyle() 61 } 62 63 setStyle(): void{ 64 Log.showInfo(TAG, `setStyle`) 65 if (this.mPluginData.data && Object.keys(this.mPluginData.data).length > 0) { 66 this.mPluginData.data['fontSize'] = this.styleCommon.statusBarFontSize 67 this.mPluginData.data['fontColor'] = this.mTintContentInfo.contentColor 68 Log.showInfo(TAG, `setStyle, data: ${JSON.stringify(this.mPluginData.data)}`) 69 } 70 } 71 72 build() { 73 Row() { 74 if (this.mPluginData.template && this.mPluginData.data && Object.keys(this.mPluginData.data).length > 0) { 75 Row().width(this.styleCommon.statusBarMarginLeftRight).height('100%') 76 PluginComponent({ 77 template: this.mPluginData.template, 78 data: this.mPluginData.data 79 }).onComplete(() => { 80 Log.showInfo(TAG, `PluginComponent.Complete`) 81 }).onError(({errcode, msg}) => { 82 Log.showInfo(TAG, `PluginComponent.Error code:${errcode} message:${msg}`) 83 }) 84 .size({ width: px2vp(this.style.iconWidth), height: '100%' }) 85 Row().width(this.styleCommon.statusBarMarginLeftRight).height('100%') 86 } 87 }.height('100%') 88 } 89}