Implement Flex Mode on a Video Player
implement flex mode on a video player objective learn how to implement flex mode on a video player app using android jetpack windowmanager overview the galaxy z fold4, or its previous versions, is a foldable phone with a vertical axis that opens like a book at the same time, the galaxy z flip4, or its predecessors, folds horizontally, dividing its screen into upper and lower sections when the phone is partially folded, it is called flex mode unfolding the phone will return the apps in full-screen mode in flex mode, the app's ui separates its controls on the bottom from the rest of the content on the top to fit the partially folded screen when the phone is unfolded, window components reoccupy their original positions to fit the full-screen mode, like usual smartphones it gives an outstanding experience on camera, video calls, multimedia, and other apps to provide users with a convenient and versatile foldable experience, developers need to optimize their apps to meet the flex mode standard set up your environment you will need the following java se development kit jdk 8 or later android studio latest version recommended samsung galaxy foldable device galaxy z fold2, z fold3, or newer galaxy z flip, z flip3, or newer remote test lab if physical device is not available requirements samsung account java runtime environment jre 7 or later with java web start internet environment where port 2600 is available sample code here is a sample code for you to start coding in this code lab download it and start your learning experience! flex mode sample code 15 60 mb start your project after downloading the sample code containing the project files, open your android studio and click open to open an existing project locate the downloaded android project videoplayer-main from the directory and click ok add the maven repository and windowmanager library windowmanager, a new jetpack library introduced by google, helps application developers support new device form factors to add a dependency on windowmanager, you must first add the maven central repository to the project go to gradle scripts > build gradle project video_player and enter the following in the allprojects block mavencentral then, go to gradle scripts > build gradle module video_player app and add the windowmanager library to the dependencies block implementation "androidx window window 1 0 0" implementation 'androidx lifecycle lifecycle-runtime-ktx 2 6 1' set up a flow to collect data from windowlayoutinfo in the mainactivity kt, add a lifecycle-aware coroutine to obtain information from windowlayoutinfo the coroutine executes each time the lifecycle starts lifecyclescope launch dispatchers main { lifecycle repeatonlifecycle lifecycle state started { windowinfotracker getorcreate this@mainactivity windowlayoutinfo this@mainactivity collect { newlayoutinfo -> updatestateandfeatureviews newlayoutinfo } } } noteupdatestateandfeatureviews is a user-defined function and is not included in the windowmanager library in this code lab, it needs to be called to check the device posture determine the device posture and update the ui next, in the updatestateandfeatureviews function, check the current posture of the device and update the ui accordingly for flex mode when the device is currently folded, the displayfeatures is null if newlayoutinfo displayfeatures isempty when the device is currently in flex mode or partially folded, the device posture is half_opened using the device posture and orientation, implement your flex mode ui if it state == foldingfeature state half_opened && it orientation == foldingfeature orientation vertical { updateuiforfold }else if it state == foldingfeature state half_opened && it orientation == foldingfeature orientation horizontal { updateuiforflip } notethe device orientation of a galaxy fold device is vertical, whereas a galaxy flip's device orientation is horizontal when the device is unfolded, the device posture is flat else if it state == foldingfeature state flat run the app after building the apk, you can run the optimized video player app on a foldable galaxy device and see how it adapts when the device is on flex mode however, if you don't have a physical device, you can test it on a remote test lab device watch the video below and know how to test your app via remote test lab tipfor a better testing experience using remote test lab, choose a device from a location near you you're done! congratulations! you have successfully achieved the goal of this code lab now, you can implement flex mode in your app by yourself! if you're having trouble, you may download this file flex mode complete code 9 07 mb to learn more about developing apps for galaxy foldable devices, visit www developer samsung com/galaxy-z