A ListView overlaps a SearchView in a CoordinatorLayout

Question

I'm fixing an app after the AndroidX migration, and I had a very odd bug that my ListView was not being loaded on the onCreate/onStart/onResume events:

A ListView is not displaying any data on OnCreate/OnStart after AndroidX migration

By matter of chance, I decided to "simplify" my layout and removed a LinearLayout that contained the ListView. After this change, the data was loaded properly because it seems LinearLayout was somehow blocking the getView event. However, after this change, the SearchView is being overlapped by the ListView, and I don't know how to put them in the right order (first the SearchView followed by the ListView).

This is how it looks now:

This is my code:

other_ruins.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_weight="1"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <include layout="@layout/search_container" />
        <ListView
            android:id="@+id/lstOtherRuins"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:nestedScrollingEnabled="true"
            android:layout_margin="8dp"
            android:layout_height="match_parent"
            android:layout_width="match_parent"
            android:choiceMode="singleChoice"
            android:layout_below="@id/toolbar_container"
            android:layout_gravity="left|start" />
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
    <com.google.android.gms.ads.AdView
        android:id="@+id/adView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:adSize="SMART_BANNER"
        app:adUnitId="@string/banner_ad_unit_id" />
</LinearLayout>

search_container.xml:

<?xml version="1.0" encoding="UTF-8" ?>
<FrameLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar_container"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        app:theme="@style/ToolBarStyle"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary" />

    <com.miguelcatalan.materialsearchview.MaterialSearchView
        android:id="@+id/search_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</FrameLayout>

Regarding, the search_container I tested also using the AppBarLayout and crashed the app; therefore, it's not a solution.

Any idea how can I fix it? And why is this happening? If you know how to fix the previous issue and somehow call the getView event on the onCreate/onStart/onResume events is another solution.

Answer 1

In my case, I needed to wrap my FrameLayout with a AppBarLayout make it work properly, when I didn´t do it, it duplicates the toolbar creating an strange shadow. This is the final change:

<?xml version="1.0" encoding="UTF-8" ?>
<com.google.android.material.appbar.AppBarLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            app:theme="@style/ToolBarStyle"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorPrimary" />

        <com.miguelcatalan.materialsearchview.MaterialSearchView
            android:id="@+id/search_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </FrameLayout>

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

Only one of them breaks the app.