I am trying to use the Toolbar instead of the ActionBar, but I can't figure out how to add the up button to return to the previous activity.
I couldn't find any method that could relate to it.
How do I add the up button?
I guess what you are looking for is something like this:
Toolbar toolbar = (Toolbar) findViewById(R.id.app_bar_detail);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
Or in case of using in Fragment:
Toolbar toolbar = (Toolbar) view.findViewById(R.id.app_bar_detail);
((ActionBarActivity) getActivity()).setSupportActionBar(toolbar);
((ActionBarActivity) getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
This will show up your Action Bar inside of your toolbar, but don't worry everything will fit together well. The last you have to do if you dont want any shadow under your action bar or any background of it is change your theme in vaules/styles.xml.
<style name="AppThmeme.Base" parent="Theme.AppCompat.NoActionBar">
If you want to do this in XML, you can use...
<android.support.v7.widget.Toolbar
app:navigationIcon="?homeAsUpIndicator"
...
If you're wondering why clicking on up button doesn't work with fragments, you need to set up a navigation listener as well, not sure why Google hasn't enabled it by default:
protected fun setupToolbar(toolbar: Toolbar) {
(activity as AppCompatActivity).run {
setSupportActionBar(toolbar)
supportActionBar?.setDisplayHomeAsUpEnabled(true)
toolbar.setNavigationOnClickListener { onBackPressed() }
}
}
In case when previous activity is always same for a given activity then up/back button can be achieved with the help of parentActivityName attribute. It can be mentioned in AndroidManifest.xml file as shown below:
<activity android:name=".DetailActivity" android:parentActivityName=".MainActivity">
<meta-data android:name="android.support.PARENT_ACTIVITY"
android:value=".MainActivity" />
</activity>
Let's say DetailActivity was opened from MainActivity. So when you are on DetailActivity then tool bar will automatically show a left pointing arrow (Refer screenshot):
When we click on left pointing arrow then MainActivity gets displayed.
Calling getSupportActionBar().setHomeButtonEnabled(true); should still work I think, as long as you have already called setSupportActionBar(toolbar);
You can add your own 'up' button in toolbar, after all it is just a ViewGroup.
You can customize toolbar as much as you want, in your toolbar.xml, or wherever you have defined android.support.v7.widget.Toolbar in your layout add your 'up' button like given below :
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:minHeight="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/color_toolbar"
android:layout_width="match_parent">
<ImageButton
android:id="#+id/upButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="uphandler"
android:src="#drawable/backbutton"
android:layout_gravity="end"/>
</android.support.v7.widget.Toolbar>
Now, define uphandler function in your activity to listen to this up button :
public void uphandler(View v){
this.finish(); // This will kill current activity, and if previous activity is still opened in background, it will come in front.
}
You have to add these line back button show automatically
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
on back, button click automatically back to activity
#Override
public boolean onSupportNavigateUp() {
onBackPressed();
return true;
}
if you are using navigation component, then adding up button in fragment would be like this:
in your fragment.xml
<androidx.constraintlayout.widget.ConstraintLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".presentation.recipeitem.RecipeDetailsFragment">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_constraintTop_toTopOf="parent"
android:elevation="4dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
/>
.
.
then in your fragment you would do this
inside onViewCreated(..)
val navController = findNavController()
val appBarConfiguration = AppBarConfiguration(navController.graph)
viewBinding.toolbar.setupWithNavController(navController, appBarConfiguration)
if you need to add title then use this in onResume
viewBinding.toolbar.title = "my title"
if you are using newer version of android studio:
first declare toolbar of androidx not android
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorAccent"
app:popupTheme="#style/Theme.Sunshine.PopupOverlay" />
second, get a reference to the toolbar in Activity.java and use following code;
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
ActionBar ab= getSupportActionBar();
ab.setDisplayHomeAsUpEnabled(true);
Related
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.
Home page should have navigation drawer Other page don't have navigation drawer
Show up caret -> like this
Home page view look like
see here for details
And the fragment view looks like this:
see here for details Navigation drawer menu items selection snapshot
Developing app with navigation drawer My home page having navigation drawer And i want to hide navigation drawer and show action bar home button setHomeAsUpEnabled = true instead of navigation drawer.
How can i achieve this logic onto my app?
Please let me know if any one know about this??
to enable the Home back button use the below code.
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
create custome toolbar by this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="#mipmap/top_bar_bg"
local:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
local:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
put this in activity
private Toolbar toolbar;
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar); getSupportActionBar().setDisplayHomeAsUpEnabled(true);
put this in manifest
<activity
android:name=".activity.RegisterActivity"
android:label="#string/profile"
android:parentActivityName=".activity.HomeActivity"
>
replace your current activity with android:name and
replace your parent activity with android:parentActivity
use this in fragment onCreateView or onResume ((AppCompatActivity) getActivity()).getSupportActionBar().setHomeAsUpIndicator(null); that will hide hamburger and show de back button
Hi am developing an android application which has a toolbar and hamburger icon to open drawer. I have written below to implement toolbar.
xml file:
<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>
Java file:
Toolbar toolbar = (Toolbar) view.findViewById(R.id.toolbar);
((AppCompatActivity)getActivity()).setSupportActionBar(toolbar);
((AppCompatActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
((AppCompatActivity)getActivity()).getSupportActionBar().setHomeButtonEnabled(true);
When I click on drawer layout, fragment opens and hamburger button changes to back arrow button.
I don't want this back arrow button. I want that irrespective of which fragment is selected there should always be hamburger icon.
remove this if you don't want any icon:
((AppCompatActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(false);
If you want to set custom icon then add this:
((AppCompatActivity)getActivity()).getSupportActionBar().setHomeAsUpIndicator(R.mipmap.backarrow);
Set your icon in the toolbar, the example is using the default arrow:
mToolbar.setNavigationIcon(R.drawable.abc_ic_ab_back_material);
And to hide, and show:
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
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
I've been working in material design using the latest Toolbar Widget provided in AppCompact-V21, with the navigation drawer.
My concern is How can I set navigation drawer icon to right side of the toolbar.
Although I can open navigation drawer from right by setting the android:layout_gravity="right" but navigation icon still appears to be on left side in toolbar.
When Using old Action Bar, I can crate custom action bar with button to right side with custom drawer icon and on click of custom navigation drawer icon open/close the drawer.
What is way to set navigation drawer icon on right side using toolbar ?
How to create custom view for it ?
Well, to customize toolbar and setting your own navigation button, you can add your own imagebutton to the toolbar :
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:minHeight="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:onClick="backButtonHandler"
android:background="#drawable/ic_launcher" />
</android.support.v7.widget.Toolbar>
Then, you can define your backButtonHandler(View v) in your activity class, and add functionality as desired.
I want to move ActionBarDrawerToggle from left to right and I am using appcompat 21 support library.
I haven't found a solution for this. It seems that we need to create a custom item in actionbar/toolbar as Abhinav Puri suggested.
You said you don't know how to add a custom view to your toolbar, hope this helps you or anybody who is fighting with this problem:
toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
}
actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeButtonEnabled(true);
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setDisplayShowCustomEnabled(true);
ActionBar.LayoutParams layoutParams = new ActionBar.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
layoutParams.gravity = Gravity.RIGHT;
actionBar.setCustomView(
getLayoutInflater().inflate(R.layout.custom_top_bar, null),
layoutParams);
ImageButton rightToggle =(ImageButton) toolbar.findViewById(R.id.rightToggle);
rightToggle.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if (mDrawerLayout.isDrawerOpen(Gravity.RIGHT)) {
mDrawerLayout.closeDrawer(Gravity.RIGHT);
} else {
mDrawerLayout.openDrawer(Gravity.RIGHT);
}
}
});
custom_top_bar.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rightLayout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/rightToggle"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:src="#drawable/ic_launcher" />
</LinearLayout>
You can do that very easily if you know how it works.
Most android drawers use the application's home button as a drawer button, this button's gravity cannot be changed,
All you have to do is to assign to the drawer button another button that you create yourself in the action bar (menu button), you give it an icon and an action in the onOptionsItemSelected.
if (item.getItemId() == android.R.id.home) {
if(mDrawerLayout.isDrawerOpen(mLinearLayout)) {
mDrawerLayout.closeDrawer(mmLinearLayout);
}
else {
// open the drawer
}
}
you will have approximately the same code as this, change the android.R.id.home by the button's Id I've talked about above.