• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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
16import router from '@ohos.router';
17import { TrendsData } from '../model/TrendsDataSource';
18import { makeDataLocal } from '../model/DataFactory';
19import { Trends } from '../model/BaseMsg';
20import { TrendsItem } from '../commonComponent/TrendsItem';
21import Constants from '../utils/Constants';
22
23@Component
24export struct MainView {
25  // 初始化tab下标
26  @State currentTabIndex: number = 0;
27  // 初始化断点值
28  @StorageLink('currentBreakpoint') currentBreakpoint: string = 'sm';
29
30  // 设置tabBar样式的位置、未选中图片、选中图片及文字显示的参数
31  @Builder
32  TabBuilder(text: Resource, index: number) {
33    Column() {
34      Text(text)
35        .fontSize(this.currentTabIndex === index ? $r('app.integer.layout_size_24') : $r('app.integer.layout_size_18'))
36        .fontWeight(this.currentTabIndex === index ? 700 : 500)
37        .fontColor(this.currentTabIndex === index ? Color.Black : $r('app.color.font_color_datetime'))
38    }
39    .margin({ right: 21 })
40  }
41
42  build() {
43    Column() {
44      // 标题
45      Row() {
46        Row() {
47          this.TabBuilder($r('app.string.care_title'), Constants.TAB_INDEX_0)
48          this.TabBuilder($r('app.string.recommend'), Constants.TAB_INDEX_1)
49        }
50
51        Row() {
52          Image($r('app.media.search'))
53            .width($r('app.integer.layout_size_24'))
54            .height($r('app.integer.layout_size_24'))
55        }
56      }
57      .height(56)
58      .width('100%')
59      .justifyContent(FlexAlign.SpaceBetween)
60      .padding({ right: $r('app.integer.layout_size_12'), left: $r('app.integer.layout_size_12') })
61
62
63      // 首页动态列表
64      TrensListComp()
65      Image($r('app.media.add'))
66        .width($r('app.integer.layout_size_48'))
67        .height($r('app.integer.layout_size_48'))
68        .position({
69          x: this.currentBreakpoint === 'sm' ? $r('app.integer.layout_size_354') : $r('app.integer.layout_size_364'),
70          y: '90%'
71        })
72    }
73    .width('90%')
74  }
75}
76
77@Component
78struct TrensListComp {
79  @State trendsData: TrendsData = new TrendsData();
80
81  async aboutToAppear() {
82    await makeDataLocal(this.trendsData);
83  }
84
85  build() {
86    List() {
87      LazyForEach(this.trendsData, (item: Trends, index: number) => {
88        ListItem() {
89          TrendsItem({ trendsItemData: item })
90            .onClick(() => {
91              router.pushUrl({ url: 'pages/CommentDetailPage', params: { trendsData: item, isDetailPage: false } })
92            })
93        }
94      })
95    }.width('100%')
96    .cachedCount(4)
97  }
98}