Develop Reference

Hide/show arrow/menu on toolbar

So, i have Activity with FrameLayout, code of activity layout
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.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="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main"/>
and when i'm going to differents fragment i need to change toolbar.
I need to set different text, show back arrow, remove back arrow, and show/remove three dots in right corner for menu.
I have next code in Activity
#Override
public void onCreate(Bundle savedInstanceState) {
...
toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
...
}
and next methods in my class
public void setTextTabBar(String title) {
getSupportActionBar().show();
getSupportActionBar().setTitle(title);
}
public void setTabBarFragment() {
getSupportActionBar().show();
getSupportActionBar().setTitle(getString(R.string.about_app_title));
toolbar.setNavigationIcon(android.support.v7.appcompat.R.drawable.abc_ic_ab_back_material);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
setFragment(fragmentMain);
}
});
}
Is this right way? I'm coding to android 8+.
Also i need to add menu, and remove back arrow, how to implement this?

I don't think so, assuming your fragment transaction is replacing the <include layout="#layout/content_main"/> part of your code. According to this post: ActionBar (Support) with Fragment (support)
You need to extend each fragment so they can have their own action bars.
This makes sense as fragments are supposed to be modular in nature and only call back to the host activity when you implement special functions, callbacks, or listeners to do so.
As far as your back arrows go, you will need the code lines: getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true); to enable and set the back button. And just change the booleans to false if removing the back arrow.

ImageView in action bar

I am trying to put an ImageView inside the action bar, it works, and I can animate it and everything, however, it takes too much horizontal space and I don't know why.
This is my menu:
<?xml version="1.0" encoding="utf-8"?>
<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:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<ImageView
android:id="#+id/dicebutton"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:contentDescription="dice"
android:src="#drawable/dice_1" />
</android.support.v7.widget.Toolbar>
And this is the code in the Activity:
if (myToolbar != null) {
setSupportActionBar(myToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(false);
getSupportActionBar().setElevation(0);
image = myToolbar.findViewById(R.id.dicebutton);
if (image != null) {
image.setImageResource(R.drawable.dice_1);
image.setScaleX(0.5f);
image.setScaleY(0.5f);
image.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
rollDice(Helper.rand.nextInt(6) + 1, v);
}
});
}
}
Here is an image of the result:
The image I am using is a 256x256 dice image, why is it enlarging it to take all this space?

I too had so many problems with drawing and adjusting views in actionbar before. I think you should try Support Library Toolbar , it gives you a lot more control with this cases , also supports Menu inflate things as far as i recall:
https://developer.android.com/training/appbar/setting-up
https://developer.android.com/reference/android/support/v7/widget/Toolbar
You can put images and other views inside this , with much more control.
Updated Answer:
I'm not sure if this is what you need but try adding android:adjustViewBounds="true" to your image.
Turns sth like this:
To sth like this:

Transparent status bar overlaps action bar

Actual result: The status bar appears over the action bar Toolbar and the MenuItem inside the action bar is cut off. Note: "Test" is the action bar's title.
Expected result:
The top bound of the action bar Toolbar should appear directly below the bottom bound of the status bar and any MenuItems inside the action bar should be completely visible.
Activity's XML layout:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/layout_root"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/image_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/background"
tools:ignore="ContentDescription"/>
<android.support.v7.widget.Toolbar
android:id="#+id/action_bar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
</FrameLayout>
The action bar title and MenuItem are added at runtime.
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test);
setSupportActionBar((Toolbar) findViewById(R.id.action_bar));
ActionBar actionBar = getSupportActionBar();
assert actionBar != null;
actionBar.setDisplayHomeAsUpEnabled(false);
actionBar.setTitle("Test");
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_test, menu);
return true;
}
Before I added fitsSystemWindows="true" to the Toolbar view, the status bar still overlayed the action bar, but the 'SKIP' MenuItem was vertically centered in the action bar, causing it to appear partially underneath the status bar. I expected the fitsSystemWindows=true flag to give me my expected result (mentioned above), but it did not. It's as if fitsSystemWindows="true" correctly positioned the 'SKIP' button but did not adjust the position of the action bar itself. Anyone know what might be the issue here?
EDIT: I realize that I could remove fitsSystemWindows="true" and add a marginTop="...statusBarHeight" to the Toolbar view, but I am looking for the a cleaner way to solve this.

My issue was due to me setting the Toolbar's layout_height to ?attr/actionBarSize. I originally thought that fitsSystemWindows repositions the Toolbar, but it appears to add a padding instead. So when top padding is added to the Toolbar, the Toolbar's contents are pushed down. Since the Toolbar's height is fixed, the contents are pushed below the lower bound of the container. I ended up setting ?attr/actionBarSize as the value for the Toolbar's minHeight attribute to solve this. Below is my updated Toolbar:
<android.support.v7.widget.Toolbar
android:id="#+id/action_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
Caveat: This works if you aren't wanting to show anything directly below the action bar since the action bar's height, for one reason or another, is about twice the height that it needs to be to contain a single line of the home icon, title, and/or menu items. If anyone knows a way to achieve a non-overlapping status bar AND a normal size action bar, please share your insight. I would be forever grateful.
Caveat update: Okay. So apparently my action bar was receiving extra, bottom padding equivalent to the height of the navigation bar because I set <item name="android:windowTranslucentNavigation">true</item> on my Activity's theme. I verified this by removing the windowTranslucentNavigation attribute. I am testing this on a 7.1 Pixel using Android Support Libraries v25.1.1.

Try to move your Toolbar into AppBarLayout.
Like this:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/action_bar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<AppBarLayout/>

I am using flags to make activity fullscreen and my style is NoActionBar.
If i set fitsSystemWindows=true to toolar or parent layout, activity content size changed because of navigation bar and status bar.
I wrapped ToolBar with AppBarLayout like in Twinkie_Monkey's answer and I set fitsSystemWindows=true to AppBarLayout and it worked.

Navigation view with fragment. Toolbar

So, I have an activity with navigation view. By click on its item I change fragment in activity. All fragment have the same toolbar. But one have this toolbar and TabLayout to it. I would like to know what is better to declare toolbar once on activity like this
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/toolbar" />
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar" />
</RelativeLayout>
or declare it in each fragment.
The disadvantage of the first method is default toolbar shadow. When I add tabs in fragment, shadow looks like
When I tried 2 solution. All my toolbar was with back icon instead drawer animated logo.
Thanks.

I had the exact same problem. This is how I solved it:
Move the toolbars to the fragments like you suggested (so you won't have a shadow separating the two). This allows for a way more flexible way to implement (different) toolbars in your layouts too.
Replace the Toolbar's navigation icon by a custom one like this:
toolbar.setNavigationIcon(R.drawable.ic_action_menu);
(I used the Android Asset Studio to easily create an icon with the preferred color)
Now open the NavigationView with the new menu(home) icon. You can do this through the MainActivity (the one with the NavigationView). Create a public method in that Activity that opens the drawer:
public void openDrawer(){
mDrawerLayout.openDrawer(Gravity.LEFT);
}
Now call this method in the OnOptionsItemSelected in your fragments like this:
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// handle item selection
switch (item.getItemId()) {
case android.R.id.home: //Menu icon
((MainActivity)getActivity()).openDrawer();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
That's it. Of course the downside is that you must implement the Toolbar in each Fragment. However, this is the only way (that I know of) that enables you to have the Toolbar (+TabLayout) in a Fragment and still be able to control your NavigationView.

You can use AppBarLayout from design support library like:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
...
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout
...
/>
</android.support.design.widget.AppBarLayout>
and then you can change visibility of tablayout.
For more information about desing layout library : link

Android 5.0 material design style navigation drawer for KitKat

I see that Android introduced new navigation drawer icons, drawer icon and back arrow icon. How can we use that in Kitkat supported apps. See Google's latest version of Newsstand app, which has the latest navigation drawer icons and animations. How can we implement that?
I have tried setting the minSDK to 19 and complileSDK to 21 but it's using the old style icons. Is that self implemented?

You need to use the new Toolbar in the appcompat v21 and the new ActionBarDrawerToggle that is in this library as well.
Add the gradle dependency to your gradle file:
compile 'com.android.support:appcompat-v7:21.0.0'
Your activity_main.xml layout would look something like that:
<!--I use android:fitsSystemWindows because I am changing the color of the statusbar as well-->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_parent_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true">
<include layout="#layout/toolbar"/>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Main layout -->
<FrameLayout
android:id="#+id/main_fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- Nav drawer -->
<fragment
android:id="#+id/fragment_drawer"
android:name="com.example.packagename.DrawerFragment"
android:layout_width="#dimen/drawer_width"
android:layout_height="match_parent"
android:layout_gravity="left|start" />
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
Your Toolbar layout would look something like that:
<?xml version="1.0" encoding="utf-8"?>
<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/toolbar"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"/>
Your activity must extend from:
ActionBarActivity
When you find your views (drawer and toolbar) in the activity the set the toolbar as the support action bar and set the setDrawerListener:
setSupportActionBar(mToolbar);
mDrawerToggle= new ActionBarDrawerToggle(this, mDrawerLayout,mToolbar, R.string.app_name, R.string.app_name);
mDrawerLayout.setDrawerListener(mDrawerToggle);
After that you just need to take care of the menu items and drawerToogle state:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = new MenuInflater(this);
inflater.inflate(R.menu.menu_main,menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (mDrawerToggle.onOptionsItemSelected(item)) {
return true;
}
return super.onOptionsItemSelected(item);
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
mDrawerToggle.syncState();
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
mDrawerToggle.onConfigurationChanged(newConfig);
}
#Override
public void onBackPressed() {
if(mDrawerLayout.isDrawerOpen(Gravity.START|Gravity.LEFT)){
mDrawerLayout.closeDrawers();
return;
}
super.onBackPressed();
}
The implementation is the same as It was before the Toolbar and you receive the arrow animation for free. No headaches. For more information follow:
The documentation.
The ChrisBanes post
The official android blog post.
If you want to display the drawer over the Toolbar and under the status bar, please refer to this question.
EDIT: Use NavigationView from the support design library. Tutorial to learn how to use in here: http://antonioleiva.com/navigation-view/

The answer is no longer useful. Leaving it here for only historic purpose as the time of posting Android did not have the implementation :)
There are plenty of libraries now that can achieve this.
Choice 1 - https://github.com/neokree/MaterialNavigationDrawer
Others
https://github.com/HeinrichReimer/material-drawer
https://github.com/kanytu/android-material-drawer-template
https://github.com/balysv/material-menu
https://github.com/ikimuhendis/LDrawer
https://github.com/Zlate87/material-navigation-drawer-example

If you want the real navigation drawer with material design style (defined here) I have implemented a custom library that do exactly that.
You can find it here

Supporting top comment along with the new generated main_content's layout. I simply override the included content layout with DrawerLayout. Keep in mind that your drawerlayout must have this layout_behavior: appbar_scrolling_view_behavior
top container's layout
https://github.com/juanmendez/jm_android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/activity_recycler.xml#L17
included content layout
https://github.com/juanmendez/jm_android_dev/blob/master/01.fragments/06.fragments_with_rx/app/src/main/res/layout/content_recycler.xml#L9