Toolbar logo taking up too much space - android

Im dealing with a strange toolbar behavior in which if I set a logo with
getSupportActionBar().setLogo(R.drawable.logo_toolbar);
The Toolbar components (in my case the logo itself and the title) get disaligned from the standard gravity start behavior.
This is my toolbar:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/grey_900"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways"/>
The toolbar has a SearchView at the right and no "home button", only title.
Graphic explanation:
1) Behavior without calling setLogo(...)
2) Behavior when calling setLogo(...)
3) What I'm trying to achieve
I've already tried playing with gravity but nothing happened.
Also, please, I know that Toolbar is a ViewGroup and I can customize it, but I'm looking for a clean code, also this should be a default behavior and but it isn't working so I would like to know if I'm doing something wrong.
How can I fix this? Thanks in advance!

getSupportActionBar().setTitle("Home");
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setLogo(R.mipmap.ic_launcher);
getSupportActionBar().setDisplayUseLogoEnabled(true);
If you use getSupportActionBar , No need to use toolbar again.

Related

Toolbar doesn't flip the custom navigation icon arrow when switching to right-to-left layouts(Arabic)

I am using right to left support for my app. I have a custom arrow set to toolbar as the navigation icon. When I switch to arabic language, everything aligns to right including the toolbar custom navigation arrow. But the problem is the custom navigation icon is not flipping, that is it should be pointing to the right instead of left(default). This works fine with the default indicator if I dont specify any navigation icon. Have anyone encountered this?
Any solution?
Here is my code for the toolbar
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
app:elevation="0dp"
app:navigationIcon="#drawable/ic_back"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:logo="#drawable/ic_logo"
android:gravity="center_vertical|start"
>
in Activity
Toolbar toolbar = (Toolbar) findViewById(R.id.tb_venue_filter);
setSupportActionBar(toolbar);
setDisplayHomeAsUpEnabled(true);
If you are on android API 21+, you can just flip your icon by adding android:autoMirrored="true" to your vector icon or layer-list XML icon, this will alleviate the hasle of adding it to every toolbar manually, but if you want to support 21- versions you will have to go with the accepted answer.
This is a feature of the Drawable, not so much the Toolbar.
Try with:
toolbar.getNavigationIcon().setAutoMirrored(true);

Setting toolbar title not working in onCreate()

I am having issues setting the title of my toolbar, which only seems to work when there is a delay.
For example a simple oncreate() method for my app 'Forecast'
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
setSupportActionBar(_toolbar);
setTitle("ABCDEFG");
}
When the app is run, the toolbar has the name of my app, not 'ABCDEFG'.
However, if I put a 200 millisecond delay before setting the title..
Observable.just("ABCDEFG")
.delay(200,TimeUnit.MILLISECONDS)
.observeOn(AndroidSchedulers.mainThread())
.subscribe(this::setTitle);
My Toolbar title is correctly displayed as "ABCDEFG"
this is the same when it comes to doing anything with the Toolbar, does anyone know what is actually going on here? and how I can solve this without having to put a delay in?
Here is my toolbar xml..
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
Thanks for your help!
EDIT forgot to mention setTitle() simply calls _toolbar.setTitle(title)
If you call setSupportActionBar(Toolbar), then the Action Bar is then responsible for handling the title, therefore you need to call getSupportActionBar().setTitle("My Title"); to set a custom title.
Also check this link where toolbar.setTitle("My title"); may cause problem like below:- In android app Toolbar.setTitle method has no effect – application name is shown as title
And toolbar is the general form of action bar.
We can have multiple toolbars as layout widget but action is not.
Thus better approach is to use getSupportActionBar().setTitle("My Title");
As maRShmallow stated, I changed _toolbar.setTitle() to getSupportActionBar().setTitle()

How to create two SearchViews in the Toolbar in Android

I would like to have two search views inside a toolbar in one of my activities: the first for looking up the place of interest and the second for filtering by location.
The searchViews would be on top of each other always expanded. The top one would say "Search" as the hint. The bottom one would say "Nearby" as the hint. To the left would be the home button.
I have come up with two ways that could potentially work but I have encountered problems in both and I don't know how to resolve them.
First Solution (Current)
Here I have a linear layout and inside is a android.support.v7.widget.Toolbar, a view, and followed by a second Toolbar.
This is essentially what I want it to look like but the problem is that changing the hint text in onCreateOptionsMenu changes BOTH hints. I would like the top to say "Search" and the bottom to say "Nearby". It seems that because there are two toolbars, onCreateOptionsMenu affects both of them.
Code:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/search_container"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/search_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar">
</android.support.v7.widget.Toolbar>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginLeft="72dp"
android:background="#90909090"/>
<android.support.v7.widget.Toolbar
android:id="#+id/search_toolbar2"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
app:contentInsetStart="56dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar">
</android.support.v7.widget.Toolbar>
<include
layout="#layout/toolbar_action_bar_shadow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"/>
</LinearLayout>`
onCreate:
Toolbar toolbar2 = (Toolbar) findViewById(R.id.search_toolbar2);
setSupportActionBar(toolbar2);
Toolbar toolbar = (Toolbar) findViewById(R.id.search_toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(false);
getSupportActionBar().setDisplayShowTitleEnabled(false);
OnCreateOptionsMenu:
SearchView searchViewTop = (SearchView) MenuItemCompat.getActionView(menu.findItem(R.id
.search_top));
SearchManager searchManager1 = (SearchManager) getActivity().getSystemService(Context
.SEARCH_SERVICE);
searchViewTop.setSearchableInfo(searchManager1.getSearchableInfo(getActivity()
.getComponentName()));
searchViewTop.setIconified(false);
searchViewTop.onActionViewExpanded();
searchViewTop.setQueryHint("Nearby");
Second Solution (Old)
The second method involves putting a searchView instead of a second toolbar in the xml file. Although the second searchview isn't inside the toolbar, it can be made to look like it is. The problem I encountered with this is that the searchView not inside the toolbar looks different from the searchView inside the toolbar and how I would like it. When not inside the toolbar, the hint text is aligned further to the right and not directly underneath the top hint text. Any new text entered inside the searchview would be aligned correctly however. I tried customizing the style of the searchview to align it properly but was unable to find a correct method.
I was wondering if there is a way to correct either of my methods to make it work or if there is a new way to setup these two searchViews. Thanks.
I realized that when you call setSupportActionBar() for more than one toolbar, changes in onCreateOptionsMenu affect all the toolbars added. To solve this problem, I just called setSupportActionBar only on my top toolbar. For the bottom toolbar, I called in onCreate
toolbar2.inflateMenu(R.menu.search2);
SearchView searchViewBottom = (SearchView)findViewById(R.id.search_bottom);
searchViewBottom.onActionViewExpanded();
Then handle all actions inside with setOnMenuItemClickListener.

How to make Toolbar transparent and put an image backwards it?

I want the ToolBar to be transparent. I have an Activity that is showing a Toolbar and looks like this:
I have this on my xml:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent" />
</android.support.design.widget.AppBarLayout>
But I can't make my Activity be on top and be visible at the back of my ToolBar...
How can I achieve this?
StackOverflow does not allow me to comment because I don't have 50 reputation that why I am commenting in answer box
You can find you answer here:
How to make the support Toolbar background transparent?
How to make Toolbar transparent?
#RAP's answer seems work. But note that if you set the background to transparent, means that the toolbar is still clickable when user touch on it and doing some actions you don't want. Other alternative to achieve your goal is by setting its visibility to INVISIBLE:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setVisibility(View.INVISIBLE);
// to make it appear again:
toolbar.setVisibility(View.VISIBLE);

Disable navigation icon riple effect in toolbar

Not sure what you call the round effect when you click to go back to previous activity in my case (arrow back icon) but i like to disable that.
This is the code that puts it on the toolbar, but i cant seem to find (if there is) an option to disable that round effect when clicked.
mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayShowHomeEnabled(true);
mToolbar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_arrow_back));
Like this round effect buttons produce in toolbar's when pressed. I presume a Material design effect.
Thanks
By changing in your theme you can achieve that. Remove <item name="android:background">#color/toolbar</item> from your theme defined in style.
Follow this stack-overflow link.
Use this in your layout
<android.support.v7.widget.Toolbar
android:id="#+id/yourToolbarId"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/yourId"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_width="wrap_content"
app:layout_height="wrap_content"
app:minHeight="?attr/actionBarHeight"
app:minWidth="?attr/actionBarHeight"
android:src="#drawable/ic_arrow_back"/>
</android.support.v7.widget.Toolbar>
and getSupportActionBar().setDisplayShowHomeEnabled(false); in conjunction
and dont use this
mToolbar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_arrow_back));
Also you have to manually set your click listener to perform specific action you need when it is pressed.
Use false instead of true
getSupportActionBar().setDisplayShowHomeEnabled(false);

Categories

Resources