yangchenggong1_wd
@@ -4,8 +4,8 @@ @@ -4,8 +4,8 @@
4 */ 4 */
5 export const enum BottomNavi { 5 export const enum BottomNavi {
6 NEWS = 0, 6 NEWS = 0,
7 - PEOPLE,  
8 - VIDEO,  
9 - SERVICE,  
10 - MINE, 7 + PEOPLE=1,
  8 + VIDEO=2,
  9 + SERVICE=3,
  10 + MINE=4,
11 } 11 }
@@ -16,7 +16,7 @@ export struct BottomNavigationComponent { @@ -16,7 +16,7 @@ export struct BottomNavigationComponent {
16 // 底导/顶导全部数据 16 // 底导/顶导全部数据
17 @State @Watch('onBottomNavigationDataUpdated') bottomNavList: BottomNavDTO[] = [] 17 @State @Watch('onBottomNavigationDataUpdated') bottomNavList: BottomNavDTO[] = []
18 // 底导当前选中/焦点下标 18 // 底导当前选中/焦点下标
19 - @Provide currentNavIndex: number = BottomNavi.NEWS; 19 + @State currentNavIndex: number = BottomNavi.NEWS;
20 // 底导TabsController 20 // 底导TabsController
21 private navController: TabsController = new TabsController(); 21 private navController: TabsController = new TabsController();
22 readonly ASPECT_RATIO_1_1: number = 1 / 1; // 底导图片宽高比 22 readonly ASPECT_RATIO_1_1: number = 1 / 1; // 底导图片宽高比
@@ -51,7 +51,7 @@ export struct BottomNavigationComponent { @@ -51,7 +51,7 @@ export struct BottomNavigationComponent {
51 // 我的页面组件数据列表 51 // 我的页面组件数据列表
52 MinePageComponent() 52 MinePageComponent()
53 } else { 53 } else {
54 - TopNavigationComponent({ topNavList: navItem.topNavChannelList }) 54 + TopNavigationComponent({ topNavList: navItem.topNavChannelList, _currentNavIndex: this.currentNavIndex })
55 } 55 }
56 } 56 }
57 } 57 }
@@ -85,6 +85,7 @@ export struct BottomNavigationComponent { @@ -85,6 +85,7 @@ export struct BottomNavigationComponent {
85 } 85 }
86 .height($r('app.float.bottom_navigation_barHeight')) 86 .height($r('app.float.bottom_navigation_barHeight'))
87 .hoverEffect(HoverEffect.Highlight) 87 .hoverEffect(HoverEffect.Highlight)
  88 +
88 // .justifyContent(FlexAlign.Center) 89 // .justifyContent(FlexAlign.Center)
89 // .onClick(() => { 90 // .onClick(() => {
90 // Logger.info(TAG, `onClick, index: ${index}`); 91 // Logger.info(TAG, `onClick, index: ${index}`);
@@ -10,6 +10,7 @@ const TAG = 'TopNavigationComponent'; @@ -10,6 +10,7 @@ const TAG = 'TopNavigationComponent';
10 */ 10 */
11 @Component 11 @Component
12 export struct TopNavigationComponent { 12 export struct TopNavigationComponent {
  13 + @Prop _currentNavIndex?: number;
13 // 顶导当前选中/焦点下标 14 // 顶导当前选中/焦点下标
14 @State currentTopNavSelectedIndex: number = 0; 15 @State currentTopNavSelectedIndex: number = 0;
15 // 顶导数据 16 // 顶导数据
@@ -19,15 +20,15 @@ export struct TopNavigationComponent { @@ -19,15 +20,15 @@ export struct TopNavigationComponent {
19 20
20 build() { 21 build() {
21 Column() { 22 Column() {
22 - RelativeContainer(){  
23 - Stack({ alignContent: Alignment.Center }){ 23 + RelativeContainer() {
  24 + Stack({ alignContent: Alignment.Center }) {
24 25
25 Image($r('app.media.background_search')) 26 Image($r('app.media.background_search'))
26 .width('100%') 27 .width('100%')
27 .height('100%') 28 .height('100%')
28 .objectFit(ImageFit.Contain) 29 .objectFit(ImageFit.Contain)
29 30
30 - Row(){ 31 + Row() {
31 Image($r('app.media.icon_search')) 32 Image($r('app.media.icon_search'))
32 .width(18) 33 .width(18)
33 .height(18) 34 .height(18)
@@ -62,12 +63,12 @@ export struct TopNavigationComponent { @@ -62,12 +63,12 @@ export struct TopNavigationComponent {
62 .alignRules({ middle: { anchor: "__container__", align: HorizontalAlign.Center }, 63 .alignRules({ middle: { anchor: "__container__", align: HorizontalAlign.Center },
63 center: { anchor: "__container__", align: VerticalAlign.Center } }) 64 center: { anchor: "__container__", align: VerticalAlign.Center } })
64 65
65 - Stack({ alignContent: Alignment.Center }){ 66 + Stack({ alignContent: Alignment.Center }) {
66 Image($r('app.media.background_read_paper_home')) 67 Image($r('app.media.background_read_paper_home'))
67 .width('100%') 68 .width('100%')
68 .height('100%') 69 .height('100%')
69 .objectFit(ImageFit.Contain) 70 .objectFit(ImageFit.Contain)
70 - Row(){ 71 + Row() {
71 Image($r('app.media.icon_read_paper_home')) 72 Image($r('app.media.icon_read_paper_home'))
72 .width(18) 73 .width(18)
73 .height(18) 74 .height(18)
@@ -84,7 +85,7 @@ export struct TopNavigationComponent { @@ -84,7 +85,7 @@ export struct TopNavigationComponent {
84 .id('read') 85 .id('read')
85 .alignRules({ right: { anchor: "__container__", align: HorizontalAlign.End }, 86 .alignRules({ right: { anchor: "__container__", align: HorizontalAlign.End },
86 center: { anchor: "__container__", align: VerticalAlign.Center } }) 87 center: { anchor: "__container__", align: VerticalAlign.Center } })
87 - .onClick((event: ClickEvent)=>{ 88 + .onClick((event: ClickEvent) => {
88 89
89 let taskAction: Action = { 90 let taskAction: Action = {
90 type: 'JUMP_INNER_NEW_PAGE', 91 type: 'JUMP_INNER_NEW_PAGE',
@@ -97,6 +98,7 @@ export struct TopNavigationComponent { @@ -97,6 +98,7 @@ export struct TopNavigationComponent {
97 } 98 }
98 .width('100%') 99 .width('100%')
99 .height(40) 100 .height(40)
  101 + .visibility(this._currentNavIndex != 2 ? Visibility.Visible : Visibility.None)
100 102
101 Tabs() { 103 Tabs() {
102 ForEach(this.topNavList, (navItem: TopNavDTO, index: number) => { 104 ForEach(this.topNavList, (navItem: TopNavDTO, index: number) => {
@@ -132,7 +134,7 @@ export struct TopNavigationComponent { @@ -132,7 +134,7 @@ export struct TopNavigationComponent {
132 .maxLines(this.MAX_LINE) 134 .maxLines(this.MAX_LINE)
133 Divider() 135 Divider()
134 .width(16) 136 .width(16)
135 - .strokeWidth(2) // 分割线粗细度。 137 + .strokeWidth(2)// 分割线粗细度。
136 .padding({ top: 2 }) 138 .padding({ top: 2 })
137 .color(Color.Red) 139 .color(Color.Red)
138 .opacity(this.currentTopNavSelectedIndex === index ? 1 : 0) 140 .opacity(this.currentTopNavSelectedIndex === index ? 1 : 0)