1/* 2 * Copyright (c) 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 */ 15 16// Countdown page 17@Component 18export struct CountdownPage { 19 @Link countdownNum: number; // Countdown value 20 private countdownListData: Array<string> = ['2', '5', '10']; // Loop rendering 21 @State countdownBol: boolean = true; 22 @State colorItem: number = 0; 23 24 build() { 25 Row() { 26 if (this.countdownBol && !this.countdownNum) { 27 Row() { 28 Button() { 29 Image($r('app.media.icon_camera_setting_timer')) 30 .width('60px').height('60px'); 31 } 32 .width('80px') 33 .height('80px') 34 .backgroundColor('rgba(255,255,255,0.20)') 35 .borderRadius('40px') 36 .onClick(() => { 37 this.countdownBol = false; 38 }) 39 } 40 } 41 if (this.countdownNum && this.countdownBol) { 42 Row() { 43 Image($r('app.media.icon_camera_setting_timer_on')).width('60px').height('60px').margin({ left: 5 }); 44 Text(this.countdownNum + '').fontSize(21).fontWeight(500).margin({ left: 5 }).fontColor(Color.White); 45 } 46 .backgroundColor('rgba(255,255,255,0.20)') 47 .borderRadius('40px') 48 .width('140px') 49 .height('80px') 50 .onClick(() => { 51 this.countdownBol = false; 52 }) 53 } 54 if (!this.countdownBol) { 55 Row() { 56 Image($r('app.media.icon_camera_setting_timer_on_balk')).width('60px').height('60px').margin({ left: 5 }); 57 ForEach(this.countdownListData, (item: string) => { 58 Text(item) 59 .fontSize(21) 60 .fontWeight(500) 61 .margin({ 62 left: 10 63 }) 64 .fontColor(this.countdownNum == this.colorItem ? $r('app.color.theme_color') : '#182431') 65 .onClick(() => { 66 this.countdownNum = this.colorItem 67 this.countdownBol = true 68 }) 69 }, (item: string) => item) 70 Text('OFF') 71 .fontSize(21) 72 .fontWeight(500) 73 .margin({ 74 left: 10 75 }) 76 .fontColor(this.countdownNum == 0 ? $r('app.color.theme_color') : '#182431') 77 .onClick(() => { 78 this.countdownNum = 0; 79 this.countdownBol = true; 80 }) 81 } 82 .backgroundColor('#FFFFFF') 83 .borderRadius('40px') 84 .width('360px') 85 .height('80px') 86 .zIndex(999) 87 } 88 } 89 .position({ x: 30, y: 352 }) 90 .id('CountdownCapture') 91 } 92}