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 GridRowSample6 { 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 ForEach(this.elements, (item) => { 31 GridCol({ span: { sm: 6, md: 4, lg: 3 }, offset: { sm: 0, md: 2, lg: 1 } }) { 32 Row() { 33 Text(`${item.index}`).fontSize(24) 34 } 35 .justifyContent(FlexAlign.Center) 36 .backgroundColor(item.color) 37 .height(30) 38 } 39 }) 40 } 41 } 42}