Exploring WindowInsets on Android 11
Android 11 Developer Preview 2 introduced a long-awaited feature: the ability to synchronize the app’s content with the IME (soft keyboard) and system bars as they animate on and offscreen, instead of having the view simply jump on top of the keyboard when it opens.
After reading about this feature, I went on to try to replicate the animations shown on the Android Developers blog announcement (shown above) and in this post I’ll show you the necessary steps.
But before diving into these new features, we are going to discuss some changes introduced to WindowInsets on Android 11, which will be useful later on.
WindowInsets API changes
Previously, when working with WindowInsets (like when implementing edge-to-edge) you had to call several methods on the WindowInsetsclass like getSystemWindowInsets or getSystemGestureInsets .
In Android 11 these methods are deprecated and are instead replaced by a single getInsetsmethod on the WindowInsetsclass. This method accepts as a parameter the type of insets that we’re interested in, which are listed on the WindowInsets.Typeclass. For example, we can request the system window insets like so:
IME insets
One of the most requested features was the ability to query the visibility and position of the Android keyboard on screen, often requiring strange workarounds.
Fortunately, now there is a new inset type for the IME, which can be accessed by using the ime type, like so (check out the great Twitter thread from Chris Banes):
systemUiVisibility changes
Previously, when implementing edge-to-edge navigation or immersive mode, one of the first steps to take was to use the systemUiVisibility flags in order to request the app to be laid out fullscreen, like so
This new Android release deprecates this field and in order to layout the app fullscreen you have to use a new method on the Window class: setDecorFitsSystemWindows passing false as argument (if you pass true it will continue to work like on previous releases, checking the value of the now deprecated systemUiVisibility ).
Android 11 also introduces a new WindowInsetsController class which allows you to do things that previously were controlled via systemUiVisibility flags, like hiding or showing the status bar or navigation bar ( hide and show methods, respectively), or customizing their appearance and behavior (for example, if a single tap reveals them if they are hidden).
For example, you can easily show and hide the keyboard as shown below:
Synchronizing IME transition
Now we are going to talk about the new IME features introduced in the second developer preview, but first I’d like to note that these new features might not be able to run on older versions of Android via AndroidX, according to this Twitter thread (apparently the reason is that these changes also depend on changes made on the platform).
First, we are going to explore how you can synchronize the app’s content with the IME, instead of simply having the content jump over the keyboard.
For this the first step is to request the app to be laid out fullscreen, like shown above:
We then can make our navigation bar transparent in order to make the app layout fill the whole screen, we can define this in our theme like so
For more information on this, you can check out Chris Bane’s post.
Now, in order to synchronize the app content with the IME, there’s a new method setWindowInsetsAnimationCallback on the View class, which accepts an instance of a new WindowInsetsAnimation.Callback class, which gives us updated insets frame by frame, enabling smooth animations.
In the example above, we register the callback and in the onProgress method, which is called multiple times as the IME animation is running, we get its height and use it to calculate the new layout bottom margin.
Control IME
Apps can now control the soft keyboard (IME) and system bar transitions by using a new WindowInsetsAnimationController class. For example, an app can take control of the IME in response to overscrolling its UI.
In this example and in order to replicate the animation shown below, we are going to have a ScrollView with some items hidden so it can scroll up.
The first step is to request control over the IME. We can do that by calling the controlWindowInsetsAnimation method of the WindowInsetsController class. We have to specify the inset type that we want to control (in this case, the IME), the animation duration (-1 in this case since we don’t have any predefined duration), an interpolator if needed (null in this case) and a listener which will notify us when the inset is ready to be controlled.
In our example, we can call the method as follows (make sure to call the method when the view is attached to the window. For example, you can call it when the user starts scrolling in the ScrollView):
Then we have to define the listener, which is a class implementing the WindowInsetsAnimationControlListener interface.
When the onReady method of the listener is called we can store the animation controller in order to be able to control the IME later.
Now all that’s left is to listen to scroll changes on the ScrollView and to synchronize that with the keyboard. For that we need to call the setInsetsAndAlpha method of the WindowInsetsAnimationController specifying the insets for the IME (in this case, all values are 0 except from the bottom inset, which is equal to the vertical scroll of the ScrollView), an alpha value and a fraction value specifying the animation progress (1 to indicate that the animation has finished).
Conclusion
Android 11 introduces useful and highly requested APIs, like the ability to request the visibility and position of the soft keyboard, as well as easily showing and hiding it.
The new APIs to synchronize the IME with the app layout can make app animations smoother when working with keyboards.
As we are still on the preview stage, all these APIs are subject to change. However, by looking at the APIs as they are defined right now, it seems Android 11 will make our life much easier when dealing with window insets.
