HarmonyOS 实现切换页面时从左边进入,退出时原路返回的最佳方案

离开的页面(pages/ConversionPage.ets)使用以下代码:

// 页面转场动画
pageTransition() {
  // 定义页面进入时的效果,从右侧滑入,时长为1000ms,无论页面栈发生push还是pop操作均可生效
  PageTransitionEnter({ type: RouteType.None, duration: 1000 })
    .slide(SlideEffect.Right)
  // 定义页面退出时的效果,向左或右侧滑出,时长为1200ms,无论页面栈发生push还是pop操作均可生效
  PageTransitionExit({ type: RouteType.None, duration: 1200 })
    .slide(SlideEffect.Right)
}

从左侧进入的页面(pages/SwitchCurrencyPage.ets)使用下面代码:

// 页面转场动画
pageTransition() {
  // 定义页面进入时的效果,从左侧滑入,时长为1200ms,无论页面栈发生push还是pop操作均可生效
  PageTransitionEnter({ type: RouteType.None, duration: 1200 })
    .slide(SlideEffect.Left)
  // 定义页面退出时的效果,向左侧滑出,时长为1000ms,无论页面栈发生push还是pop操作均可生效
  PageTransitionExit({ type: RouteType.None, duration: 1000 })
    .slide(SlideEffect.Left)
}

效果不好,没办法实现原APP的效果。

HarmonyOS
1天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

页面转场动画设置到了页面的子组件中,不是整个页面中,把pageTransition换到@entry装饰的组件下面就可以了,参考如下:

1、ConversionPage页面

@Entry
@Component
struct ConversionPage {
  ...
  pageTransition() {
    PageTransitionEnter({ duration: 1200 })
    PageTransitionExit({ duration: 1000 })
  }
}

2、SwitchCurrencyPage页面

pageTransition() {
  PageTransitionEnter({ duration: 1000 }).slide(SlideEffect.Left)
  PageTransitionExit({ duration: 1200 }).slide(SlideEffect.Left)
}

SwitchCurrencyPage页面设置下背景颜色,就不会看到ConversionPage页面了。

分享
微博
QQ
微信
回复
1天前
相关问题
鸿蒙tablist 如何通过滑动切换页面
6707浏览 • 1回复 待解决
HarmonyOS 路由切换页面过渡慢问题
394浏览 • 1回复 待解决
返回页面不触发aboutToAppear
3677浏览 • 1回复 待解决
HarmonyOS 页面返回应用闪退报错
631浏览 • 1回复 待解决
引导遮罩效果实现最佳方案
1121浏览 • 1回复 待解决