Sometimes your application needs to be a full screen reserving all the available space in the screen. You can implement this functionality in native script Vue using with 2 ways.

1. From Source code

implement this function in the mounted() method of your activity.

if (app.android) {
const activity = app.android.startActivity;
const win = activity.getWindow();
win.addFlags(android.view.WindowManager.LayoutParams.FLAG_FULLSCREEN);
}

Change your android manifest theme as follows.

<activity
android:name=".Launch"
android:label="@string/app_name"
android:theme="@android:style/Theme.NoTitleBar.Fullscreen" > <!-- Add this line -->

<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>

2. From Android Styles

In AndroidManifest.xml:

<activity
android:name="ui.activity.MainActivity"
android:theme="@style/FullScreenTheme">
</activity>

In styles.xml:

<style name="FullScreenTheme">
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:windowFullscreen">true</item>
</style>

You can use any of the above methods for implementing full-screen functionality. Usually, games and Splash screen has full-screen themes. For making your overall application fullscreen use the second approach and implement the FullScreenTheme as a major theme in your application inside AndroidManifest.xml.

Leave a Reply

Your email address will not be published. Required fields are marked *