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 */ 15import { Constants as PhotoConstants } from '../model/browser/photo/Constants'; 16import Curves from '@ohos.curves'; 17import { Log } from '../utils/Log'; 18 19const TAG: string = 'browser_PhotoBrowserComponentBg'; 20 21@Component 22export struct PhotoBrowserComponentBg { 23 @Consume @Watch('onChangeBgColor') onlyChangeBgColor: boolean; 24 @Consume backgroundColorResource: Resource; 25 @Link @Watch('onShowChanged') isShowBar: boolean; 26 @State opacityValue: number = 1; 27 @State isBlackBgVisibility: boolean = false; 28 @State blackBgColorResource: Resource = this.backgroundColorResource; 29 private isFromPhotoBrowser = false; 30 31 onShowChanged(): void { 32 if (!this.isShowBar) { 33 this.isBlackBgVisibility = true; 34 } 35 if (this.blackBgColorResource.id != $r('app.color.black').id) { 36 this.blackBgColorResource = this.backgroundColorResource; 37 } 38 animateTo({ 39 duration: PhotoConstants.IMMERSE_ANIM_DURATION, 40 delay: this.isShowBar ? 0 : PhotoConstants.IMMERSE_ANIM_DELAY, 41 curve: this.isShowBar ? Curves.cubicBezier(0.2, 0.0, 0.2, 1.0) : Curves.cubicBezier(0.6, 0.0, 0.6, 1.0), 42 onFinish: () => { 43 if (this.isShowBar) { 44 this.isBlackBgVisibility = false; 45 } 46 this.blackBgColorResource = this.backgroundColorResource; 47 } 48 }, () => { 49 if (this.isShowBar) { 50 this.opacityValue = 1; 51 } else { 52 this.opacityValue = 0; 53 } 54 }) 55 } 56 57 onChangeBgColor(): void { 58 this.blackBgColorResource = this.backgroundColorResource; 59 } 60 61 build() { 62 Stack() { 63 if (this.isFromPhotoBrowser) { 64 if (this.isBlackBgVisibility) { 65 Column() { 66 } 67 .key('PhotoBrowserBg') 68 .backgroundColor(this.blackBgColorResource) 69 .width('100%') 70 .height('100%') 71 } 72 73 Column() { 74 } 75 .key('PhotoBrowserBg') 76 .backgroundColor($r('app.color.default_background_color')) 77 .width('100%') 78 .height('100%') 79 .opacity(this.opacityValue) 80 } else { 81 Column() { 82 } 83 .key('PhotoBrowserBg') 84 .backgroundColor(this.backgroundColorResource) 85 .width('100%') 86 .height('100%') 87 .animation({ 88 duration: PhotoConstants.IMMERSE_ANIM_DURATION 89 }) 90 } 91 92 } 93 .width('100%') 94 .height('100%') 95 } 96}