Is it in the Gluon API to keep our app in Portrait Mode even if the user rotates their device in Landscape Mode?

Question

After styling my app in portrait mode, I've discovered its layout is not acceptable should the user manipulate their phone to invoke the app into landscape mode. I can put in the time later to rewrite/retest the UX for both portrait and landscape mode, but for the time being is the a way for us to have our app hold portrait mode all the time?

Answer 1

There is no API or Attach service for this yet. However you can modify the AndroidManifest.xml file (Android) or the Default-Info.plist file (iOS) to force one single orientation, instead of the existing portrait and landscape ones.

Android

See https://docs.gluonhq.com/#_android_2 for reference.

The AndroidManifest.xml file is generated for the project with the gluonfx:package goal, and it is available at target/gluonfx/aarch64-android/gensrc/android.

Copy this file to src/android and make any modification needed:

• Portrait

<?xml version='1.0'?>
<manifest xmlns:android='http://schemas.android.com/apk/res/android' package='$your_package' android:versionCode='1' android:versionName='1.0'>
    <application android:label='$your_label' android:icon="@mipmap/ic_launcher">
        <activity android:name='com.gluonhq.helloandroid.MainActivity'
    android:configChanges="orientation|keyboardHidden" 
    android:screenOrientation="portrait">
             <intent-filter>
                <category android:name='android.intent.category.LAUNCHER'/>
                <action android:name='android.intent.action.MAIN'/>
             </intent-filter>
        </activity>
</manifest>

• Landscape

<?xml version='1.0'?>
<manifest xmlns:android='http://schemas.android.com/apk/res/android' package='$your_package' android:versionCode='1' android:versionName='1.0'>
    <application android:label='$your_label' android:icon="@mipmap/ic_launcher">
        <activity android:name='com.gluonhq.helloandroid.MainActivity' 
    android:configChanges="orientation|keyboardHidden" 
    android:screenOrientation="landscape">
             <intent-filter>
                <category android:name='android.intent.category.LAUNCHER'/>
                <action android:name='android.intent.action.MAIN'/>
             </intent-filter>
        </activity>
</manifest>

Then run again gluonfx:package, the final manifest will contain the changes.

iOS

See for reference https://docs.gluonhq.com/#_ios_2.

The configuration is defined by the keys UISupportedInterfaceOrientations and UISupportedInterfaceOrientations-ipad. By default with values:

        <key>UISupportedInterfaceOrientations</key>
        <array>
                <string>UIInterfaceOrientationPortrait</string>
                <string>UIInterfaceOrientationLandscapeLeft</string>
                <string>UIInterfaceOrientationLandscapeRight</string>
                <string>UIInterfaceOrientationPortraitUpsideDown</string>
        </array>
        <key>UISupportedInterfaceOrientations~ipad</key>
        <array>
                <string>UIInterfaceOrientationPortrait</string>
                <string>UIInterfaceOrientationLandscapeLeft</string>
                <string>UIInterfaceOrientationLandscapeRight</string>
                <string>UIInterfaceOrientationPortraitUpsideDown</string>
        </array>

Add the file src/main/resources/META-INF/substrate/ios/Partial-Info.plist and include this code:

• Portrait

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
        <key>UISupportedInterfaceOrientations</key>
        <array>
                <string>UIInterfaceOrientationPortrait</string>
                <string>UIInterfaceOrientationPortraitUpsideDown</string>
        </array>
        <key>UISupportedInterfaceOrientations~ipad</key>
        <array>
                <string>UIInterfaceOrientationPortrait</string>
                <string>UIInterfaceOrientationPortraitUpsideDown</string>
        </array>
</dict>
</plist>

• Landscape

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
        <key>UISupportedInterfaceOrientations</key>
        <array>
                <string>UIInterfaceOrientationLandscapeLeft</string>
                <string>UIInterfaceOrientationLandscapeRight</string>
        </array>
        <key>UISupportedInterfaceOrientations~ipad</key>
        <array>
                <string>UIInterfaceOrientationLandscapeLeft</string>
                <string>UIInterfaceOrientationLandscapeRight</string>
        </array>         
</dict>
</plist>

Then run mvn gluonfx:link again, the final plist will contain these changes.