Cordova camera permission setup
August 7, 2025 · AI Conversations
Here’s how it works step-by-step:
—
### ✅ 1. **Install the Camera Plugin**
Use the official Cordova Camera plugin:
cordova plugin add cordova-plugin-camera
Or for barcode scanning:
cordova plugin add phonegap-plugin-barcodescanner
—
### ✅ 2. **Declare Permissions in `config.xml`**
Most Cordova plugins automatically add the necessary permissions to the `AndroidManifest.xml`, but you can declare them explicitly in `config.xml` if needed:
<platform name="android">
<edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/uses-permission">
<uses-permission android:name="android.permission.CAMERA" />
</edit-config>
</platform>
—
### ✅ 3. **Request Runtime Permission (Android 6.0+)**
Starting from Android 6.0 (API level 23), you must request permissions at runtime.
You can use the `cordova-plugin-android-permissions` plugin:
cordova plugin add cordova-plugin-android-permissions
Then in JavaScript:
document.addEventListener("deviceready", function () {
var permissions = cordova.plugins.permissions;
permissions.checkPermission(permissions.CAMERA, function(status) {
if (!status.hasPermission) {
permissions.requestPermission(permissions.CAMERA, function(status) {
if (status.hasPermission) {
// Permission granted
} else {
alert("Camera permission is required to use this feature.");
}
}, function() {
console.error("Camera permission request failed");
});
}
}, null);
});
—
### ✅ 4. **Triggering Camera Access (will prompt if permission not granted)**
When you use the camera:
navigator.camera.getPicture(onSuccess, onFail, {
quality: 50,
destinationType: Camera.DestinationType.DATA_URL
});
If permission hasn't been granted yet, Android will automatically prompt the user — **but only if the runtime check above is not already handled manually**.
—
### ✅ Notes
– **On iOS**, permissions are handled automatically when first accessing the camera, but you must set the **`NSCameraUsageDescription`** in your `config.xml`:
<platform name="ios">
<config-file parent="NSCameraUsageDescription" platform="ios" target="*-Info.plist">
<string>We need access to your camera for scanning purposes.</string>
</config-file>
</platform>
—
Let me know if you want a complete working example with camera or barcode scanner plugin.
> ✅ Trigger a **runtime permission request** for the `CAMERA` permission inside the `deviceready` event.
Cordova **does not** automatically ask for permissions until a plugin (like camera or barcode scanner) tries to use them. So if you want to **explicitly request camera permission on first launch**, here is how:
—
### ✅ Step-by-step Setup
#### 1. **Install Required Plugin**
You must install the Android permissions plugin:
cordova plugin add cordova-plugin-android-permissions
—
#### 2. **Request Permission on App Launch**
Add this code in your `index.js` (or wherever your app boots up):
document.addEventListener('deviceready', function () {
var permissions = cordova.plugins.permissions;
permissions.checkPermission(permissions.CAMERA, function (status) {
if (!status.hasPermission) {
// Ask for permission
permissions.requestPermission(permissions.CAMERA, function (status) {
if (status.hasPermission) {
console.log("Camera permission granted.");
} else {
alert("Camera permission is required to use this app.");
}
}, function (error) {
console.error("Permission request failed: ", error);
});
} else {
console.log("Camera permission already granted.");
}
}, function (error) {
console.error("Permission check failed: ", error);
});
});
—
### ✅ Optional: Add Permission in `config.xml`
Though not required (since plugin adds it), you can explicitly include:
<platform name="android">
<edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/uses-permission">
<uses-permission android:name="android.permission.CAMERA" />
</edit-config>
</platform>
—
### ✅ Result:
With this setup:
– The app will ask for **camera permission immediately on first launch**.
– If denied, you can show a warning or exit the app.
– Once granted, your camera plugin or scanner will work without prompting again.
—
Let me know if you want to combine this with `phonegap-plugin-barcodescanner` or another plugin.
The "AndroidWindowSplashScreenAnimatedIcon" value does not exist. Cordova's default will be used.
means that in your `config.xml`, you have specified (or a plugin/CLI is expecting) a **splash screen animated icon** value for Android 12+ splash screen support — but **you haven’t provided it**.
—
### ✅ Why This Happens
Starting with **Android 12 (API 31)**, Google introduced a new splash screen system that requires:
– A static icon (`AndroidWindowSplashScreenStaticIcon`)
– An animated icon (`AndroidWindowSplashScreenAnimatedIcon`) – **optional**
– A background color (`AndroidWindowSplashScreenBackgroundColor`)
Cordova tries to apply these automatically, but if the animated icon is not explicitly provided, it falls back to its **default icon** — hence the warning.
—
### ✅ How to Fix or Suppress the Warning
#### ✅ Option 1: **Ignore the warning**
If you don’t need an animated splash icon, **you can safely ignore this message**. Cordova will still work fine using its default static icon.
—
#### ✅ Option 2: **Explicitly define the animated icon** (for Android 12+)
You can define it in your `config.xml` like this:
<platform name="android">
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="@drawable/splash_animation" />
<preference name="AndroidWindowSplashScreenBackgroundColor" value="#FFFFFF" />
<preference name="AndroidWindowSplashScreenIconBackgroundColor" value="#FFFFFF" />
</platform>
Then, in your `platforms/android/app/src/main/res/drawable` folder, place a compatible **animated vector drawable (AVD)** file named `splash_animation.xml`.
**Note:** Creating this animation file is an Android-specific task, not handled by Cordova CLI.
—
#### ✅ Option 3: **Remove the preference entirely**
If you're not using animation and want to avoid confusion, remove this line if present:
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="..." />
Cordova will then not attempt to look for a custom animated icon and will use its default behavior without a warning.
—
### ✅ Conclusion
This warning is harmless unless you specifically want a custom animated splash icon. If not needed, **you can ignore it or remove the preference** from `config.xml`.
Let me know if you want help adding a custom splash animation for Android 12+.
splashscreen.xml
– A background color (`@color/cdv_splashscreen_background`)
– A centered bitmap logo (`@drawable/splash_logo`)
However, this is used for:
> ✅ **`AndroidWindowSplashScreenStaticIcon`** — not for the **animated icon**, which is what the warning is about:
The "AndroidWindowSplashScreenAnimatedIcon" value does not exist. Cordova's default will be used.
—
### 🔍 Why the Warning Happens Despite Your `splashscreen.xml`
Cordova 11+ (and Android 12+) optionally supports an **animated vector drawable (AVD)** via:
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="@drawable/your_animated_icon" />
But your `splashscreen.xml` is **not** an animated vector drawable — it’s a **layer-list**, used as a **static background**.
—
### ✅ Options to Fix or Cleanly Suppress the Warning
#### ✅ Option 1: **Ignore the warning**
If you don’t need an animation, simply **don’t set** `AndroidWindowSplashScreenAnimatedIcon` at all. Your static splash will still work just fine with Android 12.
Make sure this line is **not present** in your `config.xml`:
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="..." />
#### ✅ Option 2: **Add a real animated drawable** (if you want animation)
You’d need to:
1. Create an **animated vector drawable** (`res/drawable/splash_animation.xml`)
2. Reference it in `config.xml`:
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="@drawable/splash_animation" />
But this is more involved and mostly needed only if you want a slick animated splash logo on Android 12+.
—
### ✅ Summary
– Your `splashscreen.xml` is fine for **static display**.
– The warning is only about an **optional animated icon**.
– You can either **ignore the warning** or **remove the preference** from `config.xml` to stop Cordova from looking for it.
Let me know if you want help building an animated splash for Android 12+.
Checking Java JDK and Android SDK versions
ANDROID_HOME=/home/admin1/Android/Sdk (recommended setting)
ANDROID_SDK_ROOT=undefined (DEPRECATED)
Using Android SDK: /home/admin1/Android/Sdk
BUILD SUCCESSFUL in 15s
1 actionable task: 1 executed
Subproject Path: CordovaLib
Subproject Path: app
> Configure project :app
WARNING: Using flatDir should be avoided because it doesn't support any meta-data formats.
> Task :CordovaLib:compileDebugJavaWithJavac
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
> Task :app:processDebugResources FAILED
[Incubating] Problems report is available at: file:///home/admin1/nethues-projects/Klassenergy-project/android-apps/circusscanner/platforms/android/build/reports/problems/problems-report.html
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:processDebugResources'.
> A failure occurred while executing com.android.build.gradle.internal.res.LinkApplicationAndroidResourcesTask$TaskAction
> Android resource linking failed
ERROR: /home/admin1/nethues-projects/Klassenergy-project/android-apps/circusscanner/platforms/android/app/src/main/res/xml/config.xml:67: AAPT: error: resource drawable/splashscreen (aka com.fossettscircus.scanner:drawable/splashscreen) not found.
* Try:
> Run with –stacktrace option to get the stack trace.
> Run with –info or –debug option to get more log output.
> Run with –scan to get full insights.
> Get more help at https://help.gradle.org.
Deprecated Gradle features were used in this build, making it incompatible with Gradle 9.0.
You can use '–warning-mode all' to show the individual deprecation warnings and determine if they come from your own scripts or plugins.
For more on this, please refer to https://docs.gradle.org/8.13/userguide/command_line_interface.html#sec:command_line_warnings in the Gradle documentation.
BUILD FAILED in 13s
38 actionable tasks: 38 executed
Command failed with exit code 1: /home/admin1/nethues-projects/Klassenergy-project/android-apps/circusscanner/platforms/android/tools/gradlew cdvBuildDebug
ERROR: .../res/xml/config.xml:67: AAPT: error: resource drawable/splashscreen (...) not found.
means that your `config.xml` (or one of your splash-related preferences) is referencing a **`@drawable/splashscreen`** resource that **does not exist** in your Android project.
—
### 🔍 Likely Causes
1. You referenced:
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="@drawable/splashscreen" />
or
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splashscreen" />
…but no file named `splashscreen.xml` (or `.png`) exists in `platforms/android/app/src/main/res/drawable/`.
2. You **may have intended to reference** the `splashscreen.xml` layer-list file you mentioned earlier — but it **wasn't placed correctly** or is named incorrectly.
—
### ✅ Fix in 3 Steps
#### ✅ 1. **Double-check the file exists**
Ensure this file is placed in:
platforms/android/app/src/main/res/drawable/splashscreen.xml
And its contents are the correct layer-list (as you mentioned):
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@color/cdv_splashscreen_background" />
<item>
<bitmap
android:gravity="center"
android:src="@drawable/splash_logo" />
</item>
</layer-list>
Also confirm that `splash_logo.png` exists in the appropriate `drawable-*` folders (like `drawable-mdpi`, etc).
—
#### ✅ 2. **Update `config.xml`**
If you're referencing this custom `splashscreen.xml`, make sure you're pointing to it like this (optional):
<preference name="AndroidWindowSplashScreenAnimatedIcon" value="@drawable/splashscreen" />
BUT — **this must be an AVD (animated vector drawable)** if you’re using it for the **animated icon**.
Since yours is a static `layer-list`, you should instead **use this for `StaticIcon`**:
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splashscreen" />
And if you're not using an animated icon at all, remove:
<preference name="AndroidWindowSplashScreenAnimatedIcon" ... />
—
#### ✅ 3. **Clean & Rebuild**
After fixing the drawable references:
cordova clean android
cordova build android
Or manually delete:
platforms/android
plugins
www
Then regenerate:
cordova platform add android
cordova build android
—
### ✅ Summary
– You got the error because `@drawable/splashscreen` was missing or incorrectly used.
– `splashscreen.xml` should be in `res/drawable/` and only used for **static icons** (not animated).
– Remove the `AndroidWindowSplashScreenAnimatedIcon` preference or replace it with a real AVD if needed.
– Clean and rebuild to resolve lingering Gradle issues.
Let me know if you want to fully disable the Android 12 splash screen system and stick to Cordova's legacy splash setup.
By default, Cordova outputs:
platforms/android/app/build/outputs/apk/release/app-release.apk
You can **rename this file automatically** during the build process.
—
### ✅ Step-by-Step: Rename APK on Release Build
#### 1. **Create/Edit the Gradle build override**
Edit this file (create it if it doesn't exist):
platforms/android/app/build.gradle
Add the following code at the **bottom** of the file:
android.applicationVariants.all { variant ->
if (variant.buildType.name == 'release') {
variant.outputs.all { output ->
def appName = "MyAppName"
def versionName = variant.versionName
def buildType = variant.buildType.name
outputFileName = "${appName}-v${versionName}-${buildType}.apk"
}
}
}
You can customize:
– `appName` → your custom name
– Output format → e.g. `MyAppName-v1.0.0-release.apk`
> 🔁 The final APK will be output in:
> `platforms/android/app/build/outputs/apk/release/`
—
### 🛠 Example Output Name
If your app version is `1.0.0` and you set `appName = "CircusScanner"`:
Result:
CircusScanner-v1.0.0-release.apk
—
### 🧼 Optional: Clean Before Rebuild
cordova clean android
cordova build android --release
—
Let me know if you want different names per flavor/build type (like `debug`, `release`, or `prod-staging`).
—
## ✅ 1. Remove Cordova Default Icons & Splash Screens
Cordova uses default icons/splash screens if custom ones aren't defined. To fully **remove** them:
### 🗑 Remove from `config.xml`:
Open `config.xml` and **remove or comment out** any of these default tags:
<icon src="res/icon.png" />
<splash src="res/screen.png" />
Also remove any “ blocks that define default icons/splashes (if present).
—
## ✅ 2. Add Your Own Custom Icons
For Android, icons must follow **specific resolutions** and be placed in the proper folders:
### 📁 Example Structure:
resources/
├── android/
│ └── icon/
│ ├── drawable-mdpi-icon.png (48x48)
│ ├── drawable-hdpi-icon.png (72x72)
│ ├── drawable-xhdpi-icon.png (96x96)
│ ├── drawable-xxhdpi-icon.png (144x144)
│ └── drawable-xxxhdpi-icon.png (192x192)
### 🧩 Add to `config.xml`:
<platform name="android">
<icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi" />
<icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi" />
<icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi" />
<icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi" />
<icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi" />
</platform>
—
## ✅ 3. Add Your Own Splash Screens
Same as icons, splashes need multiple resolutions:
### 📁 Example:
resources/
└── android/
└── splash/
├── drawable-port-mdpi-screen.png (320x480)
├── drawable-port-hdpi-screen.png (480x800)
├── drawable-port-xhdpi-screen.png (720x1280)
├── drawable-port-xxhdpi-screen.png (960x1600)
└── drawable-port-xxxhdpi-screen.png (1280x1920)
### 🧩 Add to `config.xml`:
<platform name="android">
<splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi" />
<splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi" />
<splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi" />
<splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi" />
<splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi" />
</platform>
—
## ✅ 4. Generate Resources (Optional but Recommended)
If you want Cordova to generate all densities for you from a single icon/splash:
cordova-res android --skip-config --copy
Or to auto-apply based on `config.xml`:
cordova-res android --copy
Install it first if needed:
npm install -g cordova-res
—
## ✅ 5. Rebuild the App
cordova clean android
cordova build android --release
—
## ✅ 6. Bonus (Android 12 Splash Support)
If targeting Android 12+, define:
<platform name="android">
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splash_logo" />
<preference name="AndroidWindowSplashScreenBackgroundColor" value="#000000" />
</platform>
And place `splash_logo.png` in:
platforms/android/app/src/main/res/drawable/
—
Let me know if you'd like an automated script to generate all required splash/icon sizes from one image.
—
### ✅ What This Means for You (Cordova + Android 14)
– 🛑 The “ tags in `config.xml` and the **SplashScreen plugin's fullscreen image** are **no longer supported**.
– ✅ You **must use** Android's **new splash screen** which shows:
– A static **icon**
– A **background color**
– (Optionally) an **animated icon**
– Optional theme duration (`AndroidWindowSplashScreenDuration`)
—
### ✅ Correct Way to Define Splash on Android 12–14+
#### 🔧 `config.xml` setup:
<platform name="android">
<!-- Required: Static icon for splash screen -->
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splash_logo" />
<!-- Required: Background color -->
<preference name="AndroidWindowSplashScreenBackgroundColor" value="#000000" />
<!-- Optional: Icon background color -->
<preference name="AndroidWindowSplashScreenIconBackgroundColor" value="#000000" />
<!-- Optional: Duration (in ms) -->
<preference name="AndroidWindowSplashScreenDuration" value="3000" />
<!-- Optional: animated icon (must be an AnimatedVectorDrawable) -->
<!-- <preference name="AndroidWindowSplashScreenAnimatedIcon" value="@drawable/splash_animation" /> -->
</platform>
#### 📁 Place resources here:
– `platforms/android/app/src/main/res/drawable/splash_logo.png` → your icon (recommended size: **200×200** to **400×400** px)
– You can use `splash_logo.xml` if you want to use a **vector** icon
—
### 🚫 Remove Deprecated Usage
Remove any “ tags like:
<splash src="res/screen/android/splash.png" density="port-mdpi" />
Also remove or **avoid using**:
cordova plugin add cordova-plugin-splashscreen
This plugin is now **useless on Android 12+** (and fails on Android 14).
—
### ✅ Summary
| Setting | Required | Notes |
|—————————-|———-|—————————————————-|
| `AndroidWindowSplashScreenStaticIcon` | ✅ | Your app icon or splash logo |
| `AndroidWindowSplashScreenBackgroundColor` | ✅ | Background of the splash |
| `AndroidWindowSplashScreenAnimatedIcon` | ❌ Optional | Must be AVD format if used |
| `cordova-plugin-splashscreen` | ❌ Remove | Deprecated and not used on Android 12+ |
| “ tags in `config.xml` | ❌ Remove | No effect on Android 12–14 |
—
Let me know if you'd like a ready-to-use folder structure and XML values for Android 14 splash screens.
—
### ✅ 1. Use the Camera or Barcode Scanner Plugin
Install one of these plugins:
**For photo camera:**
cordova plugin add cordova-plugin-camera
**For barcode scanner:**
cordova plugin add phonegap-plugin-barcodescanner
—
### ✅ 2. Use `cordova-plugin-android-permissions` to check/request permission at runtime
cordova plugin add cordova-plugin-android-permissions
—
### ✅ 3. Full Example: Ask Permission Before Opening Camera
document.addEventListener('deviceready', function () {
var permissions = cordova.plugins.permissions;
function openCameraIfPermitted() {
permissions.checkPermission(permissions.CAMERA, function (status) {
if (status.hasPermission) {
// ✅ Permission already granted – open camera
openCamera();
} else {
// ❌ Not yet granted – ask
permissions.requestPermission(permissions.CAMERA, function (status) {
if (status.hasPermission) {
// ✅ Granted now – open camera
openCamera();
} else {
alert("Camera permission is required to use this feature.");
}
}, function () {
alert("Failed to request camera permission.");
});
}
}, function () {
alert("Failed to check camera permission.");
});
}
function openCamera() {
navigator.camera.getPicture(
function (imageData) {
// success
console.log("Captured image data");
},
function (message) {
alert("Camera failed: " + message);
},
{
quality: 50,
destinationType: Camera.DestinationType.DATA_URL
}
);
}
// 🔘 For example, bind to a button:
document.getElementById('startCameraBtn').addEventListener('click', function () {
openCameraIfPermitted();
});
});
—
### ✅ Result
– The app **doesn't ask permission at install**.
– When the user taps **"Open Camera"**, the app:
– ✔️ Checks if permission is granted.
– ❌ If not, requests it.
– ✅ If granted, opens the camera.
—
Let me know if you’re using the barcode scanner instead, I’ll give you the adjusted version.
This is how you do it **cleanly at startup**, inside the `deviceready` event.
—
### ✅ Full Code: Ask Camera Permission on App Launch
document.addEventListener('deviceready', function () {
var permissions = cordova.plugins.permissions;
permissions.checkPermission(permissions.CAMERA, function (status) {
if (!status.hasPermission) {
// Request permission if not granted
permissions.requestPermission(permissions.CAMERA, function (status) {
if (status.hasPermission) {
console.log("Camera permission granted on app launch.");
// Proceed to app features
} else {
alert("Camera permission is required. Exiting app.");
navigator.app.exitApp(); // Optional: exit if permission denied
}
}, function (error) {
alert("Permission request failed: " + error);
navigator.app.exitApp(); // Optional
});
} else {
console.log("Camera permission already granted.");
// Proceed to app features
}
}, function (error) {
alert("Permission check failed: " + error);
navigator.app.exitApp(); // Optional
});
});
—
### ✅ Make Sure These Plugins Are Installed
cordova plugin add cordova-plugin-android-permissions
cordova plugin add cordova-plugin-camera
—
### ✅ Optional: Show Splash Until Permission is Granted
You can delay hiding the splash screen (if still using `cordova-plugin-splashscreen`) until permission is handled:
<preference name="AutoHideSplashScreen" value="false" />
Then in JS, after permission:
navigator.splashscreen.hide();
—
Let me know if you want to check for **multiple permissions at once** (like CAMERA + STORAGE).
—
### ✅ Result You Want
– 🟢 On app launch:
If `CAMERA` is not granted → Android system dialog appears:
> “Allow *AppName* to take pictures and record video?”
– ✅ If granted → continue app.
– ❌ If denied → optionally exit or disable camera-related features.
—
### ✅ Implementation Using Cordova
This uses **only Android's native permission system**, triggered via `cordova-plugin-android-permissions`.
#### ✅ 1. Install the required plugin
cordova plugin add cordova-plugin-android-permissions
#### ✅ 2. Ask system permission on app launch
In your `index.js` or similar:
document.addEventListener('deviceready', function () {
var permissions = cordova.plugins.permissions;
permissions.checkPermission(permissions.CAMERA, function (status) {
if (!status.hasPermission) {
// 🔔 This triggers the native Android system permission dialog
permissions.requestPermission(permissions.CAMERA, function (status) {
if (status.hasPermission) {
console.log("CAMERA permission granted");
// You may proceed to your app logic
} else {
alert("CAMERA permission denied. The app may not work correctly.");
navigator.app.exitApp(); // Optional: close app if permission is required
}
}, function () {
alert("Error requesting permission.");
navigator.app.exitApp(); // Optional
});
} else {
console.log("CAMERA permission already granted");
}
}, function () {
alert("Error checking permission.");
navigator.app.exitApp(); // Optional
});
});
—
### ✅ What You'll See
On **Android 6+**, the OS will show the native permission dialog like this:
> **App wants to take pictures and record video**
> [Deny] [Allow]
You do **not** need to show your own dialog — this is fully handled by the OS when `requestPermission()` is called.
—
### ✅ Tip: Permissions for Multiple Needs
If your app needs more than CAMERA (like STORAGE or LOCATION), you can request all at once:
permissions.requestPermissions([
permissions.CAMERA,
permissions.WRITE_EXTERNAL_STORAGE
], successCallback, errorCallback);
—
Let me know if you want to request multiple permissions at launch or delay asking until a specific feature is used.
—
### ✅ 1. **Ensure the File Exists**
Check that the icon file:
splash_logo.png
exists in this path:
platforms/android/app/src/main/res/drawable/splash_logo.png
> ⚠️ **Important:** Cordova does not copy this image automatically — you must place it manually in the `drawable` folder.
—
### ✅ 2. **Use a Suitable Size**
Make sure your icon is at least **200×200 px**, ideally **400×400 px** for Android 12+ splash screens.
—
### ✅ 3. **Rebuild Your App**
After placing the image, clean and rebuild:
cordova clean android
cordova build android --release
—
### ✅ 4. **Optional: Use Vector Drawable Instead**
If you're using an XML drawable (like `splash_logo.xml`), ensure it’s a valid vector drawable and placed here:
platforms/android/app/src/main/res/drawable/splash_logo.xml
—
### ✅ 5. **Check AndroidManifest.xml (optional)**
Ensure Cordova is picking it up in the merged manifest:
<application
android:theme="@style/Theme.App.SplashScreen">
</application>
If needed, modify `platforms/android/app/src/main/res/values/styles.xml` to ensure it uses the right splash icon.
—
Let me know if you'd like me to generate a working drawable folder structure for your icon or convert an image into multiple densities.
—
### ✅ Step-by-Step Fix
#### ✅ 1. **Place Your Custom Splash Icon**
Manually place your custom icon (`splash_logo.png`) in:
platforms/android/app/src/main/res/drawable/splash_logo.png
Make sure:
– File name: `splash_logo.png`
– Size: At least **200×200** px (recommended: **400×400** px)
> ⚠️ Cordova does **not copy this file** from your root project. You must add it manually **after** every `platform add`.
—
#### ✅ 2. **Ensure `config.xml` has the correct reference**
Your `config.xml` should include:
<platform name="android">
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splash_logo" />
<preference name="AndroidWindowSplashScreenBackgroundColor" value="#007bff" />
<preference name="AndroidWindowSplashScreenIconBackgroundColor" value="#ffffff" />
<preference name="AndroidWindowSplashScreenDuration" value="3000" />
</platform>
—
#### ✅ 3. **Remove the Cordova Splash Plugin (if still installed)**
cordova plugin rm cordova-plugin-splashscreen
This is deprecated and may conflict with Android 12+ splash behavior.
—
#### ✅ 4. **Clean and Rebuild**
cordova clean android
cordova build android
If needed, manually delete the `platforms/android` folder, then:
cordova platform add android
cordova build android
—
### ✅ Optional Debug: Check What Icon Is Used
Open the file:
platforms/android/app/src/main/res/values/themes.xml
Check that this exists:
<style name="Theme.App.SplashScreen" parent="Theme.SplashScreen">
<item name="windowSplashScreenAnimatedIcon">@drawable/splash_logo</item>
<item name="windowSplashScreenBackground">@color/splashscreen_background</item>
<item name="windowSplashScreenIconBackgroundColor">@color/splashscreen_icon_background</item>
</style>
If it still says `@drawable/splash`, it's using the default Cordova asset.
—
### ✅ Final Checklist
– ✅ You **placed `splash_logo.png`** manually inside `platforms/android/…/res/drawable/`
– ✅ Your `config.xml` references `@drawable/splash_logo`
– ✅ You're using Cordova **11+**
– ✅ You ran `cordova clean android` and rebuilt
– ✅ You removed `cordova-plugin-splashscreen`
—
Let me know if you want me to generate the proper drawable folders with resized splash icons automatically from a base image.
—
### ✅ Final Fix Steps
#### 1. ✅ Add this to `config.xml` to **disable fallback splash**:
Update your “ block by adding this line:
<preference name="SplashScreen" value="none" />
So it becomes:
<platform name="android">
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splash_logo" />
<preference name="AndroidWindowSplashScreenBackgroundColor" value="#007bff" />
<preference name="AndroidWindowSplashScreenIconBackgroundColor" value="#ffffff" />
<preference name="AndroidWindowSplashScreenDuration" value="3000" />
<preference name="SplashScreen" value="none" />
</platform>
This **tells Cordova not to fallback to its default icon** even if something goes wrong.
—
#### 2. 🧼 Clean Build and Force Re-add Platform
Sometimes, old build cache causes it to retain Cordova defaults. Do this:
cordova platform rm android
cordova clean
cordova platform add android
cordova build android
Then install and run the APK on a real device.
—
#### 3. 🧪 Test on Physical Device (not emulator)
Some emulators (especially API 30–33) cache splash icons. Test on a real device, or clear the app's data and reinstall.
—
Let me know if you want help converting a PNG into vector XML for sharper icon support on Android 12+.
Thenet
still showing cordova default spash icon
—
### ✅ Confirm These 5 Key Fixes
#### ✅ 1. Your custom image exists here:
File path:
platforms/android/app/src/main/res/drawable/splash_logo.png
> 🔥 **Must be copied manually**. Cordova does NOT auto-copy it from `www/` or `res/`.
File name must match exactly:
<preference name="AndroidWindowSplashScreenStaticIcon" value="@drawable/splash_logo" />
—
#### ✅ 2. Delete conflicting default Cordova splash icon
Delete this file if it exists (it causes fallback to default):
platforms/android/app/src/main/res/drawable/splash.png
—
#### ✅ 3. Completely remove the legacy splash plugin
If still installed:
cordova plugin rm cordova-plugin-splashscreen
Also make sure this tag is removed or set to `"none"`:
<preference name="SplashScreen" value="none" />
✅ You already have this correctly.
—
#### ✅ 4. Clean and rebuild from scratch
⚠️ Cordova caching often causes this issue.
Run:
cordova platform rm android
cordova clean
cordova platform add android
cordova build android
Then install the fresh APK on a real device.
—
#### ✅ 5. Confirm `theme.xml` and `styles.xml` using correct icon
Check file:
`platforms/android/app/src/main/res/values/themes.xml`
It should contain:
<style name="Theme.App.SplashScreen" parent="Theme.SplashScreen">
<item name="windowSplashScreenAnimatedIcon">@drawable/splash_logo</item>
<item name="windowSplashScreenBackground">@color/splashscreen_background</item>
<item name="windowSplashScreenIconBackgroundColor">@color/splashscreen_icon_background</item>
</style>
> If `@drawable/splash` is still present here — Cordova is falling back to default icon.
—
### ✅ Bonus: Want me to generate the exact correct folder structure + icons?
I can give you a downloadable zip with:
– Correct `splash_logo.png` sizes
– Proper folder structure for Android res
– Config you can drop directly into `platforms/android/app/src/main/res/`
Let me know!