1/* 2 * Copyright (c) 2023 Hunan OpenValley Digital Industry Development 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 '@ohos.router'; 17 18@Entry 19@Component 20struct Index { 21 build() { 22 Row() { 23 Column() { 24 Row() { 25 Text($r('app.string.text_concern')) 26 .fontSize(24) 27 Text($r('app.string.text_translation')) 28 .fontSize(24) 29 } 30 .margin({ top: 8 }) 31 .justifyContent(FlexAlign.SpaceBetween) 32 .width('30%') 33 .height('5%') 34 35 Row() { 36 Image($r('app.media.icon')) 37 .width(30) 38 .height(30) 39 .margin({ left: 20 }) 40 .onClick(() => { 41 router.pushUrl({ 42 url: 'pages/cameraPage/CameraPage' 43 }, router.RouterMode.Single); 44 }) 45 .id('sweep') 46 Divider() 47 .height('60%') 48 .color($r('app.color.index_driver')) 49 .strokeWidth(3) 50 .vertical(true) 51 .margin({ left: 15 }) 52 Text($r('app.string.index_nike')) 53 .fontSize(20) 54 .fontWeight(FontWeight.Medium) 55 .margin({ left: 15 }) 56 Blank() 57 Image($r('app.media.icon')) 58 .width(40) 59 .height(40) 60 .margin({ right: 15, top: 5 }) 61 Button($r('app.string.index_search')) 62 .fontSize(24) 63 .width(100) 64 .height('90%') 65 .backgroundColor($r('app.color.index_search')) 66 .margin({ right: 2 }) 67 } 68 .margin({ top: 5, bottom: 10 }) 69 .width('95%') 70 .height('7%') 71 .backgroundColor(Color.White) 72 .borderRadius(24) 73 74 Scroll() { 75 Column() { 76 Row() { 77 Image($r('app.media.icon')) 78 .height(200) 79 .width('40%') 80 81 Image($r('app.media.icon')) 82 .height(200) 83 .width('40%') 84 } 85 .width('100%') 86 .justifyContent(FlexAlign.SpaceAround) 87 88 Row() { 89 Image($r('app.media.icon')) 90 .height(200) 91 .width('40%') 92 93 Image($r('app.media.icon')) 94 .height(200) 95 .width('40%') 96 } 97 .margin({ top: 12 }) 98 .width('100%') 99 .justifyContent(FlexAlign.SpaceAround) 100 101 Row() { 102 Image($r('app.media.icon')) 103 .height(200) 104 .width('40%') 105 106 Image($r('app.media.icon')) 107 .height(200) 108 .width('40%') 109 } 110 .margin({ top: 12 }) 111 .width('100%') 112 .justifyContent(FlexAlign.SpaceAround) 113 114 Row() { 115 Image($r('app.media.icon')) 116 .height(200) 117 .width('40%') 118 119 Image($r('app.media.icon')) 120 .height(200) 121 .width('40%') 122 } 123 .margin({ top: 12 }) 124 .width('100%') 125 .justifyContent(FlexAlign.SpaceAround) 126 127 Row() { 128 Image($r('app.media.icon')) 129 .height(200) 130 .width('40%') 131 132 Image($r('app.media.icon')) 133 .height(200) 134 .width('40%') 135 } 136 .margin({ top: 12 }) 137 .width('100%') 138 .justifyContent(FlexAlign.SpaceAround) 139 140 Row() { 141 Image($r('app.media.icon')) 142 .height(200) 143 .width('40%') 144 145 Image($r('app.media.icon')) 146 .height(200) 147 .width('40%') 148 } 149 .margin({ top: 12 }) 150 .width('100%') 151 .justifyContent(FlexAlign.SpaceAround) 152 153 Row() { 154 Image($r('app.media.icon')) 155 .height(200) 156 .width('40%') 157 158 Image($r('app.media.icon')) 159 .height(200) 160 .width('40%') 161 } 162 .margin({ top: 12 }) 163 .width('100%') 164 .justifyContent(FlexAlign.SpaceAround) 165 } 166 } 167 .width('100%') 168 .height('100%') 169 .padding(8) 170 .margin({ left: 12, right: 12, top: 4, bottom: 180 }) 171 .backgroundColor(Color.White) 172 .borderRadius(8) 173 174 Column() { 175 Row() { 176 Image($r('app.media.icon')) 177 .height(38) 178 .width(38) 179 Image($r('app.media.icon')) 180 .height(38) 181 .width(38) 182 Image($r('app.media.icon')) 183 .height(38) 184 .width(38) 185 Image($r('app.media.icon')) 186 .height(38) 187 .width(38) 188 Image($r('app.media.icon')) 189 .height(38) 190 .width(38) 191 } 192 .margin({ top: 12 }) 193 .width('100%') 194 .justifyContent(FlexAlign.SpaceAround) 195 196 Row() { 197 Text($r('app.string.index_index_text')) 198 Text($r('app.string.index_video')) 199 Text($r('app.string.index_message')) 200 Text($r('app.string.index_shopping')) 201 Text($r('app.string.index_me')) 202 } 203 .margin({ top: 8, bottom: 8 }) 204 .width('100%') 205 .justifyContent(FlexAlign.SpaceAround) 206 } 207 .position({ y: '90%' }) 208 .backgroundColor(Color.White) 209 } 210 .backgroundColor($r('app.color.index_bg')) 211 .height('100%') 212 .width('100%') 213 } 214 .height('100%') 215 } 216}