1/* 2 * Copyright (c) 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 router from '@system.router' 17 18import { Log } from '../../utils/Log' 19import { ThumbnailController } from './ThumbnailController' 20import getStore from '../../redux/store' 21import { Action } from '../../redux/actions/Action' 22import { EventBus } from '../../worker/eventbus/EventBus' 23import EventBusManager from '../../worker/eventbus/EventBusManager' 24 25 26let localState = (state) => { 27 return { 28 thumbnail: state.CameraInitReducer.thumbnail, 29 } 30} 31 32let localDispatcher = (dispatch) => { 33 return {} 34} 35 36@Component 37export struct ThumbnailView { 38 private TAG: string = '[ThumbnailView]:' 39 private appEventBus: EventBus = EventBusManager.getInstance().getEventBus() 40 @State thumbnailBorder: Object = {} 41 42 @State state: any = {} 43 @State thumbnail: any = $r('app.media.ic_camera_thumbnail_default_white') 44 @State hasThumbnail: boolean = false 45 @State scaleValue: number = 1 46 @State tempOpacity: number = 1 47 48 private async onThumbnailUpdate(data) { 49 Log.info(`${this.TAG} onThumbnailUpdate data: ${JSON.stringify(data)} E`) 50 this.thumbnail = (data.thumbnail == null ? $r('app.media.ic_camera_thumbnail_default_white') : data.thumbnail) 51 this.hasThumbnail = data.thumbnail != undefined 52 if (this.hasThumbnail) { 53 this.thumbnailBorder = { width: 1, color: Color.White, style: BorderStyle.Solid } 54 } else { 55 this.thumbnailBorder = { width: 0 } 56 } 57 this.scaleValue = 1.5 58 this.tempOpacity = 0.0 59 animateTo({ duration: 100, curve: Curve.Sharp }, () => { 60 this.tempOpacity = 1 61 }) 62 animateTo({ duration: 300, curve: Curve.Sharp }, () => { 63 this.scaleValue = 1 64 }) 65 Log.info(`${this.TAG} onThumbnailUpdate this.state.thumbnail: ${JSON.stringify(this.thumbnail)} X`) 66 } 67 68 private async onThumbnailLoad(data) { 69 Log.info(`${this.TAG} onThumbnailLoad data: ${JSON.stringify(data)} E`) 70 this.thumbnail = (data.thumbnail == null ? $r('app.media.ic_camera_thumbnail_default_white') : data.thumbnail) 71 this.hasThumbnail = data.thumbnail != undefined 72 if (this.hasThumbnail) { 73 this.thumbnailBorder = { width: 1, color: Color.White, style: BorderStyle.Solid } 74 } else { 75 this.thumbnailBorder = { width: 0 } 76 } 77 this.scaleValue = 1 78 this.tempOpacity = 1 79 Log.info(`${this.TAG} onThumbnailLoad this.state.thumbnail: ${JSON.stringify(this.thumbnail)} X`) 80 } 81 82 aboutToAppear() { 83 Log.info(`${this.TAG} aboutToAppear E`) 84 getStore().connect(localState, localDispatcher)(this.state) 85 this.appEventBus.on(Action.ACTION_UPDATE_THUMBNAIL, this.onThumbnailUpdate.bind(this)) 86 this.appEventBus.on(Action.ACTION_LOAD_THUMBNAIL, this.onThumbnailLoad.bind(this)) 87 Log.info(`${this.TAG} aboutToAppear X`) 88 } 89 90 aboutToDisappear(): void { 91 Log.info(`${this.TAG} aboutToDisappear E`) 92 this.appEventBus.off(Action.ACTION_UPDATE_THUMBNAIL, this.onThumbnailUpdate.bind(this)) 93 this.appEventBus.off(Action.ACTION_LOAD_THUMBNAIL, this.onThumbnailLoad.bind(this)) 94 Log.info(`${this.TAG} aboutToDisappear X`) 95 } 96 97 build() { 98 Column() { 99 Stack() { 100 Image(this.thumbnail) 101 .width('100%').aspectRatio(1).borderRadius(22).objectFit(ImageFit.Fill) 102 } 103 .width('100%').height('100%') 104 .enabled(this.hasThumbnail) 105 .onClick(async () => { 106 Log.info(`${this.TAG} launch bundle com.ohos.photos`) 107 globalThis.keepCameraZoomRatio = true 108 await globalThis.cameraAbilityContext.startAbility({ 109 parameters: { uri: 'photodetail' }, 110 bundleName: 'com.ohos.photos', 111 abilityName: 'com.ohos.photos.MainAbility' 112 }) 113 }) 114 } 115 .width(44).aspectRatio(1) 116 .borderRadius(22).border(this.thumbnailBorder) 117 .opacity(this.tempOpacity) 118 .scale({ x: this.scaleValue, y: this.scaleValue }) 119 } 120}