Foldable Samsung

Foldable is here, Users and Developers

Within the next few months, mobile devices will be introduced with new form factors. First of these form factors that will be offered in the market are foldable phones. Soon, various types of form factor devices will be released.

For upcoming new form factors on devices, the teams at Samsung and at Google Android hope that app developers will look first at this design guide as the first step.

App continuity

Users will be able to control multiple displays on one mobile device. The apps will be displayed on different screens to suit the user’s preferences, as they will be switched between the screens. As a result, apps are needed to be prepared to switch between multiple screens using different screen attributes (resolutions, densities, and etc).

Users also can unfold the device to have an immersive experience with the current task. Therefore when user unfolded the device, the current task must continue seamlessly into an unfolded display.

Multi-window

A bigger screen real estate on foldable devices renders multi-tasking into an engaging experience.

Android 7.0 supports displaying more than one app at the same time. In addition, when switching to a large screen such as a foldable phone case, users can use two or more apps on split-screen mode. There may be instances that the app may stop functioning whenever moving the focus from one to the other. To mitigate this, you will need to check the documentation on supporting the app with multi-resume in multi-active window mode of the device.

Technical

To make the best experience for foldable devices make sure your apps are ready to work seamlessly between two displays and be active in multi-window mode.

App continuity

Users unfold the device to have an immersive experience with the current task.

When unfolded, the current task must continue seamlessly into an unfolded display and vice-versa.

Multi-window

A bigger screen real estate on foldable devices renders multi-tasking into an engaging experience.

Android 7.0 and higher supports displaying more than one app at the same time. In addition, when switching to a large screen such as a foldable phone case, users can use two or more apps on split-screen mode. There may be instances that the app may stop functioning whenever moving the focus from one to the other. To mitigate this, you will need to check the documentation on supporting the app with multi-resume in multi-active window mode of the device.

App continuity


Figure 2 Seamless continuation when unfolded

Folding/unfolding triggers a configuration change for smallestScreenSize, screenSize and screenLayout.

This configuration change is similar with apps that are configured in multi-window mode. Even apps that does not support multi-window can be resized when a device gets folded or unfolded.

Whenever a configuration change occurs, the default case is that the whole activity is destroyed and recreated.

It is important to restore the previous state when the activity is restarted. To properly save and restore the previous state you can use onSaveInstanceState() and ViewModel object.

You can save the state in onSaveInstancesState() before your activity is destroyed and restore in onCreate() or onRestoreInstanceState().

If you want handling configuration change without restart, you need to add an android:configChanges attribute to your manifest with at least these values below.

With this attribute, you will need to manually update your view layout and reload resources in onConfigurationChaged().

<activity   
    android:name=".MyActivity"
    android:configChanges="screenSize|smallestScreenSize|screenLayout"
/>

Do not call finish() or kill the process by itself in the activity’s onDestroy(). This will cause the app to close when a device gets folded or unfolded.

Please refer to the detail in Android developer guide

Multi-resume

What is multi-resume ?

An app that is running in multi-window will be paused when not active in the previous Android versions.

With Android P (Pie), it provides a multi-resume functionality for all visible top activities if the app and OEM (Original Equipment Manufacturer) opts in.

Multi-resume is expected to become a mandatory behavior in Android Q.


Figure 3. The current behavior and the expected behavior with multi-resume

How can I make the app run in multi-resume?

Set the manifest flag to keep the app in a resumed state. This will allow the app to have resumed state even when it is not the topmost app.

Code Block 1 Manifest flag

<application>
  <meta-data
    android:name="android.allow_multiple_resumed_activities"
    android:value=”true” />
  <activity ... />
</application>

Note

More than one activity of the same app can be resumed.

Caution with singletons storing the resumed activity, including in frameworks you depend on

Other practices

Maximum aspect ratio

The cover display will have a long (21:9) aspect ratio.

So the application needs to handle a maximum aspect ratio to fill the entire screen.

The public guide is found in the Android developer site:

In the guideline, you can choose the following options to support aspect ratio.

  1. 1. Declare the target SDK version Apps that targets Android 8.0 (API level 26) or higher, they will fill the entire screen.
  2. 2. Declare the resizeableActivity If the activity is resizable, your Activity will fill the entire screen. Code Block 2 Set attribute in your manifest’s <activity> or <application> element android:resizeableActivity=["true" | "false"]
  3. 3. Declare a max aspect ratio For Android 7.1 and lower, add a <meta-data> element named android.max_aspect in the <application> element. Code Block 3 meta-data android.max_aspect <!-- Render on full screen up to screen aspect ratio of 2.4 --> <!-- Use a letterbox on screens larger than 2.4 --> <meta-data android:name="android.max_aspect" android:value="2.4" />

Note

If an app does not support a long aspect ratio (9:21), it may not be resized properly when unfolded in emulator environment. Please make sure the app support a long aspect ratio first before testing folding and unfolding.

Optimized layouts for cover display and main display

Now the app will run in both displays even with different sizes.

We recommend adding a separate resource folder to show more rich and clear content.

How to optimize layouts

Refer to the following link to get the default information about separate resource folder.

Reference display configuration

See the foldable device configurations below for each display.

Cover displayMain display
smallest width320 dp585 dp
screen size840 x 19601536 x 2152
screen layoutSCREENLAYOUT_SIZE_NORMAL
SCREENLAYOUT_LONG_YES
SCREENLAYOUT_SIZE_LARGE
SCREENLAYOUT_LONG_NO

Find out more here.

Leave a Reply

%d bloggers like this: