developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
liyubing
be846bcf 1 parent fd3e2551

fix： 

1）修改顶导UI布局
Inline Side-by-side
Showing 1 changed file with 35 additions and 34 deletions
... ... @@ -113,7 +113,7 @@ export struct TopNavigationComponentNew {
'middle': { 'anchor': '__container__', 'align': HorizontalAlign.Center },
'bottom': { 'anchor': '__container__', 'align': VerticalAlign.Bottom }
})
.onAnimationStart((curIndex: number, index: number)=>{
.onAnimationStart((curIndex: number, index: number) => {
Logger.info(TAG, `onAnimationStart ${curIndex} ${index}`);
if (curIndex === index) {
return
... ... @@ -233,7 +233,7 @@ export struct TopNavigationComponentNew {
.listDirection(Axis.Horizontal)
.scrollBar(BarState.Off)
.edgeEffect(EdgeEffect.None)
.padding({ left: 8, top: 6, right: 0 })
.padding({ left: 8, top:0, right: 0 })
.height($r('app.float.top_tab_bar_height'))
.backgroundColor(this.barBackgroundColor)
.onAreaChange((oldValue: Area, newValue: Area) => {
... ... @@ -278,13 +278,12 @@ export struct TopNavigationComponentNew {
.listDirection(Axis.Horizontal)
.scrollBar(BarState.Off)
.edgeEffect(EdgeEffect.None)
.height($r('app.float.top_tab_bar_height_common'))
.backgroundColor(this.barBackgroundColor)
.margin({ top: 10 })
.onAreaChange((oldValue: Area, newValue: Area) => {
let width = Number.parseFloat(newValue.width.toString())
this.tabsWidth = Number.isNaN(width) ? 0 : width
})
.height($r('app.float.top_tab_bar_height_common'))
.backgroundColor(this.barBackgroundColor)
.id('tabList')
.alignRules({
'top': { 'anchor': '__container__', 'align': VerticalAlign.Top },
... ... @@ -327,12 +326,13 @@ export struct TopNavigationComponentNew {
minWidth: $r('app.float.top_tab_item_min_width'),
maxWidth: $r('app.float.top_tab_item_max_width')
})
.height('100%')
// .backgroundColor(Color.Transparent)
.padding({
left: $r('app.float.top_tab_item_padding_horizontal'),
right: $r('app.float.top_tab_item_padding_horizontal'),
bottom: 2,
})
.justifyContent(FlexAlign.Center)
.id(`col_tabBar${index}`)
// .margin({ right: this.myChannelList.length === index + 1 ? 36 : 0 })
.onClick(() => {
... ... @@ -497,7 +497,7 @@ export struct TopNavigationComponentNew {
Logger.info(TAG, `currentTopNavSelectedIndex : ${this.currentTopNavSelectedIndex}、${this.currentBottomNavName}`);
// 顶部tab埋点
if(this.currentBottomNavName === '新闻') {
if (this.currentBottomNavName === '新闻') {
const tab = this.myChannelList[this.currentTopNavSelectedIndex]
Logger.info(TAG, `新闻tab埋点: ${JSON.stringify(tab)}`);
... ... @@ -507,7 +507,7 @@ export struct TopNavigationComponentNew {
"pageId": tab.pageId,
}
Tracking.event("home_page_tab_click ", params)
} else if(this.currentBottomNavName === '人民号') {
} else if (this.currentBottomNavName === '人民号') {
const tab = this.topNavList[this.currentTopNavSelectedIndex]
Logger.info(TAG, `人民号tab埋点: ${JSON.stringify(tab)}`);
... ... @@ -519,6 +519,7 @@ export struct TopNavigationComponentNew {
Tracking.event("People_account_page_tab_click", params)
}
}
onAutoRefresh() {
if (this.bottomNavIndex != this._currentNavIndex) {
return
... ... @@ -619,32 +620,32 @@ export struct TopNavigationComponentNew {
return null
}
private getTextInfo(index: number): Record<string, number> {
let strJson = getInspectorByKey(index.toString())
try {
let obj: Record<string, string> = JSON.parse(strJson)
let rectInfo: number[][] = JSON.parse('[' + obj.$rect + ']')
return { 'left': px2vp(rectInfo[0][0]), 'width': px2vp(rectInfo[1][0] - rectInfo[0][0]) }
} catch (error) {
return { 'left': 0, 'width': 0 }
}
}
private getCurrentIndicatorInfo(index: number, event: TabsAnimationEvent): Record<string, number> {
let nextIndex = index
if (index > 0 && event.currentOffset > 0) {
nextIndex--
} else if (index < 3 && event.currentOffset < 0) {
nextIndex++
}
let indexInfo = this.getTextInfo(index)
let nextIndexInfo = this.getTextInfo(nextIndex)
let swipeRatio = Math.abs(event.currentOffset / this.tabsWidth)
let currentIndex = swipeRatio > 0.5 ? nextIndex : index // 页面滑动超过一半，tabBar切换到下一页。
let currentLeft = indexInfo.left + (nextIndexInfo.left - indexInfo.left) * swipeRatio
let currentWidth = indexInfo.width + (nextIndexInfo.width - indexInfo.width) * swipeRatio
return { 'index': currentIndex, 'left': currentLeft, 'width': currentWidth }
}
// private getTextInfo(index: number): Record<string, number> {
// let strJson = getInspectorByKey(index.toString())
// try {
// let obj: Record<string, string> = JSON.parse(strJson)
// let rectInfo: number[][] = JSON.parse('[' + obj.$rect + ']')
// return { 'left': px2vp(rectInfo[0][0]), 'width': px2vp(rectInfo[1][0] - rectInfo[0][0]) }
// } catch (error) {
// return { 'left': 0, 'width': 0 }
// }
// }
// private getCurrentIndicatorInfo(index: number, event: TabsAnimationEvent): Record<string, number> {
// let nextIndex = index
// if (index > 0 && event.currentOffset > 0) {
// nextIndex--
// } else if (index < 3 && event.currentOffset < 0) {
// nextIndex++
// }
// let indexInfo = this.getTextInfo(index)
// let nextIndexInfo = this.getTextInfo(nextIndex)
// let swipeRatio = Math.abs(event.currentOffset / this.tabsWidth)
// let currentIndex = swipeRatio > 0.5 ? nextIndex : index // 页面滑动超过一半，tabBar切换到下一页。
// let currentLeft = indexInfo.left + (nextIndexInfo.left - indexInfo.left) * swipeRatio
// let currentWidth = indexInfo.width + (nextIndexInfo.width - indexInfo.width) * swipeRatio
// return { 'index': currentIndex, 'left': currentLeft, 'width': currentWidth }
// }
private startAnimateTo(duration: number, leftMargin: number, width: number) {
animateTo({
... ...