🌖 Edge-to-Edge

In meanwhile, here is an Android library for enabling edge-to-edge content and insetting views using simple Kotlin DSL.

Getting Started

Configure transparent colors of the status and navigation bars in res/values/styles.xml by extending a theme without the action bar like Theme.MaterialComponents.Light.NoActionBar or Theme.Design.Light.NoActionBar or similar.

<resources>
    <style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
        ...
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:windowTranslucentStatus">false</item>
        <item name="android:windowTranslucentNavigation">false</item>
        <item name="android:statusBarColor">@color/statusBar</item>
        <item name="android:navigationBarColor">@color/navigationBar</item>
    </style>
    
    <color name="statusBar">@android:color/transparent</color>
    <color name="navigationBar">@android:color/transparent</color>
</resources>

☝️ Note that fully transparent navigation bar can cause contrast issues to the navigation icons for API level [23..29). Check Navigation Bar Transparency wiki page for more details.

Remove android:fitSystemWindows attribute everywhere from layouts, if present.
Fit top and bottom views of each fragment or activity as needed.

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    edgeToEdge {
        appbar.fit { Edge.Left + Edge.Top + Edge.Right }
        recycler.fit { Edge.Bottom }
    }
    ...
}

See sample app for more edge-to-edge examples.

Download

repositories {
    mavenCentral()
}
dependencies {
    implementation 'de.halfbit:edge-to-edge:<version>'
}

How

The library is implemented around WindowInsets class. Each time WindowInsets are dispatched through out the view hierarchy, the library fits views according to the declared fitting rules.

Edge-to-Edge library fits each view to one or more device edges by modifying its padding, margin or height attribute with the values taken from the current WindowInsets. Padding and margin attributes preserve their original values defined in layout and inset values are added to them. The library "auto-detects" the attrbitute to modify, which can be overridden by using fitPadding, fitMargin or fitHeight convenience functions.

Features

Easiness of use - padding, margin or height can be adjusted to any edge with a single line of code.
Convenient default parameters for common elements like recycler view, scroll view, floating actions button etc.
Ability to remove fitting rules, which comes handy when working with transitions in ConstraintLayout.
Demo app with edge-to-edge examples (any kind of contribution is welcome).

Similar libraries

chrisbanes/insetter

License

Copyright 2020 Sergej Shafarenka, www.halfbit.de

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

sergejsha/edge-to-edge

sergejsha

Reviews

Repository Details