HarmonyOS 是否支持透明背景以及自定义动画的页面
需要实现一个全局的弹出页面,和普通页面的区别主要如下:
- 背景透明
- 动画是从底部上滑
效果如图所示。由于是全局弹出的页面,无法使用 bindSheet 的方式实现。在现有的 rotuer 框架上是否能实现该效果?
HarmonyOS
赞
收藏 0
回答 1
待解决
相关问题
HarmonyOS CustomDialog是否支持自定义动画?
935浏览 • 1回复 待解决
HarmonyOS Dialog是否可以支持自定义动画
447浏览 • 1回复 待解决
HarmonyOS 自定义Dialog背景色透明问题
1414浏览 • 1回复 待解决
弹窗打开、关闭动画是否支持自定义
2789浏览 • 1回复 待解决
HarmonyOS @ohos.router是否有支持页面间自定义转场动画的计划
962浏览 • 1回复 待解决
Toast弹窗是否支持自定义背景或者字体颜色
2561浏览 • 1回复 待解决
华为手机是否支持自定义锁屏页面?
4447浏览 • 1回复 待解决
CustomDialog不支持自定义动画
875浏览 • 2回复 待解决
HarmonyOS 全局自定义弹窗的关闭弹窗的动画后续是否可以自定义?
459浏览 • 1回复 待解决
HarmonyOS 使用promptAction.opencustomdialog怎么自定义半透明背景的颜色、控制关闭
269浏览 • 1回复 待解决
HarmonyOS Search组件的searchButton是否支持背景颜色,圆角或其它元素的自定义
263浏览 • 1回复 待解决
HarmonyOS Navigation页面转场的动画怎么自定义实现
337浏览 • 1回复 待解决
自定义弹窗自定义转场动画
1498浏览 • 1回复 待解决
Swiper组件是否支持自定义动画,比如切换时渐隐渐现的效果
1921浏览 • 1回复 待解决
是否支持自定义装饰器
2401浏览 • 1回复 待解决
HarmonyOS 是否支持自定义升级弹窗
233浏览 • 1回复 待解决
HarmonyOS ArkWeb是否支持自定义UserAgent
789浏览 • 1回复 待解决
HarmonyOS 是否支持自定义装饰器?
591浏览 • 1回复 待解决
HarmonyOS 组件是否支持自定义事件
409浏览 • 1回复 待解决
HarmonyOS ArkTS是否支持自定义注解
466浏览 • 1回复 待解决
HarmonyOS 自定义弹窗怎么设置自定义动画?
742浏览 • 1回复 待解决
HarmonyOS 如何自定义相机背景
432浏览 • 1回复 待解决
HarmonyOS 如何设置自定义弹窗透明
409浏览 • 1回复 待解决
Grid组件的scrollBar是否支持自定义
2649浏览 • 1回复 待解决
CustomDialog自定义动画
942浏览 • 1回复 待解决
实现方案:
使用navigation作为路由框架时,实现透明页面只需要设置页面的NavDestinationMode属性为DIALOG模式
实现思路:
1.使用navigation作为页面跟容器
2.跳转NavDestination页面并设置其mode属性为NavDestinationMode.DIALOG
3.添加自定义转场动画(这里使用的组件转场,可根据实际需要替换为navigation的自定义转场)
核心代码:
使用navigation作为跟页面容器
子页面设置当前的页面模式为DIALOG模式
补充:上面实现了一个最简单案例,但是我们实际开发过程中会涉及到参数传递与持久化状态的问题,持久化版本代码如下:
入口:
实现方案二:使用router+subWindow实现
router路由无法更改页面模式,所以无法直接实现透明页面,需要借助拉起子窗口的方案实现透明页面的效果。思路如下:
1.获取窗口实例
2.拉起一个子窗口并加载对应页面
3.设置子窗口背景透明
4.定义子窗口的关闭方案
核心代码
在Ability中获取windowStage实例
创建一个子窗口作为页面载体,并加载
加载页面后,这时候出现的新页面发现并不是透明的,那么我们把页面跟容器设置背景颜色为透明,也没有效果,根因是窗口默认是不透明的,需要设置窗口背景色
需要注意的是,子窗口无法与主窗口事件交互,并且默认的手势返回也无法销毁,所以需要自己监听页面的返回手势来销毁子窗口来实现回到原页面的效果
RouterOpacityPage 完整代码如下:
以上使用subWindow的方案实现了一个简单的透明页面效果,实际场景中可能还涉及到页面的持久化与参数传递
方案二页面持久化:
上面代码中,在退出页面的时候使用的window.destroyWindow()方法,会导致整个窗口实例销毁,无法保存页面中的状态,这里需要使用window.minimize()方法来隐藏子窗口,而不是销毁子窗口,相关代码如下:
因为窗口之前没有提供数据传递的API,所以无法直接传递页面参数;但是每个窗口都有自己的UIContext,可以通过UIContext获取其他窗口的router路由栈,并进行参数传递操作