Develop Reference

The space between the back button and the search view is too much - is it possible to reduce it on the toolbar?

toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content" xmlns:card_view="http://schemas.android.com/tools"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:background="#color/colorPrimary"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="center"
app:theme="#style/ToolBarStyle">
<TextView
android:id="#+id/toolbar_title"
style="#style/style_toolbar_textView" />
</android.support.v7.widget.Toolbar>
<View style="#style/style_toolbar_shadow" />
</LinearLayout>
menu_events_ppl_list.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/menuSearchId"
app:showAsAction="always"
android:icon="#drawable/search_material"
android:title="#string/str_search"
app:actionViewClass="android.support.v7.widget.SearchView" />
</menu>
code
/** Init On create options menu **/
private fun initOnCreateOptionsMenu(menu: Menu) {
val inflater: MenuInflater = menuInflater
inflater.inflate(R.menu.menu_events_ppl_list, menu)
val search = toolbar.menu.findItem(R.id.menuSearchId).actionView as SearchView
search.queryHint = "Search People";
//search.setOnQueryTextListener(this);
search.isIconified = false
search.maxWidth = Integer.MAX_VALUE;
}
What I am trying to display
What is displaying
Space between back button and search view is more in android, is it possible to reduce it ?

By default, Toolbar have 16dp inset after backbutton. So, include app:contentInsetStartWithNavigation="0dp" in Toolbar, it will remove that whitespace.
<androidx.appcompat.widget.Toolbar
..........
..........
app:contentInsetStartWithNavigation="0dp"
..........
..........
</androidx.appcompat.widget.Toolbar>
The original answer is here

Change showAsAction of the menu xml. This is exactly what you are looking for.
app:showAsAction="ifRoom|collapseActionView"

SearchView AutoComplete is appearing with Black border and covering the searchtext?

Image how the searchView autocomplete is appearing
The searchView AutoComplete is appearing with black border as shown in image and I haven't made any custom layout still it is showing that black border and hiding the text.Below the code is also attached that I have used.`
getMenuInflater().inflate(R.menu.main, menu);
this.menu = menu;
menuItem = menu.findItem(R.id.action_search);
searchView = (SearchView) MenuItemCompat.getActionView(menuItem);
menuItem.setVisible(false);
final SearchView.SearchAutoComplete searchAutoComplete =
searchView.findViewById(android.support.v7.appcompat.R.id.search_src_text);
searchAutoComplete.setDropDownBackgroundResource(android.R.color.white);
searchAutoComplete.setDropDownAnchor(R.id.action_search);
ArrayAdapter<String> searchadapter = new ArrayAdapter<String>(this,
android.R.layout.simple_dropdown_item_1line,
all_products);
searchAutoComplete.setAdapter(searchadapter);
`
Menu Code It is the Item that is used for opening search option.
<item android:id="#+id/action_search"
android:title="#string/action_search"
android:icon="#drawable/ic_search_white_24dp"
app:showAsAction="collapseActionView|ifRoom"
app:actionViewClass="android.support.v7.widget.SearchView"/>
AppBar layout Code It is the code made for Creating the App Action Bar But how this is affecting the search autocomplete to appear black border around it and hiding the search text.
<android.support.design.widget.AppBarLayout
android:id="#+id/main_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipChildren="false"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
app:theme="#style/CustomActionBar">
<TextView
android:layout_width="wrap_content"
android:textColor="#FFF"
android:textSize="18sp"
android:textStyle="bold"
android:layout_height="wrap_content"
android:text="Avrutti Electronics"/>
<ProgressBar
android:id="#+id/progressBar4"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_marginTop="10dp"
android:layout_height="35dp"/>
<requestFocus />
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/main_tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:visibility="visible"
app:tabMode="scrollable"
app:tabSelectedTextColor="#color/colorAccent" />
</android.support.design.widget.AppBarLayout>

I Found my Question answer It is problem because I was trying to override the theme Appcompat.light through
searchAutoComplete.setDropDownBackgroundResource(android.R.color.white);
So as soon as I removed this statement the border was removed.

From my observations, this is caused by the theme you're using ThemeOverlay.AppCompat.Dark.ActionBar. Change your themes to something that have ...Light.ActionBar in its its name Or simply modify your theme in styles.xml and add the following snippet to it.
<item name="android:dropDownItemStyle">#style/myDropDownItemStyle</item>
<item name="android:dropDownListViewStyle">#style/myDropDownListViewStyle</item>

Android Action Bar with editText on separate line in Fragment

So began researching how to create an action bar with an autocomplete text view for search. Most of the solutions I've found come close to what I'm looking for however they all seem to be focused on cramming any and additional views added to the action bar on one line.
Further complicating this, is the fact that this is all located in a view pager fragment whose parent activity already has an action bar. Thus using the setSupportingActionBar call with a Toolbar throws an illegal state exception.
Not sure if what I am accomplishing is actually supported but here it goes.
The end result I am looking for is this
Here is what I wrote
*custom view containing the autocomplete text view named autocomplete.xml *
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/search_text_view"
android:paddingTop="15dp"
android:paddingBottom="15dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:drawableLeft="#drawable/ic_search_blue"
android:background="#drawable/white_edittext"/>
</LinearLayout>
here is the code in my fragment used to setup the action bar
private void initializeActionsBarWithAutocomplete(){
ActionBar actionBar = ((MyParentActivity) getActivity()).getSupportActionBar();
actionBar.setTitle(getResources().getString(R.string.default_title));
View autoCompleteView = LayoutInflater.from(getContext()).inflate(R.layout.autocomplete, null);
mSearchTextView = (AutoCompleteTextView) autoCompleteView.findViewById(R.id.search_text_view);
mSearchTextView.setAdapter(mTypeAheadAdapter);
mSearchTextView.setOnItemClickListener(this);
mSearchTextView.addTextChangedListener(this);
actionBar.setCustomView(autoCompleteView);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(true);
actionBar.setDisplayHomeAsUpEnabled(true);
}
What I end up getting is this
So assuming what I'm trying to do is possible, and I'm at least on the right track, what exactly is going wrong here. I assumed that having the custom view match parent would force the textview to take up its own line and expand the size of the action bar accordingly. That is clearly not the case. I looked at some articles that allowed you to set the height of the action bar explicitly but from what I can comprehend, that method will result in the same appearance with a bunch of white space under views in the action bar.

You can use Toolbar widget in XML and customize it as per your needs.
Here is an layout of Toolbar containing AutoCompleteTextView:
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:titleTextColor="#FFFFFF">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="20dp">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="#string/app_name"
android:textColor="#ffffff"
android:textSize="20sp"
android:textStyle="bold" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_margin="8dp"
android:layout_centerInParent="true"
cardview:cardBackgroundColor="#ffffff"
cardview:cardCornerRadius="2dp"
cardview:cardElevation="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:focusableInTouchMode="true">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/search_text_view"
android:paddingTop="15dp"
android:paddingBottom="15dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:drawableLeft="#drawable/ic_search_blue"
android:background="#drawable/white_edittext"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
In your JAVA code try this:
Toolbar mToolBar;
ActionBar mActionBar;
AutoCompleteTextView mSearchTextView;
private void initializeActionsBarWithAutocomplete(){
// ToolBar
mToolBar = (Toolbar) findViewById(R.id.toolbar);
// AutoCompleteTextView
mSearchTextView = (AutoCompleteTextView) mToolBar.findViewById(R.id.search_text_view);
mSearchTextView.setAdapter(mTypeAheadAdapter);
mSearchTextView.setOnItemClickListener(this);
mSearchTextView.addTextChangedListener(this);
setSupportActionBar(mToolBar);
// ActionBar
mActionBar = getSupportActionBar();
mActionBar.setTitle(getResources().getString(R.string.default_title));
mActionBar.setDisplayHomeAsUpEnabled(true);
}
OUTPUT:
Hope this will help~

ActionBar doesn't fully hide (only does the text & buttons)

I've searched for solutions but don't seem to find any answer for my issue. I navigated several potential solutions I found here but all of them ended up with the same issue.
Context: I have a FragmentContainer that holds a Viewpager with RecyclerView in each page. When I click an item in the RecyclerView, it opens a new different FragmentContainer2 with a ViewPager that holds the detail of the selected card and I can swipe reading the different cards.
What I want to do: when I select an item in the RecyclerView, I want the appBar GONE.
Problem: when I hit any item of the RecyclerView and the new ViewPager loads, the appBar buttons and title are gone, but not the background!
Here there are two screenshots of the states of appBar in one ViewPager and the other:
FragmentContainer that holds a ViewPager with a RecyclerView:
FragmentContainer that holds a ViewPager with the news detail:
METHOD TO SHOW AND HIDE TOOLBAR/FLOATING ACTION BUTTON:
public void setToolbarAndFabVisibility(Boolean trueOrFale){
ActionBar actionBar = getSupportActionBar();
if(trueOrFale!=null){
if(trueOrFale){
if (actionBar != null) {
actionBar.show();
}
fab.setVisibility(View.VISIBLE);
}else{
if (actionBar != null) {
actionBar.hide();
}
fab.setVisibility(View.GONE);
}
}
}
activity_main.xml:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimaryDark">
<include layout="#layout/app_bar_main"/>
<android.support.design.widget.NavigationView
android:id="#+id/navigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
app:headerLayout="#layout/nav_header"
app:menu="#menu/menu" />
app_bar_main.xml:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<include layout="#layout/toolbar"/>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab_pressed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:elevation="20dp"
android:src="#drawable/favourite_button"
app:fabSize="mini"
app:layout_anchor="#id/fragment_container"
app:layout_anchorGravity="bottom|right|end" />
Both xml are closed with appropiate tags. For some reason preview here doesn't show.
Any idea where I might be failing? I have everything in one activity.
Let me know if there's anything else I can post here that might help. Thanks for taking the time.
EDIT;
sorry, I forgot to include the toolbar.xml:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="16dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways|snap">
<Button
android:id="#+id/favourites_button"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="end"
android:layout_marginEnd="16dp"
android:background="#drawable/favourite_button" />
<Button
android:id="#+id/bookmarked_button"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="end"
android:layout_marginEnd="16dp"
android:background="#drawable/bookmarked_button" />
<Button
android:id="#+id/history_button"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="end"
android:layout_marginEnd="16dp"
android:background="#drawable/ic_history_white_24dp" />

use this:
getWindow().requestFeature(Window.FEATURE_ACTION_BAR);
getActionBar().hide();

My guess is that you are dealing with two action bars:
One is provided by the system through a theme like #style/ThemeOverlay.AppCompat.Dark.ActionBar
and the other is declared in your app_bar_main.xml.
getSupportActionBar().hide() only hides the action bar that is provided by the system.
Check the theme that is set in the application manifest and consult the documentation at https://developer.android.com/training/appbar/setting-up.html

if
getActionbar().hide();
getActionbar().show();
doesn't work then try
getSupportActionBar().hide();
getSupportActionBar().show();
It will work.or try to use toolbar

I was issuing this same problem. ActionBar was being overridden and that's why it leaves a black gap when hide() is called.
Fix:
styles.xml:
<style name="Theme.AppCompat.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
AndroidManifest.xml:
<activity android:name="com.stonetree.supercart.controller.activities.SuperCart"
android:theme="#style/Theme.AppCompat.NoActionBar"></activity>
<activity
Make sure to call on your manifest the proper style name which has windowActionBar set to false.
Activity.xml:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"></android.support.v7.widget.Toolbar>
Add Toolbar to your layout. Make sure to call dependencies to compile android.support.v7.widget.
compile 'com.android.support:appcompat-v7:23.1.1'
Watch out for version and further minor details. Moving on...
Activity.java:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity);
Toolbar myToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(myToolbar);
}
In my case, my menu was separated on xml. A custom menu.
Menu.xml:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/itemId"
android:icon="#android:drawable/stat_notify_sync"
android:title="Menu item"
app:showAsAction="collapseActionView" />
</menu>
Also call on Activity.java:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.supercart_app_bar, menu);
return super.onCreateOptionsMenu(menu);
}
Now Toolbar has your custom layout from Menu.xml - Just call hide() or show() wherever your want and the Bar will act like visibility is set to View.GONE and View.VISIBLE.

Tollbar with a notification count

Hello I'm using a Tollbar and inside I added some drawable items in the menu options. What I want is to put a number inside those drawable. Like the image below
View post on imgur.com
I know there are other post related to this but not with a Toolbar and I need to is a Toolbar.
Thank you

The simpliest way is to use TextView with star background:
<TextView
android:id="#+id/notification"
android:layout_width="#dimen/notification_width"
android:layout_height="#dimen/notification_height"
android:background="#drawable/bg_star"
android:gravity="center"
android:textColor="#android:color/white"
tools:text="5" />
You can use obvious TextView's setText() method to set or hide notification text.
To add this layout to your Toolbar use Android menu's app:actionLayout parameter:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<item
android:id="#+id/action_notifications"
app:actionLayout="#layout/view_notification"
app:showAsAction="always" />
</menu>
And in your Activity inflate menu like this:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.notification_menu, menu);
return true;
}

<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="#color/action_bar_bkgnd"
app:theme="#style/ToolBarTheme" >
<TextView
android:background="#drawable/bg_star"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Toolbar Title"
android:id="#+id/notification"
android:layout_gravity="center"
android:id="#+id/toolbar_title" />
</android.support.v7.widget.Toolbar>
Toolbar toolbarTop = (Toolbar) findViewById(R.id.toolbar_top);
TextView mTitle = (TextView) toolbarTop.findViewById(R.id.toolbar_title);