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 16@Entry 17@Component 18struct GridRowSample9 { 19 private elements: Object[] = [ 20 { 'index': 1, 'color': $r('sys.color.ohos_id_color_palette_aux1') }, 21 { 'index': 2, 'color': $r('sys.color.ohos_id_color_palette_aux2') }, 22 { 'index': 3, 'color': $r('sys.color.ohos_id_color_palette_aux3') }, 23 { 'index': 4, 'color': $r('sys.color.ohos_id_color_palette_aux4') }, 24 { 'index': 5, 'color': $r('sys.color.ohos_id_color_palette_aux5') }, 25 { 'index': 6, 'color': $r('sys.color.ohos_id_color_palette_aux6') } 26 ] 27 28 build() { 29 GridRow() { 30 GridCol({ span: { sm: 12, md: 10, lg: 8 }, offset: { sm: 0, md: 1, lg: 2 } }) { 31 GridRow() { 32 ForEach(this.elements, (item) => { 33 GridCol({ span: { sm: 6, md: 4, lg: 3 } }) { 34 Row() { 35 Text(`${item.index}`).fontSize(24) 36 } 37 .justifyContent(FlexAlign.Center) 38 .backgroundColor(item.color) 39 .height(30) 40 } 41 }) 42 } 43 .backgroundColor('#19000000') 44 .height('100%') 45 } 46 } 47 } 48}