Add camera icon in SearchView on Android

Question

I´m going to try to explain, although my English is a bit bad.

Estoy utilizando MaterialSearchView de Miguel Catalan: MaterialSearchView

I'm new to StackOverflow and they do not let me upload images. I will try to explain it. The main screen of my application has a MaterialSearchView in the Toolbar. After pressing the search icon, it takes me to the text box where you can search

I`d like to put a camera icon to the right of the 'X' of the SerchView.

Can anybody help me? Or tell me some other search component that allows you to add icons in the search bar when searching?

EDIT

I have got the solution. It is not the most professional way, but it is valid. In the SearchView control, I have put two images, one for the X to delete the searched text (The original icon stays behind the camera) and another for the camera (both invisible).

layout/app_bar_home.xml:

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

            <ImageView android:id="@+id/imgClearSearch"
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:layout_gravity="right"
                android:src="@drawable/ic_close_grease_small"
                android:visibility="invisible"
                android:layout_marginTop="18dp"
                android:layout_marginRight="50dp" />

            <ImageView
                android:id="@+id/imgCamera"
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="right"
                android:src="@drawable/ic_menu_camera"
                android:visibility="invisible"
                android:layout_marginTop="14dp"
                android:layout_marginRight="8dp"
                />
        </com.miguelcatalan.materialsearchview.MaterialSearchView>

Then, in the java class, in the listener, we show images when the searcher is shown, and hide them when hiding the searcher.

    //Creamos los listeners de los buscadores
    searchView = (MaterialSearchView) findViewById(R.id.searchView);
    searchView.setVoiceSearch(false);
    searchView.setOnQueryTextListener(new MaterialSearchView.OnQueryTextListener() {
        @Override
        public boolean onQueryTextSubmit(String query) {

            //Cuando pulsamos en buscar
            String aa = "";

            return false;
        }

        @Override
        public boolean onQueryTextChange(String newText) {

            //Cuando teclemamos en el buscador
            String aa = "";

            if (newText.length() > 20)
                searchView.setQuery(newText.substring(0, 20), false);

            return false;
        }
    });
    searchView.setOnSearchViewListener(new MaterialSearchView.SearchViewListener() {
        @Override
        public void onSearchViewShown() {

            imgCamera.setVisibility(View.VISIBLE);
            imgClearSearch.setVisibility(View.VISIBLE);

            //ImageView searchClose = (ImageView) searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
            //searchClose.setImageResource(R.drawable.ic_close_white);
            Drawable closeIcon = getResources().getDrawable(R.drawable.ic_close_white);
            searchView.setCloseIcon(closeIcon);

            //Cuando mostramos el buscador
            String aa = "";
        }

        @Override
        public void onSearchViewClosed() {

            //Cuando cerramos el buscador (tras haber buscado)
            String aa = "";
            imgCamera.setVisibility(View.INVISIBLE);
            imgClearSearch.setVisibility(View.INVISIBLE);
        }
    });

The only problem is that the X that was displayed by default to clean the text of the searcher was still showing, so I did a little trick. I replaced the icon that came out by default with a white one, so it is not visible. I've put that on the line:

            Drawable closeIcon = getResources().getDrawable(R.drawable.ic_close_white);
            searchView.setCloseIcon(closeIcon);

Este es el resultado:

Answer 1

I have got the solution. It is not the most professional way, but it is valid. In the SearchView control, I have put two images, one for the X to delete the searched text (The original icon stays behind the camera) and another for the camera (both invisible).

layout/app_bar_home.xml:

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

            <ImageView android:id="@+id/imgClearSearch"
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:layout_gravity="right"
                android:src="@drawable/ic_close_grease_small"
                android:visibility="invisible"
                android:layout_marginTop="18dp"
                android:layout_marginRight="50dp" />

            <ImageView
                android:id="@+id/imgCamera"
                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="right"
                android:src="@drawable/ic_menu_camera"
                android:visibility="invisible"
                android:layout_marginTop="14dp"
                android:layout_marginRight="8dp"
                />
        </com.miguelcatalan.materialsearchview.MaterialSearchView>

Then, in the java class, in the listener, we show images when the searcher is shown, and hide them when hiding the searcher.

    //Creamos los listeners de los buscadores
    searchView = (MaterialSearchView) findViewById(R.id.searchView);
    searchView.setVoiceSearch(false);
    searchView.setOnQueryTextListener(new MaterialSearchView.OnQueryTextListener() {
        @Override
        public boolean onQueryTextSubmit(String query) {

            //Cuando pulsamos en buscar
            String aa = "";

            return false;
        }

        @Override
        public boolean onQueryTextChange(String newText) {

            //Cuando teclemamos en el buscador
            String aa = "";

            if (newText.length() > 20)
                searchView.setQuery(newText.substring(0, 20), false);

            return false;
        }
    });
    searchView.setOnSearchViewListener(new MaterialSearchView.SearchViewListener() {
        @Override
        public void onSearchViewShown() {

            imgCamera.setVisibility(View.VISIBLE);
            imgClearSearch.setVisibility(View.VISIBLE);

            //ImageView searchClose = (ImageView) searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
            //searchClose.setImageResource(R.drawable.ic_close_white);
            Drawable closeIcon = getResources().getDrawable(R.drawable.ic_close_white);
            searchView.setCloseIcon(closeIcon);

            //Cuando mostramos el buscador
            String aa = "";
        }

        @Override
        public void onSearchViewClosed() {

            //Cuando cerramos el buscador (tras haber buscado)
            String aa = "";
            imgCamera.setVisibility(View.INVISIBLE);
            imgClearSearch.setVisibility(View.INVISIBLE);
        }
    });

The only problem is that the X that was displayed by default to clean the text of the searcher was still showing, so I did a little trick. I replaced the icon that came out by default with a white one, so it is not visible. I've put that on the line:

            Drawable closeIcon = getResources().getDrawable(R.drawable.ic_close_white);
            searchView.setCloseIcon(closeIcon);

Result in my own question