1/* 2 * Copyright (c) 2022-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 16import router from '@ohos.router'; 17import { FIND_SEARCH_TEXT_DATA } from '../../mock/ProductsData'; 18import { SearchTextModel } from '../../model/GoodsModel'; 19 20@Component 21export struct TitleBarComponent { 22 @Consume('pageStack') pageStack: NavPathStack; 23 24 build() { 25 Column() { 26 Flex({ 27 justifyContent: FlexAlign.SpaceAround, 28 alignItems: ItemAlign.Center, 29 wrap: FlexWrap.Wrap 30 }) { 31 Row() { 32 Image($r('app.media.logo')) 33 .width(24) 34 .aspectRatio(1) 35 .objectFit(ImageFit.Contain) 36 Image($r('app.media.scan_code')) 37 .width(24) 38 .aspectRatio(1) 39 .objectFit(ImageFit.Contain) 40 .onClick(() => { 41 this.pageStack.pushPath({ name: 'QRCodeScanPage' }) 42 }) 43 } 44 .width('100%') 45 .justifyContent(FlexAlign.SpaceBetween) 46 47 Row() { 48 Image($r('app.media.search')) 49 .objectFit(ImageFit.Contain) 50 .width(20) 51 .aspectRatio(1) 52 Swiper() { 53 ForEach(FIND_SEARCH_TEXT_DATA, (item: SearchTextModel) => { 54 Column() { 55 Text(item.searchText) 56 .opacity(0.6) 57 .fontColor($r('app.color.blank')) 58 .fontSize(14) 59 .fontFamily('HarmonyHeiTi') 60 } 61 .width('100%') 62 .alignItems(HorizontalAlign.Start) 63 }, (item: SearchTextModel) => item.id.toString()) 64 } 65 .loop(true) 66 .autoPlay(true) 67 .vertical(true) 68 .indicator(false) 69 .interval(2000) 70 .margin(12) 71 } 72 .zIndex(2) 73 .width('100%') 74 .justifyContent(FlexAlign.Start) 75 .margin({ 76 top: 8, 77 bottom: 12 78 }) 79 .padding({ 80 left: 12, 81 right: 12 82 }) 83 .backgroundColor($r('app.color.white')) 84 .border({ 85 width: 2, 86 color: $r('app.color.white'), 87 radius: 40 88 }) 89 } 90 .margin({ 91 top: 12 92 }) 93 .padding({ 94 left: 12, 95 right: 12 96 }) 97 } 98 .width('100%') 99 } 100}