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 Constants from '../utils/constant'; 17 18@Extend(Button) function locationButton() { 19 .backgroundColor($r('app.color.default_background_color')) 20 .fontWeight(FontWeight.Medium) 21 .fontSize(Constants.TEXT_SMALLER_FONT_SIZE) 22 .height(Constants.LOCATION_BUTTON_HEIGHT) 23 .width(Constants.LOCATION_BUTTON_WIDTH) 24 .borderRadius(Constants.LOCATION_BUTTON_RADIUS) 25 .position({ x: Constants.LOCATION_BUTTON_POSITION_X, y: Constants.LOCATION_BUTTON_POSITION_Y }) 26} 27 28@Component 29export struct LocationCanvas { 30 @Link locationFlag: number 31 32 build() { 33 Column() { 34 Image($r('app.media.img_location_map')) 35 .width(Constants.FULL_WIDTH) 36 .height(Constants.FULL_HEIGHT) 37 .scale({ x: ((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) 38 ? Constants.LOCATION_CANVAS_ZOOM_SCALE : Constants.LOCATION_CANVAS_INITIAL_SCALE, 39 y: ((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) 40 ? Constants.LOCATION_CANVAS_ZOOM_SCALE : Constants.LOCATION_CANVAS_INITIAL_SCALE }) 41 .animation({ 42 duration: Constants.LOCATION_ANIMATION_DURATION, // Animation duration 43 curve: Curve.Smooth, // The animation curve 44 playMode: PlayMode.Normal // The animation mode 45 }) 46 Image($r('app.media.ic_public_gps_filled')) 47 .fillColor($r('sys.color.ohos_id_color_emphasize')) 48 .width(Constants.LOCATION_ICON_WIDTH) 49 .height(Constants.LOCATION_ICON_HEIGHT) 50 .position({ x: Constants.LOCATION_ICON_POSITION_X, y: Constants.LOCATION_ICON_POSITION_Y }) 51 .opacity(((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) ? 1 : 0) 52 .scale({ x: ((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) ? 1 : 0.8, 53 y: ((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) ? 1 : 0.8 }) 54 .animation({ 55 duration: Constants.LOCATION_ANIMATION_DURATION / 2, // Animation duration 56 delay: this.locationFlag == Constants.LOCATION_BOTH_PRECISE ? (Constants.LOCATION_ANIMATION_DURATION / 2) : 0, 57 curve: Curve.Smooth, // The animation curve 58 playMode: PlayMode.Normal // The animation mode 59 }) 60 Circle({ width: Constants.LOCATION_CIRCLE_DIA, height: Constants.LOCATION_CIRCLE_DIA }) 61 .position({ x: Constants.LOCATION_CIRCLE_POSITION_X, y: Constants.LOCATION_CIRCLE_POSITION_Y }) 62 .fill($r('app.color.location_circle_color')) 63 .fillOpacity(Constants.LOCATION_CIRCLE_OPACITY) 64 .stroke($r('app.color.location_circle_color')) 65 .scale({ x: ((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) ? 0 : 1, 66 y: ((this.locationFlag == Constants.LOCATION_UPGRADE) || (this.locationFlag == Constants.LOCATION_BOTH_PRECISE)) ? 0 : 1 }) 67 .animation({ 68 duration: Constants.LOCATION_ANIMATION_DURATION, // Animation duration 69 curve: Curve.Smooth, // The animation curve 70 playMode: PlayMode.Normal // The animation mode 71 }) 72 if(this.locationFlag == Constants.LOCATION_BOTH_PRECISE) { 73 Button($r('app.string.precise_location_on')) 74 .locationButton() 75 .fontColor($r('app.color.button_color')) 76 .onClick(() => { this.locationFlag = Constants.LOCATION_BOTH_FUZZY }) 77 } 78 if(this.locationFlag == Constants.LOCATION_BOTH_FUZZY) { 79 Button($r('app.string.precise_location_off')) 80 .locationButton() 81 .fontColor($r('app.color.label_color_light')) 82 .onClick(() => { this.locationFlag = Constants.LOCATION_BOTH_PRECISE }) 83 } 84 }.width(Constants.FULL_WIDTH) 85 .height(Constants.LOCATION_CANVAS_HEIGHT) 86 .margin({ top: Constants.LOCATION_CANVAS_MARGIN_TOP, bottom: Constants.LOCATION_CANVAS_MARGIN_BOTTOM }) 87 .clip(true) 88 } 89} 90