一、核心结论（仅 HarmonyOS Next）

HarmonyOS Next（纯原生模式）下，UniApp 应用的开屏页完全由鸿蒙原生配置 / UIAbility 控制（系统级启动页，加载优先级高于 UniApp 前端逻辑），默认 “白背景 + logo” 是鸿蒙默认 SplashScreen，需通过修改鸿蒙原生资源 / 配置替换为自定义图片（如微信地球图），以下是仅适配 HarmonyOS Next 的完整方案。

二、前置准备（仅 HarmonyOS Next）

1. 开屏图片资源规范（必须遵循鸿蒙 Next 资源规则）

• 格式：PNG（推荐，无压缩，支持透明），JPG 也可；
• 命名：仅允许小写字母、数字、下划线（如 splash_wechat_earth.png），禁止中文 / 大写 / 特殊字符；
• 分辨率适配（避免拉伸，建议至少覆盖以下密度）：

• 图片处理：微信地球图建议裁剪为 “全屏无黑边”，保持比例（后续配置 aspectFill实现微信同款 “填充屏幕且不拉伸” 效果）。

2. 目录结构（UniApp 项目中创建鸿蒙 Next 原生目录）

手动在 UniApp 项目根目录创建以下目录（严格匹配路径，否则资源无法识别）：

uniapp项目根目录/
└── native/
    └── ohos/                # 鸿蒙Next原生配置/资源根目录（必须此命名）
        ├── res/             # 鸿蒙Next资源目录
        │   ├── base/        # 基准资源目录（必建）
        │   │   ├── media/   # 图片资源目录（放入开屏图）
        │   │   └── layout/  # 自定义开屏布局目录（方案2用）
        │   ├── hdpi/        # 高分辨率资源（可选）
        │   │   └── media/
        │   └── xhdpi/       # 2K屏资源（可选）
        │       └── media/
        └── module.json5     # 鸿蒙Next模块核心配置文件（必建）

三、方案 1：静态开屏（无交互，仅替换图片，推荐）

适合无需倒计时 / 跳过按钮的场景（如微信纯地球图开屏），仅需配置鸿蒙原生 SplashScreen，无需写原生代码。

步骤 1：编写鸿蒙 Next 核心配置（module.json5）

在 native/ohos/module.json5中配置 SplashScreen（替换默认开屏），需严格匹配 HarmonyOS Next 的 schema：

{
  "$schema": "https://developer.harmonyos.com/cn/schemas/ohos/module.json5/v3",
  "module": {
    "name": "entry",
    "type": "entry",
    "deviceTypes": ["phone"], // 仅适配手机（按需加tablet）
    "mainElement": "MainAbility", // UniApp打包后的主UIAbility（固定值，勿改）
    "abilities": [
      {
        "name": "MainAbility", // 必须与UniApp主Ability名一致
        "srcEntry": "./ets/MainAbility/MainAbility.ts", // UniApp自动生成，无需修改
        "icon": "$media:app_icon", // 保留App图标（UniApp配置的图标）
        "label": "$string:app_name", // App名称（UniApp配置的名称）
        "description": "$string:app_desc",
        // 核心：HarmonyOS Next开屏页配置
        "splashScreen": {
          "backgroundColor": "#00000000", // 背景透明（图片完全覆盖）
          "image": "$media:splash_wechat_earth", // 引用media目录下的开屏图（无后缀）
          "imageDisplayMode": "aspectFill", // 微信地球图同款：保持比例填充屏幕（裁剪边缘，无拉伸）
          "duration": 3000, // 开屏停留时间（ms），0=应用加载完成即消失
          "animationType": "none" // 关闭默认动画（避免图片闪烁）
        },
        "visible": true,
        "skills": [
          {
            "entities": ["entity.system.home"],
            "actions": ["action.system.home"]
          }
        ],
        "exported": true
      }
    ],
    "package": "com.xxx.xxx", // 必须与UniApp manifest.json的bundleName一致
    "vendor": "your_vendor",
    "versionCode": 1000000,
    "versionName": "1.0.0"
  }
}

步骤 2：关联 UniApp 的 manifest.json（确保配置一致）

修改 UniApp 根目录 manifest.json，保证鸿蒙 Next 的包名 / Ability 名与 module.json5匹配：

{
  "harmonyos": {
    "app": {
      "bundleName": "com.xxx.xxx", // 必须与module.json5的package一致
      "vendor": "your_vendor",
      "version": {
        "code": 1000000,
        "name": "1.0.0"
      }
    },
    "module": {
      "name": "entry",
      "mainAbility": "MainAbility" // 必须与module.json5的abilities[0].name一致
    }
  }
}

步骤 3：打包测试（仅 HarmonyOS Next）

1. 打开 HBuilderX → 选中 UniApp 项目 → 顶部菜单「发行」→「鸿蒙 App 打包（HarmonyOS Next）」；
2. 在打包弹窗中，「自定义鸿蒙原生资源目录」选择 native/ohos/；
3. 选择签名证书（需 HarmonyOS Next 开发者证书），生成 HAP 包；
4. 将 HAP 包安装到 HarmonyOS Next 设备 / 模拟器，启动即可看到自定义地球图开屏。

四、方案 2：自定义交互开屏（带跳过按钮 / 倒计时，HarmonyOS Next）

如需类似 App 开屏广告（带跳过按钮）或微信 “轻触进入” 效果，需自定义鸿蒙 Next 的 UIAbility 实现（ArkTS 代码）。

步骤 1：创建开屏布局文件（HarmonyOS Next 原生布局）

在 native/ohos/res/base/layout/新建 splash_layout.ets（鸿蒙 Next 的 ETS 布局文件）：

@Entry
@Component
struct SplashLayout {
  @State countDown: number = 3; // 倒计时3秒
  private timer: number = 0;
  private context = getContext(this) as UIAbilityContext;

  build() {
    Stack() {
      // 1. 微信地球图背景（全屏）
      Image($r('app.media.splash_wechat_earth'))
        .width('100%')
        .height('100%')
        .objectFit(ImageFit.Cover) // 同aspectFill，保持比例填充

      // 2. 跳过按钮（右下角）
      Button(`跳过 ${this.countDown}`)
        .width(80)
        .height(32)
        .backgroundColor(Color.Black.opacity(0.5))
        .fontColor(Color.White)
        .borderRadius(16)
        .position({ right: 20, bottom: 40 })
        .onClick(() => {
          clearTimeout(this.timer);
          this.jumpToMainAbility();
        })
    }
    .width('100%')
    .height('100%')
    .backgroundColor(Color.Black)
  }

  // 页面加载时启动倒计时
  onPageShow() {
    this.timer = setInterval(() => {
      this.countDown--;
      if (this.countDown <= 0) {
        clearTimeout(this.timer);
        this.jumpToMainAbility();
      }
    }, 1000);
  }

  // 跳转到UniApp主Ability
  private jumpToMainAbility() {
    this.context.startAbility({
      bundleName: "com.xxx.xxx", // 替换为你的bundleName
      abilityName: "MainAbility" // UniApp主Ability名
    });
    // 关闭开屏Ability
    this.context.terminateSelf();
  }

  // 页面销毁时清除定时器
  onPageHide() {
    clearTimeout(this.timer);
  }
}

步骤 2：创建自定义开屏 UIAbility（HarmonyOS Next）

在 native/ohos/ets/SplashAbility/新建 SplashAbility.ts：

import UIAbility from '@ohos.app.ability.UIAbility';
import window from '@ohos.window';

export default class SplashAbility extends UIAbility {
  // Ability创建时加载开屏布局
  onCreate(want, launchParam) {
    super.onCreate(want, launchParam);
  }

  // 窗口创建时设置开屏布局
  onWindowStageCreate(windowStage: window.WindowStage) {
    super.onWindowStageCreate(windowStage);
    // 加载自定义开屏布局
    windowStage.loadContent('pages/splash_layout', (err) => {
      if (err) {
        console.error('加载开屏布局失败：', err.message);
      }
    });
  }
}

步骤 3：修改 module.json5，设置开屏 Ability 为入口

{
  "$schema": "https://developer.harmonyos.com/cn/schemas/ohos/module.json5/v3",
  "module": {
    "name": "entry",
    "type": "entry",
    "deviceTypes": ["phone"],
    "mainElement": "SplashAbility", // 入口改为自定义开屏Ability
    "abilities": [
      {
        "name": "SplashAbility", // 自定义开屏Ability
        "srcEntry": "./ets/SplashAbility/SplashAbility.ts",
        "icon": "$media:app_icon",
        "label": "$string:app_name",
        "visible": true,
        "skills": [
          {
            "entities": ["entity.system.home"],
            "actions": ["action.system.home"]
          }
        ],
        "exported": true
      },
      {
        "name": "MainAbility", // UniApp主Ability（设为不可见）
        "srcEntry": "./ets/MainAbility/MainAbility.ts",
        "icon": "$media:app_icon",
        "label": "$string:app_name",
        "visible": false, // 仅由开屏Ability跳转，不直接显示
        "exported": true
      }
    ],
    "package": "com.xxx.xxx",
    "vendor": "your_vendor",
    "versionCode": 1000000,
    "versionName": "1.0.0"
  }
}

步骤 4：打包测试

同方案 1，打包时选择 native/ohos/作为自定义资源目录，安装后测试：开屏显示地球图，右下角跳过按钮倒计时 3 秒，点击 / 倒计时结束后跳转到 UniApp 主页面。

五、HarmonyOS Next 专属问题排查

1. 开屏图片不显示：
   • 检查图片文件名是否为小写，路径是否在 res/xxx/media/下；
   • module.json5中 image配置是否为 $media:图片名（无后缀）；
   • 鸿蒙 Next 设备需开启 “允许安装未知来源 HAP”（设置→安全→未知来源应用）。
2. 开屏不跳转主页面：
   • bundleName/abilityName必须与 UniApp manifest.json 完全一致；
   • 自定义 Ability 中 UIAbilityContext获取是否成功（可通过 console.log调试）。
3. 图片拉伸 / 黑边：
   • 布局中 objectFit设为 ImageFit.Cover（对应 SplashScreen 的 aspectFill）；
   • 图片分辨率需适配主流屏幕比例（如 19.5:9）。

六、HarmonyOS Next 官方文档（精准参考）

1. HarmonyOS Next SplashScreen 配置：原生开屏配置权威指南；
2. HarmonyOS Next UIAbility 开发：自定义 Ability 的核心 API；
3. HarmonyOS Next 资源规范：图片资源命名 / 存放规则。

总结（仅 HarmonyOS Next）

• 静态开屏：仅需配置 module.json5的 splashScreen，零原生代码，适合纯图片开屏；
• 交互开屏：需自定义 UIAbility+ETS 布局，实现跳过 / 倒计时，完全匹配鸿蒙 Next 的原生能力；
• 核心要点：资源命名 / 路径必须符合鸿蒙 Next 规范， bundleName/AbilityName与 UniApp manifest 严格一致。