Skip to content

Instantly share code, notes, and snippets.

@gabouh
Created March 25, 2016 10:50
Show Gist options
  • Save gabouh/1ea5f7a1887414f1fd80 to your computer and use it in GitHub Desktop.
Save gabouh/1ea5f7a1887414f1fd80 to your computer and use it in GitHub Desktop.
NativeScript Splash Screen for Android
File from app/App_Resources/Android/AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="__PACKAGE__"
android:versionCode="1"
android:versionName="1.0">
<supports-screens
android:smallScreens="true"
android:normalScreens="true"
android:largeScreens="true"
android:xlargeScreens="true"/>
<uses-sdk
android:minSdkVersion="17"
android:targetSdkVersion="__APILEVEL__"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.INTERNET"/>
<application
android:name="com.tns.NativeScriptApplication"
android:allowBackup="true"
android:icon="@drawable/icon"
android:label="@string/app_name"
android:theme="@style/SplashTheme" >
<activity
android:name="com.tns.NativeScriptActivity"
android:label="@string/title_activity_kimera"
android:configChanges="keyboardHidden|orientation|screenSize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name="com.tns.ErrorReportActivity"/>
</application>
</manifest>
File from app/app.js
var application = require("application");
// check the current platform (we are interested in android only)
// alternatively, you may have app.android.js and app.ios.js
var platform = require("platform");
if(platform.device.os === platform.platformNames.android) {
application.onLaunch = function(intent) {
// hook the onActivityCreated callback upon application launching
application.android.onActivityCreated = function(activity) {
// apply the default theme once the Activity is created
// Changing the SplashTheme for AppTheme
var id = activity.getResources().getIdentifier("AppTheme", "style", activity.getPackageName());
activity.setTheme(id);
}
}
}
application.start({ moduleName: "main-page" });
File from platforms/android/src/main/res/values/styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
<item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>
<item name="colorPrimary">@color/ns_primary</item>
<item name="colorPrimaryDark">@color/ns_primaryDark</item>
<item name="colorAccent">@color/ns_accent</item>
</style>
<style name="SplashThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowFullscreen">false</item>
<item name="android:windowActionBar">true</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowContentOverlay">@null</item>
<item name="android:windowBackground">@drawable/splashscreen</item>
</style>
<style name="AppTheme" parent="AppThemeBase">
</style>
<style name="SplashTheme" parent="SplashThemeBase">
</style>
<style name="NativeScriptToolbarStyleBase" parent="Widget.AppCompat.Toolbar">
<item name="android:background">@color/ns_primary</item>
<item name="theme">@style/ThemeOverlay.AppCompat.ActionBar</item>
<item name="popupTheme">@style/ThemeOverlay.AppCompat</item>
</style>
<style name="NativeScriptToolbarStyle" parent="NativeScriptToolbarStyleBase">
</style>
</resources>
@petermeester
Copy link

Does someone has a solution for this issue?

@SaurabhC92
Copy link

I have solved the problem by replacing the splashscreen.9.png inside drawable-nodpi by another image

@felixkrautschuk
Copy link

felixkrautschuk commented Jun 29, 2016

I build the my App via Telerik AppBuilder and for iOS, the Splashscreen is shown automatically correct (without additional changes), only for Android it shows just a white screen. So I thought using the steps mentioned here would help, but unfortunately I end up with this:

screenshot_20160629-154433

I tested this on many different devices with different screens and Android versions, always the same result.
Has anybody found a solution for that?

EDIT
I just forgot the part from app.js.
After adding this code, I got the black strip, but only for the default splashscreen. I don't have this problem anymore with my custom Splash Screen.
So the code works perfect, it was just my fault!

@toniclecb
Copy link

toniclecb commented Jul 4, 2016

I solved the problem with black strip by changing parent in:
<style name="SplashThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
I used:
parent="android:Theme.Light"

I have another problem now. I am using nativescript-local-notifications, when the user click on the notification (and app is closed) the app open, but application.android.onActivityCreated isn't called.

@devna13
Copy link

devna13 commented Jul 7, 2016

works 👍 Thank you

@dpdragnev
Copy link

Thank you. Works great The only difference for me was that I had to put the styles.xml in the app/App_Resources/Android/values (creating values manually).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment