CODEWITHSUNDEEP
androidsearchview
Mallika Khullar
Mallika Khullar

Reputation: 1813

Android SearchView - Move icon to right (without ActionBar)

I have an android SearchView like so - 

 <SearchView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:queryHint="Search the forum ..."
        android:iconifiedByDefault="true"
        android:id="@+id/search_forum"
        android:layout_alignParentRight="true"
        android:textColor="#aaa" />

This is not in my ActionBar, it's somewhere else in my activity.

I need the icon (the search icon) to stay on the right of my layout. On click it should expand into the SearchView (same behaviour as the ActionBar SearchView). I've tried android:layout_alignParentRight="true" but the icon stays to the left.

Any help would be great :)

Upvotes: 8

Views: 13096

Answers (7)

M N Dhanani
M N Dhanani

Reputation: 392

I've exactly same requirements for SearchView placed other than Toolbar, i.e. when collapsed search icon should be on right end side and when expanded it covers entire width.

I've tried out this solution for SearchView within RelativeLayout.

<androidx.appcompat.widget.SearchView
    android:id="@+id/searchView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentEnd="true" />

And handled OnSearchClickListener and OnCloseListener in code to toggle width between MATCH_PARENT and WRAP_CONTENT.

searchView.setOnSearchClickListener {
    val params = it.layoutParams as RelativeLayout.LayoutParams
    params.width = RelativeLayout.LayoutParams.MATCH_PARENT
    it.layoutParams = params
}

searchView.setOnCloseListener {
    val params = searchView.layoutParams as RelativeLayout.LayoutParams
    params.width = RelativeLayout.LayoutParams.WRAP_CONTENT
    searchView.layoutParams = params

    return@setOnCloseListener false
}

Upvotes: 0

Kristaps Buliņš
Kristaps Buliņš

Reputation: 1

Worked for me this way. I use Toolbar not ActionBar.

searchView.setLayoutParams(new Toolbar.LayoutParams(Gravity.RIGHT));

Upvotes: -1

Ali Ashraf
Ali Ashraf

Reputation: 1919

Try this:

 SearchView searchView =
       (SearchView) findViewById(R.id.search_view);
    searchView.setIconifiedByDefault(false);
    searchView.setIconified(false);

  ImageView searchViewIcon = (ImageView)searchView.findViewById(android.support.v7.appcompat.R.id.search_mag_icon);

    ViewGroup linearLayoutSearchView =
       (ViewGroup) searchViewIcon.getParent();
    linearLayoutSearchView.removeView(searchViewIcon);
    linearLayoutSearchView.addView(searchViewIcon);

Taken from here.

Upvotes: 0

Harish Bhagtani
Harish Bhagtani

Reputation: 149

I found a solution for this problem. Just set layout Direction to "rtl" and icon will be in Right Side. Here is the code for my search view and it is working as intended.

<SearchView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layoutDirection="rtl"
    android:iconifiedByDefault="true"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

Upvotes: 14

thelbrecht
thelbrecht

Reputation: 29

If the question is still unanswered:

Just move the SearchView into a RelativeLayout, and align it to the right side of the parent:

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.SearchView
    android:layout_width="wrap_content"
    android:id="@+id/searchView"
    android:layout_alignParentRight="true"
    android:layout_height="match_parent" />

The final result looks like this:

CardView with Linearlayout containing aligned SearchView

Upvotes: 2

David Veszelovszki
David Veszelovszki

Reputation: 2772

Adding the SearchView as a menu item instead of a Toolbar element inherently solves the problem.

An elegent way to do it:

Step 1 - add the search field to you toolbar: 

<item
    android:id="@+id/action_search"
    android:icon="@android:drawable/ic_menu_search"
    app:showAsAction="always|collapseActionView"
    app:actionViewClass="android.support.v7.widget.SearchView"
    android:title="Search"/>

Step 2 - add the logic to your onCreateOptionsMenu()

import android.support.v7.widget.SearchView; // not the default !

@Override
public boolean onCreateOptionsMenu( Menu menu) {
    getMenuInflater().inflate( R.menu.main, menu);

    MenuItem myActionMenuItem = menu.findItem( R.id.action_search);
    searchView = (SearchView) myActionMenuItem.getActionView();
    searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
        @Override
        public boolean onQueryTextSubmit(String query) {
            UserFeedback.show( "SearchOnQueryTextSubmit: " + query);
            if( ! searchView.isIconified()) {
                searchView.setIconified(true);
            }
            myActionMenuItem.collapseActionView();
            return false;
        }
        @Override
        public boolean onQueryTextChange(String s) {
            // UserFeedback.show( "SearchOnQueryTextChanged: " + s);
            return false;
        }
    });
    return true;
}

Source: https://stackoverflow.com/a/34255229/384564

Upvotes: 0

Mallika Khullar
Mallika Khullar

Reputation: 1813

I couldn't find an exact answer to this so I did this- Create an image view with search icon. Placed it on the right of my layout. On click, made the search view visible and set iconified false and requested focus for the search view.

I'd be so grateful if somebody could eventually help me find a proper solution for this.

Upvotes: 1

Related Questions