androidx.appcompat.widget.SearchView doesn't show up in toolbar

Question

I'm working on a personal Android application. In this application, there is a single main Activity with two Fragments. In one of them, I want to implement the Algolia InstantSearch according to this guide.

This is my fragment layout:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="0dp"
        android:layout_height="?attr/actionBarSize"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <androidx.constraintlayout.widget.ConstraintLayout
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:clipChildren="false"
            android:clipToPadding="false">

            <androidx.appcompat.widget.SearchView
                android:id="@+id/searchView"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:focusable="false"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:iconifiedByDefault="false"
                tools:queryHint="Hello"/>

        </androidx.constraintlayout.widget.ConstraintLayout>

    </androidx.appcompat.widget.Toolbar>

    <TextView
        android:id="@+id/stats"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:textAppearance="@style/TextAppearance.MaterialComponents.Caption"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toolbar" />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/memory_recyclerview"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_below="@+id/toolbar"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="@+id/stats">

    </androidx.recyclerview.widget.RecyclerView>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:padding="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="@+id/stats">

        <com.github.clans.fab.FloatingActionMenu
            android:id="@+id/add_memory_fab_menu"
            android:layout_width="297dp"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentBottom="true"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginBottom="10dp"
            android:clickable="true"
            app:menu_animationDelayPerItem="50"
            app:menu_backgroundColor="@android:color/transparent"
            app:menu_buttonSpacing="0dp"
            app:menu_colorNormal="@color/babyBlue"
            app:menu_colorPressed="@color/red"
            app:menu_colorRipple="#99FFFFFF"
            app:menu_fab_hide_animation="@anim/fab_slide_out_to_right"
            app:menu_fab_show_animation="@anim/fab_slide_in_from_right"
            app:menu_fab_size="normal"
            app:menu_icon="@drawable/ic_add_white_24dp"
            app:menu_labels_colorNormal="#333333"
            app:menu_labels_colorPressed="#444444"
            app:menu_labels_colorRipple="#66FFFFFF"
            app:menu_labels_cornerRadius="3dp"
            app:menu_labels_ellipsize="none"
            app:menu_labels_hideAnimation="@anim/fab_slide_out_to_right"
            app:menu_labels_margin="0dp"
            app:menu_labels_maxLines="-1"
            app:menu_labels_padding="8dp"
            app:menu_labels_paddingBottom="4dp"
            app:menu_labels_paddingLeft="8dp"
            app:menu_labels_paddingRight="8dp"
            app:menu_labels_paddingTop="4dp"
            app:menu_labels_position="left"
            app:menu_labels_showAnimation="@anim/fab_slide_in_from_right"
            app:menu_labels_showShadow="true"
            app:menu_labels_singleLine="false"
            app:menu_labels_textColor="#FFFFFF"
            app:menu_labels_textSize="14sp"
            app:menu_openDirection="up"
            app:menu_shadowColor="#66000000"
            app:menu_shadowRadius="4dp"
            app:menu_shadowXOffset="1dp"
            app:menu_shadowYOffset="3dp">

            <com.github.clans.fab.FloatingActionButton
                android:id="@+id/add_memory_fab_add"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_insert_comment_white_24dp"
                app:fab_label="Create Memory"
                app:fab_size="mini" />

            <com.github.clans.fab.FloatingActionButton
                android:id="@+id/add_memory_fab_search"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_search_white_24dp"
                app:fab_label="Search"
                app:fab_size="mini" />

            <com.github.clans.fab.FloatingActionButton
                android:id="@+id/add_memory_fab_logout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_logout_new_white_24dp"
                app:fab_label="Logout"
                app:fab_size="mini" />
        </com.github.clans.fab.FloatingActionMenu>
    </RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

The problem is the androidx.appcompat.widget.SearchView doesn't appear in the toolbar. Instead, the toolbar still with empty space.

How can I fix this? Feel free to ask for additional information.

Answer 1

You forget change width and height

Use this code

<androidx.appcompat.widget.SearchView
            android:id="@+id/searchView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:focusable="false"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:iconifiedByDefault="false"
            tools:queryHint="Hello"/>

Or if you want automatically fill parent when use ConstraintLayout you miss below line

app:layout_constraintEnd_toEndOf="parent" 

So you can use this code too

<androidx.appcompat.widget.SearchView
            android:id="@+id/searchView"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:focusable="false"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintEnd_toEndOf="parent" 
            app:iconifiedByDefault="false"
            tools:queryHint="Hello"/>