1/* 2 * Copyright (c) 2023-2024 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 16const LayeredDrawableDescriptor = requireNapi('arkui.drawableDescriptor').LayeredDrawableDescriptor; 17const TITLE_ICON_SIZE = '20vp'; 18const TITLE_PADDING_START = '20vp'; 19const TITLE_ELEMENT_MARGIN_HORIZONTAL = '12vp'; 20const TITLE_TEXT_FONT_SIZE = '16fp'; 21const TITLE_TEXT_FONT_WEIGHT = '500px'; 22const TITLE_ROW_HEIGHT = '37vp' 23export class Index extends ViewPU { 24 constructor(parent, params, __localStorage, elmtId = -1) { 25 super(parent, __localStorage, elmtId); 26 this.__appLabel = new ObservedPropertySimplePU('', this, 'appLabel'); 27 this.__appTitle = new ObservedPropertySimplePU('', this, 'appTitle'); 28 this.__textColor = new ObservedPropertySimplePU(0x66000000, this, 'textColor'); 29 this.__pixelMap = new ObservedPropertyObjectPU(undefined, this, 'pixelMap'); 30 this.__iconOpacity = new ObservedPropertySimplePU(0.4, this, 'iconOpacity'); 31 this.setInitiallyProvidedValue(params); 32 } 33 setInitiallyProvidedValue(params) { 34 if (params.textColor !== undefined) { 35 this.textColor = params.textColor; 36 } 37 if (params.appLabel !== undefined) { 38 this.appLabel = params.appLabel; 39 } 40 if (params.appTitle !== undefined) { 41 this.appTitle = params.appTitle; 42 } 43 if (params.pixelMap !== undefined) { 44 this.pixelMap = params.pixelMap; 45 } 46 if (params.iconOpacity !== undefined) { 47 this.iconOpacity = params.iconOpacity; 48 } 49 } 50 updateStateVars(params) { 51 } 52 purgeVariableDependenciesOnElmtId(rmElmtId) { 53 this.__textColor.purgeDependencyOnElmtId(rmElmtId); 54 this.__appLabel.purgeDependencyOnElmtId(rmElmtId); 55 this.__appTitle.purgeDependencyOnElmtId(rmElmtId); 56 this.__pixelMap.purgeDependencyOnElmtId(rmElmtId); 57 this.__iconOpacity.purgeDependencyOnElmtId(rmElmtId); 58 } 59 aboutToBeDeleted() { 60 this.__textColor.aboutToBeDeleted(); 61 this.__appLabel.aboutToBeDeleted(); 62 this.__appTitle.aboutToBeDeleted(); 63 this.__pixelMap.aboutToBeDeleted(); 64 this.__iconOpacity.aboutToBeDeleted(); 65 SubscriberManager.Get().delete(this.id__()); 66 this.aboutToBeDeletedInternal(); 67 } 68 get textColor() { 69 return this.__textColor.get(); 70 } 71 set textColor(newValue) { 72 this.__textColor.set(newValue); 73 } 74 get appLabel() { 75 return this.__appLabel.get(); 76 } 77 set appLabel(newValue) { 78 this.__appLabel.set(newValue); 79 } 80 get appTitle() { 81 return this.__appTitle.get(); 82 } 83 set appTitle(newValue) { 84 this.__appTitle.set(newValue); 85 } 86 get pixelMap() { 87 return this.__pixelMap.get(); 88 } 89 set pixelMap(newValue) { 90 this.__pixelMap.set(newValue); 91 } 92 get iconOpacity() { 93 return this.__iconOpacity.get(); 94 } 95 set iconOpacity(newValue) { 96 this.__iconOpacity.set(newValue); 97 } 98 onWindowFocused() { 99 this.textColor = { "id": 125829186, "type": 10001, params: [], "bundleName": "", "moduleName": "" }; 100 this.iconOpacity = 1; 101 } 102 onWindowUnfocused() { 103 this.textColor = { "id": 125829186, "type": 10001, params: [], "bundleName": "", "moduleName": "" }; 104 this.iconOpacity = 0.4; 105 } 106 setAppTitle(content) { 107 this.appTitle = content; 108 } 109 setAppIcon(pixelMap) { 110 this.pixelMap = pixelMap; 111 } 112 initialRender() { 113 this.observeComponentCreation((elmtId, isInitialRender) => { 114 ViewStackProcessor.StartGetAccessRecordingFor(elmtId); 115 Row.create(); 116 Row.width('100%'); 117 Row.height(TITLE_ROW_HEIGHT); 118 Row.justifyContent(FlexAlign.Start); 119 Row.alignItems(VerticalAlign.Center); 120 Row.padding({ top: 6, bottom: 6, left: 8, right: 8 }); 121 Row.clip(true); 122 if (!isInitialRender) { 123 Row.pop(); 124 } 125 ViewStackProcessor.StopGetAccessRecording(); 126 }); 127 this.observeComponentCreation((elmtId, isInitialRender) => { 128 ViewStackProcessor.StartGetAccessRecordingFor(elmtId); 129 Image.create(this.pixelMap); 130 Image.id('enhanceAppIcon'); 131 Image.height(TITLE_ICON_SIZE); 132 Image.width(TITLE_ICON_SIZE); 133 Image.interpolation(ImageInterpolation.Medium); 134 Image.focusable(false); 135 Image.margin({ left: TITLE_ELEMENT_MARGIN_HORIZONTAL, right: TITLE_ELEMENT_MARGIN_HORIZONTAL }); 136 Image.opacity(this.iconOpacity); 137 Image.draggable(false); 138 if (!isInitialRender) { 139 Image.pop(); 140 } 141 ViewStackProcessor.StopGetAccessRecording(); 142 }); 143 this.observeComponentCreation((elmtId, isInitialRender) => { 144 ViewStackProcessor.StartGetAccessRecordingFor(elmtId); 145 Text.create(this.appTitle ? this.appTitle : this.appLabel); 146 Image.id('enhanceAppLabel'); 147 Text.maxLines(1); 148 Text.fontSize(TITLE_TEXT_FONT_SIZE); 149 Text.fontColor(this.textColor); 150 Text.fontWeight(TITLE_TEXT_FONT_WEIGHT); 151 Text.textOverflow({ overflow: TextOverflow.Ellipsis }); 152 Text.textAlign(TextAlign.Start); 153 Text.layoutWeight(1.0); 154 Text.opacity(this.iconOpacity); 155 Text.minFontScale(0.85); 156 Text.maxFontScale(1.45); 157 if (!isInitialRender) { 158 Text.pop(); 159 } 160 ViewStackProcessor.StopGetAccessRecording(); 161 }); 162 Text.pop(); 163 Row.pop(); 164 } 165 rerender() { 166 this.updateDirtyElements(); 167 } 168} 169ViewStackProcessor.StartGetAccessRecordingFor(ViewStackProcessor.AllocateNewElmetIdForNextComponent()); 170loadCustomTitleBar(new Index(undefined, {})); 171ViewStackProcessor.StopGetAccessRecording();