I am creating an app and re-building a control in Xamarin.Android. The control works as expected, but I noticed if I choose android:layout_height="wrap_content"
the Elevation is gone:
But if I choose the android:layout_height="match_parent"
it works as expected:
You might ask, then why don't you use match_parent
and the reason is that this control is a Search Bar and part of blocks its regular working:
Since all buttons that you saw they became inaccessible because the Search Bar took full ownership of the view and it's irrelevant where I click I can see only the options:
The code of the CardView
or that section of the code is the following one:
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:ignore="ContentDescription"
xmlns:tools="http://schemas.android.com/tools">
<android.support.v7.widget.CardView
android:id="@+id/mt_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
app:cardBackgroundColor="@color/searchBarPrimaryColor"
app:cardCornerRadius="2dp"
app:cardElevation="2dp"
app:cardPreventCornerOverlap="false">
<RelativeLayout
android:id="@+id/root"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/mt_menu"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="true"
android:padding="12dp"
android:scaleType="centerCrop"
android:src="@drawable/ic_dots_vertical_black_48dp"
android:visibility="gone"
android:focusable="true" />
<ImageView
android:id="@+id/mt_nav"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="?selectableItemBackgroundBorderless"
android:clickable="true"
android:scaleType="center"
android:visibility="visible"
app:srcCompat="@drawable/ic_menu_black_24dp"
android:focusable="true" />
<TextView
android:id="@+id/mt_placeholder"
android:layout_width="wrap_content"
android:layout_height="48dp"
android:layout_marginLeft="16dp"
android:layout_toLeftOf="@+id/mt_search"
android:layout_toRightOf="@+id/mt_nav"
android:fontFamily="sans-serif"
android:gravity="center_vertical"
android:maxLines="1"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="@color/searchBarPlaceholderColor"
android:textStyle="bold"
android:visibility="visible"
tools:text="PlaceHolder"
android:layout_marginStart="16dp"
android:layout_toStartOf="@+id/mt_search"
android:layout_toEndOf="@+id/mt_nav" />
<LinearLayout
android:id="@+id/inputContainer"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_toStartOf="@+id/mt_menu"
android:layout_toLeftOf="@+id/mt_menu"
android:gravity="center_vertical"
android:orientation="horizontal"
android:visibility="gone">
<ImageView
android:id="@+id/mt_arrow"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="?attr/selectableItemBackground"
android:clickable="true"
android:padding="12dp"
android:src="@drawable/ic_arrow_left_black_48dp"
android:visibility="visible"
android:focusable="true" />
<EditText
android:id="@+id/mt_editText"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
android:background="@android:color/transparent"
android:hint="@string/action_search"
android:imeOptions="flagNoExtractUi|actionSearch"
android:inputType="text"
android:maxLines="1"
android:textAppearance="?android:attr/textAppearanceMedium"
android:visibility="visible"/>
<ImageView
android:id="@+id/mt_clear"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="?selectableItemBackgroundBorderless"
android:padding="12dp"
android:src="@drawable/ic_close_black_48dp" />
</LinearLayout>
<RelativeLayout
android:id="@+id/last"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:layout_marginTop="48dp">
<View
android:id="@+id/mt_divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/searchBarDividerColor" />
<android.support.v7.widget.RecyclerView
android:id="@+id/mt_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
<ImageView
android:id="@+id/mt_search"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="?selectableItemBackgroundBorderless"
android:clickable="false"
android:padding="12dp"
android:scaleType="centerCrop"
android:src="@drawable/ic_magnify_black_48dp"
android:visibility="visible" />
<View
android:id="@+id/mt_menu_divider"
android:layout_width="1dp"
android:layout_height="48dp"
android:layout_alignParentRight="true"
android:layout_marginRight="48dp"
android:background="@color/searchBarDividerColor"
android:clickable="false"
android:visibility="gone"
android:layout_alignParentEnd="true"
android:layout_marginEnd="48dp" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</merge>
And this is how I invoke the control in my XML:
<tk.supernovaic.MaterialSearchBar.MaterialSearchBar
android:id="@+id/searchBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
app:mt_navIconEnabled="true"
app:mt_placeholder="@string/HeaderByTime" />
were*What have I tried so far?**
I tried to add the elevation manually to the previous control and it didn't work:
android:elevation="9dp"
Also, I tried to set a specific height:
android:layout_height="52dp"
And then the results were not displayed.
If you want to go deeper into the control you can check my repository:
https://github.com/FANMixco/Xamarin-SearchBar/tree/master/tk.supernovaic.MaterialSearchBar
Also, this is the code where I based my own version: