Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MaterialToolbar incorrect height after adaption on edge-to-edge enforcement of Android 15 #4464

Open
ArcherEmiya05 opened this issue Dec 11, 2024 · 0 comments

Comments

@ArcherEmiya05
Copy link

ArcherEmiya05 commented Dec 11, 2024

Description:
MaterialToolbar height is incorrect for phone size devices after adapting to edge-to-edge enforcement for Android 15.

Phone (Portrait)
Screenshot 2024-12-11 at 4 28 55 AM

Phone (Landscape)
image

Expected behavior:
Correct MaterialToolbar height on both portrait and landscape orientation for phone size devices, tablet size devices are fine.

Tablet (Portrait)
image

Tablet (Landscape)
image

Source code:

XML layout (Phone portrait)

<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".presentation.MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|snap"
            app:menu="@menu/activity_main_overflow"
            app:title="@string/home"
            app:subtitle="@string/assets"
            app:titleCentered="true"
            app:subtitleCentered="true" />

    </com.google.android.material.appbar.AppBarLayout>

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <androidx.fragment.app.FragmentContainerView
            android:id="@+id/nav_host_fragment_content_main"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:defaultNavHost="true"
            app:navGraph="@navigation/main_navigation" />

    </FrameLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:menu="@menu/bottom_navigation_menu"
        app:layout_behavior="com.devsbitwise.android.material.utils.BottomNavigationBehavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

XML layout (Tablet portrait)

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".presentation.MainActivity">

    <androidx.drawerlayout.widget.DrawerLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/drawer_layout"
        tools:openDrawer="start">

        <androidx.coordinatorlayout.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <com.google.android.material.appbar.AppBarLayout
                android:id="@+id/appBar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <com.google.android.material.appbar.MaterialToolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:layout_scrollFlags="scroll|snap"
                    app:menu="@menu/activity_main_overflow"
                    app:title="@string/home"
                    app:subtitle="@string/assets"
                    app:titleCentered="true"
                    app:subtitleCentered="true" />

            </com.google.android.material.appbar.AppBarLayout>

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_behavior="@string/appbar_scrolling_view_behavior">

                <androidx.fragment.app.FragmentContainerView
                    android:id="@+id/nav_host_fragment_content_main"
                    android:name="androidx.navigation.fragment.NavHostFragment"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    app:defaultNavHost="true"
                    app:navGraph="@navigation/main_navigation" />

            </FrameLayout>

        </androidx.coordinatorlayout.widget.CoordinatorLayout>

        <com.google.android.material.navigation.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/header_nav_main"
            app:menu="@menu/activity_main_drawer" />

    </androidx.drawerlayout.widget.DrawerLayout>

</FrameLayout>

Activity with inset adjustment

ViewCompat.setOnApplyWindowInsetsListener(toolBar) { v: View, insets: WindowInsetsCompat ->
    val barInset = insets.getInsets(WindowInsetsCompat.Type.systemBars())
    // Add padding to this view based on status bar inset
    v.updatePadding(top = barInset.top)
    WindowInsetsCompat.CONSUMED
}

XML (style)

    <!-- Toolbar style on both light and night mode -->
    <style name="MDCToolbar" parent="Widget.Material3.Toolbar.Surface" tools:keep="@style/MDCToolbar">
        <item name="contentInsetStart">0dp</item>
        <item name="contentInsetEnd">0dp</item>
        <item name="contentInsetStartWithNavigation">0dp</item>
        <item name="materialThemeOverlay">@style/ThemeOverlay.MDC.Toolbar</item>
    </style>

    <style name="ThemeOverlay.MDC.Toolbar" parent="" tools:keep="@style/ThemeOverlay_MDC_Toolbar">
        <!-- Background color -->
        <item name="colorSurface">@color/mdc_colorWhite_Primary</item>
        <!-- Title and Navigation icon color -->
        <item name="colorOnSurface">@color/mdc_colorPrimaryDark_White</item>
        <!-- Subtitle and Action item color -->
        <item name="colorOnSurfaceVariant">@color/mdc_colorPrimaryDark_White</item>
        <!-- Action item and Overflow menu color when `colorOnSurfaceVariant` is not working -->
        <!-- Drawer icon and Navigation icon also use this -->
        <item name="colorControlNormal">@color/mdc_colorPrimaryDark_White</item>
    </style>
<style name="Theme.Cryptonian" parent="Theme.Material3.DayNight">
     <item name="toolbarStyle">@style/MDCToolbar</item>
</style>

Minimal sample app repro:
N/A

Android API version:
5.0 and above

Material Library version:
1.12.0

Device:
AVD/Emulators

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants