HarmonyOS 鸿蒙Next:如何将自定义的动态图片设置为app启动页

发布于 1周前 作者 bupafengyu 来自 鸿蒙OS

HarmonyOS 鸿蒙Next:如何将自定义的动态图片设置为app启动页
想做的事:用一个写好的页面(该页面动态获取指定的文字和图标进行显示)作为启动页的中间的那个闪屏图片

目前难点:我发现用startWindowIcon和startWindowBackgroud控制,但是这两个参数一个只能输入一个图标,一个只能输入一个color属性值,这并不满足我想要的场景,我希望的是一个我画好的页面,比如/pages中的一个界面直接作为背景图片显示,这个该怎么操作呢

3 回复

APP默认启动效果是通过module.json5中startWindowIcon和startWindowBackground两个字段设置的,启动页是每个UIAbility都必须有的,这两个字段不可缺省,否则不能编译通过。

目前自定义启动页,可以通过以下方法:

  1. 将startWindowIcon设置为透明图片。但主窗口默认会有颜色,所以设置startWindowBackground为透明是无效的(主窗口创建页面的过程,目前没法透明)。

  2. 手动创建splash页面(即楼主描述中自己画好的页面)进行业务初始化操作,来实现自定义启动页。

  3. EntryAbility.ets中windowStage.loadContent()方法加载splash页面。可以参考以下样例:

// 新建 Splash.ets,用于显示启动图,2秒后跳转到首页
import router from '@ohos.router'

@Entry
@Component
struct Splash {
  aboutToAppear() {
    setTimeout(() => {
      router.replaceUrl({ url: 'pages/Index'});
    }, 2000)
  }

  build() {
    Stack () {
      // 背景
      Image($r('app.media.bg_splash'))
        .width('100%')
        .height('100%')
        .objectFit(ImageFit.Cover)
        .hoverEffect(HoverEffect.None)
    }
  }
}

然后修改EntryAbility.ets文件,将其中 windowStage.loadContent(‘pages/Index’) 修改为 windowStage.loadContent(‘pages/Splash’)。

最终效果就是:应用冷启动时先显示纯色启动屏(规格如此,无法去除),然后进入开屏页,再从开屏页切换到应用的主界面,完成应用的启动流程。

更多关于HarmonyOS 鸿蒙Next:如何将自定义的动态图片设置为app启动页的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


明白了,原来是通过设置透明图案解决startWindowIcon不可缺省这一问题的,也确实存在冷启动一开始还会存在白屏情况,如果能将Splash作为启动闪屏就更好了,按大佬这种说法,目前还做不到,其实感觉是不是鸿蒙团队提提需求,感觉这是个优化点呢。

在HarmonyOS(鸿蒙)系统中,将自定义的动态图片设置为应用启动页(Splash Screen)的过程通常涉及修改应用的配置文件和代码。以下是一个基本的实现步骤:

  1. 准备动态图片资源:确保你的动态图片资源(如GIF或视频格式)已正确放置在应用的资源目录中。

  2. 修改配置文件:在config.json中,配置启动页的相关设置,但需要注意的是,鸿蒙系统原生不支持直接配置动态图片作为启动页。因此,你需要在代码中实现这一功能。

  3. 编写代码实现

    • 在应用的入口Activity(或等效的页面组件)的onCreate方法中,通过代码加载并显示动态图片。
    • 可以使用鸿蒙提供的媒体播放API或第三方库来实现动态图片的播放。
    • 设置一个定时器,在动态图片播放完毕后跳转到应用的主界面。
  4. 测试与调试:在真机或模拟器上运行应用,确保动态图片能够正确显示并按预期跳转到主界面。

由于鸿蒙系统的API和框架可能与Android有所不同,具体的实现细节可能需要根据鸿蒙的官方文档进行调整。

如果问题依旧没法解决请联系官网客服,官网地址是 https://www.itying.com/category-93-b0.html

回到顶部