Cordova+Vue实现Android APP开发（三）-- 设置图标和启动欢迎页详细教程

最新推荐文章于 2026-05-13 15:23:56 发布

原创

最新推荐文章于 2026-05-13 15:23:56 发布 · 2.8k 阅读

文章标签：

#cordova #混合App

本文档详细介绍了如何使用Cordova+Vue为Android应用设置图标和启动欢迎页。首先，介绍了如何设计并生成不同尺寸的图标，然后将其合并到项目中，并修改配置文件。接着，讲解了安装splashscreen插件，设计欢迎页，以及在config.xml中进行基本和额外的配置。最后，提供了图标和启动页的规格要求。

一、前言

内容是自己查资料和自己进坑出坑，适用于cordova打包android7.0版本以后的版本。我目前使用的是android8.0，android8.1，android9，androidQ等版本。（1）设置图标icon，准备好素材，在配置文件中加入不同尺寸的<icon density="hdpi" src="https://blog.csdn.net/res/icon/android/drawable-hdpi/icon.png" />。（2）设置启动欢迎页，安装splashscreen插件，准备好素材，在配置文件中进行基本配置和其他配置。

二、设置icon图标

1、设计icon图标

你需要准备好你自己的app图标，我是使用iconfont图标字体库的https://www.iconfont.cn图标库，然后下载单个图标，选择png下载。

2、生成多种尺寸的icon

然后我使用到是图标工厂，直接把刚才的下载的png的图标，选择配置项

开始生成之后，会下载到本地。

3、icon合并到项目中

存放路径不是以www文件夹为依据，而是以当前项目文件夹为依据。

（1）根目录下新建res文件夹，以及res文件夹下面新建icon和screen文件夹

然后把刚才生成的icon.zip的压缩包复制到icon的文件夹里，解压。

（2）修改android的关于icon图标配置项

安卓的配置项在根目录下的config.xml中

增加上图框中的内容

        <icon density="hdpi" src="res/icon/android/drawable-hdpi/icon.png" />
        <icon density="ldpi" src="https://blog.csdn.net/res/icon/android/drawable-ldpi/icon.png" />
        <icon density="mdpi" src="https://blog.csdn.net/res/icon/android/drawable-mdpi/icon.png" />
        <icon density="xhdpi" src="https://blog.csdn.net/res/icon/android/drawable-xhdpi/icon.png" />
        <icon density="xxhdpi" src="https://blog.csdn.net/res/icon/android/drawable-xxhdpi/icon.png" />
        <icon density="xxhdpi" src="https://blog.csdn.net/res/icon/android/drawable-xxxhdpi/icon.png" />

src里对应的就是从根目录