Android - Make whole search bar clickable - android

I am using a search-view element in my fragment to implement search feature.
<SearchView
android:id="#+id/search_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="7dp"
android:layout_marginLeft="7dp"
android:layout_marginRight="7dp"
android:layout_marginBottom="7dp"
android:background="#color/white" />
The problem is only the search icon is clickable other area in the search bar is not clickable, when i click the icon only i can able to search.
Can you please help me to make the whole search area clickable.

This can be simply done by setting Iconified to false on OnClick of SearchView.
searchBar.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
searchBar.setIconified(false);
}
});
Reference: Eric Lui's answer
Hopefully it will help.
UPDATE:
You can also use it directly in your XML
app:iconifiedByDefault="false"

search_bar.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
search_bar.onActionViewExpanded();
}
});

The trick isn't so much to make the entire area clickable as much as it is to expand it and then hide the keyboard.
First, your layout in the XML is fine, leave it as is, in your Java, you want to have the following:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_activity);
//Define your Searchview
SearchView searchView = (SearchView) findViewById(R.id.search_bar);
//Turn iconified to false:
searchView.setIconified(false);
//The above line will expand it to fit the area as well as throw up the keyboard
//To remove the keyboard, but make sure you keep the expanded version:
searchView.clearFocus();
}
What this accomplishes is it expands the keyboard to the entire length of the area, it focuses on it, which allows the entire area to be clickable, and then it removes the keyboard so that it looks to the user like they are able to click that field and bring up a keyboard.
Should accomplish what you are looking for.
-Sil

add this to your xml android:iconifiedByDefault="false" it will keep
open your searchview.
and to clear it add clearfocus to your searchview object.

What is the clickable mean? trigger search action or just make the edit area focused? If it is the first, you can just make the icon clickable=false. and make the whole layout clickable and implement a event listener.
<SearchView
android:id="#+id/search_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:click="onClick"
android:layout_marginTop="7dp"
android:layout_marginLeft="7dp"
android:layout_marginRight="7dp"
android:layout_marginBottom="7dp"
android:background="#color/white" />
The onClick method should be
public void onClick(View v) {
  InputMethodManager im = ((InputMethodManager) getSystemService(INPUT_METHOD_SERVICE));
im.showSoftInput(editText, 0);
}

For latest versions of android -
Try:
app:iconifiedByDefault="false"
Example -
<android.support.v7.widget.SearchView
android:id="#+id/source_location_search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginTop="15dp"
android:layout_marginRight="20dp"
app:iconifiedByDefault="false"
app:queryHint="Your hint text" />

searchView.setIconified(false);

Just write it in xml
android:iconifiedByDefault="false"
Worked for me

Write the lines of code given below in your Java file:
SearchView searchView = (SearchView) findViewById(R.id.searchView);
searchView.setQueryHint("Enter your address");
searchView.setIconified(false);
searchView.clearFocus();
After that, don't forget to write android:focusable="true" in your XML file inside SearchView tag.
For example:
<SearchView
android:id="#+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusable="true" />

Use This
searchView.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View v)
{
searchView.onActionViewExpanded();
OR
searchView.setIconified(false);
}
});
searchView.setOnQueryTextFocusChangeListener(new View.OnFocusChangeListener()
{
#Override
public void onFocusChange(View view, boolean b)
{
if(!b)
{
if(searchView.getQuery().toString().length() < 1)
{
searchView.setIconified(true); //close the search editor and make search icon again
OR
searchView.onActionViewCollapsed();
}
searchView.clearFocus();
}
}
});

in code:
private void initSearchView(View layout) {
// Locate the EditText in listview_main.xml
searchInput = (SearchView) layout.findViewById(R.id.search);
//searchInput.onActionViewExpanded();//force show keyboard at start
//==>region to enable search after click in input-text(not only at magnifier icon)
searchInput.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
searchInput.onActionViewExpanded();
}
});
searchInput.setOnQueryTextFocusChangeListener(new View.OnFocusChangeListener() {
#Override
public void onFocusChange(View view, boolean b) {
if (!b) {
if (searchInput.getQuery().toString().length() < 1) {
searchInput.setIconified(true);
}
searchInput.clearFocus();
}
}
});
//endregion
}
and in my layout:
<androidx.appcompat.widget.SearchView
android:id="#+id/search"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar_main"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="2dp"
android:background="#drawable/search_border"
android:inputType="text"
android:layoutDirection="ltr"
android:searchSuggestThreshold="2"
app:queryHint="#string/search"
app:searchHintIcon="#null" />

Use the below code.
<androidx.appcompat.widget.SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/earningSearchView"
app:queryHint="Search"
app:iconifiedByDefault="false"
app:queryBackground="#android:color/transparent"/>

So recently I've had to do this and I tried all the answers provided but each had some dodgy behaviour - for example the x close/erase all button would only show up if you'd clicked on the search icon, otherwise you'd be able to edit etc. but you would only see the x as an erase all button.
Looking at the SearchView's code I noticed that clicking the mSearchButton calls onSearchClicked() and not the suggested onActionViewExpanded(), but the former is a package private function so it can't be called directly. So I came up with this:
private val searchButton by lazy { searchView.findViewById<ImageView>(R.id.search_button) }
searchView.setOnClickListener { searchButton.callOnClick() }
This way you get the same behaviour no matter where you click and you don't need to manually set the iconified property in either the xml or programatically.

What you ask can be done as follows
For the first click in the bar we use the method onClick of the SearchView to expand it.
public void onClick(View v) {
SearchView searchView = (SearchView) v;
searchView.setIconified(false);
}
When it doesn't have the focus then we collapse the SearchView.
Also for the next clicks on the bar, onClick just doesn't work, so we used onFocusChange to expand SearcView too.
final SearchView searchView = findViewById(R.id.searchView);
searchView.setOnQueryTextFocusChangeListener(new View.OnFocusChangeListener() {
#Override
public void onFocusChange(View view, boolean b) {
if (b) {
searchView.setIconified(false);
}
if (!b) { // Not have focus
if (searchView.getQuery().toString().length() < 1) {
searchView.setIconified(true);
}
searchView.clearFocus();
}
}
});

Related

Android Search View to remove cross icon

I am using the search view in custom Toolbar according to my design, I am having another cross icon, so I want to remove the cross icon for search view them on default provided by android.
<SearchView
android:id="#+id/search_learning_fragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:queryHint="#string/toolBar_hint"
android:clickable="true"
android:searchIcon="#null"
android:paddingTop="#dimen/element_padding_small"
android:focusable="false"
android:paddingBottom="#dimen/element_padding_small"
android:background="#color/White"
android:queryBackground="#color/White"
android:iconifiedByDefault="false"
android:layout_alignParentTop="true">
</SearchView>
ImageView searchViewIcon = (ImageView)searchView.findViewById(R.id.search_close_btn);
searchViewIcon.setVisibility(View.GONE);
Toast.makeText(CustomSearchActivity.this, ""+searchViewIcon, Toast.LENGTH_SHORT).show();
Use this to do so-
searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
#Override
public boolean onQueryTextChange(String query) {
ImageView searchViewIcon = (ImageView)searchView.findViewById(android.support.v7.appcompat.R.id.search_close_btn);
searchViewIcon.setVisibility(View.GONE);
return true;
}
});

After collapse SearchView disappear from toolbar

I create small example to show my issue.
Main layout with SearchView in toolbar and 3 buttons:
1) Set text - expand search view and set query
2) Expand - expand search view
3) Collapse - collapse search view
activity_main.xml
android:fitsSystemWindows="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical"
tools:context="com.porn.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="368dp"
android:layout_height="wrap_content"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:contentInsetStartWithNavigation="0dp">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<Button
android:id="#+id/setTextBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set text" />
<Button
android:id="#+id/expandBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Expand" />
<Button
android:id="#+id/collapseBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Collapse" />
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity {
private MenuItem toolbarSearchMenuItem;
private SearchView toolbarSearchView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Toolbar
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowTitleEnabled(false);
findViewById(R.id.expandBtn).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
toolbarSearchMenuItem.expandActionView();
}
});
findViewById(R.id.collapseBtn).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
toolbarSearchMenuItem.collapseActionView();
}
});
findViewById(R.id.setTextBtn).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
setToolbarSearchQuery("Text2");
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toobar, menu);
toolbarSearchMenuItem = menu.findItem(R.id.toolbar_action_search);
toolbarSearchView = (SearchView) menu.findItem(R.id.toolbar_action_search).getActionView();
init();
return true;
}
public void init() {
//In real app i get searchQuery from extra
//String searchQuery = getIntent().getStringExtra(INTENT_EXTRA_SEARCH_QUERY_KEY);
setToolbarSearchQuery("Text from intent");
}
private void setToolbarSearchQuery(String searchQuery) {
if (!searchQuery.equals("")) {
toolbarSearchMenuItem.expandActionView();
toolbarSearchView.setQuery(searchQuery, false);
toolbarSearchView.clearFocus();
} else {
toolbarSearchMenuItem.collapseActionView();
}
}
}
My problem appears when i call method init() from onCreateOptionsMenu (In real app i init SearchView with text from intent extra). If i call setToolbarSearchQuery method from init and after i click collapse button SearchView collapsed and search icon disappear.
But if i will not call init method and will call same method setToolbarSearchQuery with set text button it works correctly (SearchView is collapsed and search icon shown in toolbar).
How i can solve this problem? And why icon disappear after collapse?
I understood that it happens when i expand SearchView from onCreateOptionsMenu. But how i can correct init SearchView from intent extra?
Screenshot how it looks after collapse
Screenshot how it must looks after collapse
The "anton111111" answer works perfectly, but just for those who don't want to use delay, I recommend change search menu item showAsAction property as below:
android:showAsAction="always|collapseActionView"
instead of
android:showAsAction="ifRoom|collapseActionView"
See original answer here.
I found only one solution. Set text in init method delayed.
public void init() {
//setToolbarSearchQuery("Text from intent");
final Handler handler = new Handler();
handler.postDelayed(new Runnable() {
#Override
public void run() {
toolbarSearchMenuItem.expandActionView();
toolbarSearchView.setQuery("Text from intent", false);
}
}, 1000);
}
But i don't like this solution. It looks like trick.

Android SearchView change cursor position after hint icon

I am using android.support.v7.widget.SearchView and the hint icon is at the left of the cursor as shown in the image .
But i want to make the cursor begins after the hint search icon .
XML:
<android.support.v7.widget.SearchView
android:id="#+id/airlines_searchView"
android:iconifiedByDefault="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:onClick="EnableSearchView"
android:background="#fbf7f7"
/>
I got the EditText of the search view as following :
EditText search_text=(EditText) searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text);
and i don't know what are the required properties to set to it .
I checked That but no solutions found, any help please ?
Have to change the android:iconifiedByDefault to app:iconifiedByDefault
and add those two lines to avoid launching the keyboard on starting the activity and it is shown only after clicking searchview
android:focusable="false"
android:focusableInTouchMode="true"
So Try this:
<android.support.v7.widget.SearchView
android:id="#+id/airlines_searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:imeOptions="actionDone"
android:textStyle="normal"
android:layout_marginTop="15dp"
android:background="#fbf7f7"
android:focusable="false"
android:focusableInTouchMode="true"
app:iconifiedByDefault="false"/>
Set search view iconified by default to false on click and to true on close the search view
searchView.setOnSearchClickListener( new View.OnClickListener() {
#Override
public void onClick(View v) {
searchView.setIconifiedByDefault( false );
}
} );
searchView.setOnQueryTextListener( new android.support.v7.widget.SearchView.OnQueryTextListener() {
#Override
public boolean onQueryTextSubmit(String query) {
//do search
}
#Override
public boolean onQueryTextChange(String newText) {
//do search
}
} );
searchView.setOnCloseListener( new android.support.v7.widget.SearchView.OnCloseListener() {
#Override
public boolean onClose() {
searchView.setIconifiedByDefault( true );
}
} );
<android.support.v7.widget.SearchView
android:id="#+id/airlines_searchView"
app:iconifiedByDefault="false"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:background="#fbf7f7"
/>
Instead of android:iconifiedByDefault="false" set app:iconifiedByDefault="false"

Soft Keyboard doesn't show on focus

I have a small function to open the soft keyboard when a EditText is programmatically focused as shown here...
public void getUserName() {
EditText tv = (EditText)findViewById(R.id.user_info_name);
tv.setOnFocusChangeListener(new View.OnFocusChangeListener() {
#Override
public void onFocusChange(View view, boolean b) {
if (b) {
showDialog("Focused!");
getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_VISIBLE);
}
}
});
tv.selectAll();
tv.requestFocus();
}
However, the soft keyboard doesn't appear automatically but the dialog DOES show stating focused. In order to get the keyboard to appear I have to click inside the EditText.
My XML is as follows...
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:id="#id/user_info_name"
android:editable="true"
android:hint="#string/user_info_name"
android:inputType="textCapWords|textPersonName"
android:textColor="#color/blue_gray"
android:maxLength="50"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:enabled="true"
android:focusable="true"
android:focusableInTouchMode="true" />
Can someone please advise why it's not working or what I am missing / failing to address.
Thanks in advance as always.
SOLVED: The following change to the function fixed the issue...
public void getUserName() {
EditText tv = (EditText)findViewById(R.id.user_info_name);
tv.selectAll();
tv.requestFocus();
InputMethodManager imm = (InputMethodManager)this.getSystemService(this.INPUT_METHOD_SERVICE);
imm.showSoftInput(tv,InputMethodManager.SHOW_IMPLICIT);
}

Setting iconified to false on android SearchView cause view to not be searchable

This question is a follow up to Show android SearchView EditText by default. My SearchView used to work fine until I added android:iconifiedByDefault="false" to the layout. Now, when I click on the icon or type in the search field, no search takes place. Does anyone know how to fix this problem? here is my SearchView as it exists now.
<SearchView
android:id="#+id/search"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:queryHint="#string/search_hint"
android:iconifiedByDefault="false"
android:textSize="16sp" />
I already tried the following:
mSearch.setOnSearchClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
getActivity().onSearchRequested();
//other stuff happen here
}
});
I solved the problem with
public void onFocusChange(View v, boolean hasFocus) {
if (hasFocus) { ...}
}
i solve this problem by simply adding requestFocus tag in SearchView widget.
<SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/search"
android:clickable="true"
android:queryHint="Enter Song name.."
android:iconifiedByDefault="false">
<requestFocus/>
</SearchView>

Categories

Resources