yangchenggong1_wd

fix |> 20602 【生产环境】【第三次内部验收】直播频道横滑卡,左滑时,松手跳转手势-查看更多发生抖动;

... ... @@ -23,93 +23,20 @@ export struct LiveHorizontalCardComponent {
@State moreTips: string = ''
scroller: Scroller = new Scroller()
@State compIndex: number = 0;
@State ellipseW: number = 0
@State isEnd: boolean = false
@State listLeft: number = 0
resetMoreTips() {
console.log('resetMoreTips', this.moreWidth, this.initMoreWidth)
if (this.moreWidth < this.initMoreWidth * 2) {
this.moreTips = '查看更多';
}
}
edgeAnimation() {
if (this.moreWidth < this.initMoreWidth * 3) {
if (!this.moreTips) {
this.moreTips = '查看更多';
}
this.moreWidth = this.moreWidth + 2
}
if (this.moreWidth > this.initMoreWidth * 2) {
this.moreTips = '松手查看';
} else {
}
}
reverseEdgeAnimation() {
if (this.moreWidth > this.initMoreWidth) {
this.moreWidth = this.moreWidth - 2
}
this.resetMoreTips()
}
resetEdgeAnimation() {
if (this.moreWidth > this.initMoreWidth) {
this.moreWidth = 22
}
this.resetMoreTips()
}
toMore() {
if (this.moreWidth > this.initMoreWidth * 2) {
this.liveToMore();
}
}
liveToMore() {
ProcessUtils.compJumpPage(this.compDTO)
return;
if (!!this.compDTO.dataSourceType) {
if (this.compDTO.linkUrl) {
let taskAction: Action = {
type: 'JUMP_INNER_NEW_PAGE',
params: {
url: this.compDTO.linkUrl,
pageID: 'SPACIAL_TOPIC_PAGE',
contentID: this.compDTO.objectId,
extra: {
relId: this.compDTO.relId,
relType: this.compDTO.relType,
pageId: this.compDTO.pageId
}
} as Params,
};
WDRouterRule.jumpWithAction(taskAction)
} else {
this.jumpToLiveMorePage()
}
} else {
if (this.compDTO?.objectType === '11') {
} else {
const contentDTO: ContentDTO = {
objectId: this.compDTO.objectId,
objectType: this.compDTO.objectType,
linkUrl: this.compDTO.linkUrl,
pageId: this.compDTO.pageId
} as ContentDTO
ProcessUtils.processPage(contentDTO)
}
}
}
async aboutToAppear(): Promise<void> {
// this.loadImg = await onlyWifiLoadImg();
}
showMore() {
return (!!this.compDTO.dataSourceType && this.compDTO.dataSourceType !== 'OBJECT_POS') || !(this.compDTO?.objectType === '0' || this.compDTO?.objectType === '')
}
build() {
Column() {
Row() {
... ... @@ -193,31 +120,30 @@ export struct LiveHorizontalCardComponent {
}
})
})
}
}.offset({ left: this.listLeft })
if (this.compDTO.operDataList.length >= 2 && this.showMore()) {
Row() {
Ellipse()
.width(2* (this.moreWidth - this.initMoreWidth - 1))
.width(2 * this.ellipseW)
.height('100%')
.fill(0xe9e9e9)
.position({ left: -(this.moreWidth - this.initMoreWidth - 3) * 0.8 , top: 0 })
.fill('rgb(240,235,238)')
.position({ left: -this.ellipseW, top: 0 })
Column() {
if (this.moreWidth > this.initMoreWidth + 2) {
Text(this.moreTips)
.fontSize(9)
.fontColor(0x858585)
.width(8)
Text(this.ellipseW === 0 ? '' : this.ellipseW < 20 ? '查看更多' : '松手查看')
.width('19lpx')
.fontSize('19lpx')
.fontWeight('400lpx')
.lineHeight('27lpx')
.fontColor("#9E9E9E")
}
}
.justifyContent(FlexAlign.Center)
.align(Alignment.Center)
.height('100%')
.width(this.initMoreWidth)
.backgroundColor(0xe9e9e9)
.borderRadius({ topLeft: 5, bottomLeft: 5 })
.width(this.moreWidth)
.backgroundColor("#EDEDED")
.justifyContent(FlexAlign.Center)
}
.margin({left: 1.5 * (this.moreWidth - this.initMoreWidth)})
.height('100%')
}
}
}
... ... @@ -226,24 +152,43 @@ export struct LiveHorizontalCardComponent {
.scrollBar(BarState.Off)
.edgeEffect(EdgeEffect.None)
.onReachEnd(() => {
this.edgeAnimation()
this.isEnd = true
})
.onScrollFrameBegin((offset: number, state: ScrollState) => {
if (!this.scroller.isAtEnd()) {
this.isEnd = false
}
if (this.ellipseW > 0) {
return { offsetRemain: 0 }
}
return { offsetRemain: offset }
})
.onScrollStop(() => {
// this.resetEdgeAnimation();
.parallelGesture(
PanGesture({ direction: PanDirection.Horizontal, distance: 1 })
.onActionStart((event: GestureEvent) => {
})
.onScroll((xOffset: number, yOffset: number) => {
if (xOffset < 0) {
this.reverseEdgeAnimation();
.onActionUpdate((event: GestureEvent) => {
if(this.compDTO.operDataList.length >= 2 && this.showMore()){
if (event && this.isEnd) {
// console.log('event.offsetX',event.offsetX)
this.listLeft = event.offsetX < -60 ? -60 : event.offsetX > 0 ? 0 : event.offsetX
this.ellipseW = (-this.listLeft) / 1.5
}
}
})
.onTouch((event?: TouchEvent) => {
if(event) {
if (event.type === TouchType.Up) {
this.toMore();
this.resetEdgeAnimation();
.onActionEnd((event: GestureEvent) => {
if(this.compDTO.operDataList.length >= 2 && this.showMore()){
this.listLeft = 0
// this.moreWidth = 20
if (event.offsetX < 0 && this.ellipseW >= 20) {
this.liveToMore();
}
this.ellipseW = 0
}
})
)
.width(CommonConstants.FULL_WIDTH)
.height(this.compDTO.operDataList.length == 2 ? 167 : 134)
} else if (this.compDTO.operDataList.length) {
... ...