I want to extend the up button on the actionbar to include the activity name. For example, instead of only being able to click the arrow to go back, I could also click the words next to it. I know some apps allow this but I haven't seen any instructions on how to do it.
Here is an example of what it currently allows:
Here is an example of what I want it to do:
What you can do is create a custom layout in your toolbar. Then when the user clicks on the view containing the title text and the up button, you handle the logic yourself.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
app:contentInsetStart="72dp"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<!--Contains your up button and title text-->
<SomeCustomLayout
android:id="#+id/customLayout"
android:layout_width="match_parent"
android:layout_width="wrap_content" />
</android.support.v7.widget.Toolbar>
Then get the view in your code with
Toolbar toolbar = findViewById(R.id.toolbar);
SomeCustomLayout customLayout = toolbar.findViewById(R.id.customLayout);
customLayout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
// You'll probably want to fire off
// an intent here to go back to the parent activity
}
});
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.
Hi I have an activity with back button enabled at the left side of the activity. Actually my activity is AppCompatActivity so I used toolbar at the top of the activity layout file. Then I changed home indicator icon programmatically. But it is not looking very well. I also used different variant for different density. But I don't know why?
Here is my code
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/ll_main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ScrollView
//////
/>
<android.support.constraint.ConstraintLayout>
Here is my activity onCreate
#Override
public void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.profileedit);
mTopToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mTopToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(ContextCompat.getDrawable(this, R.drawable.icon_back_to_home));
setTitle("");
}
here is my problem
The home button icon I have set is looking bigger. I also checked the different drawable size folder that also not the issue.
Cereate back button image with different size of icon.
Go to res -> new -> Image Asset.
Select Icon Type -> Actionbar and Tab Icons.
Asset Type -> Image and select your icon from system.
I know how to set floating action button like shown in bellow image. But i need to show different layout on click or anytime when i want to show that layout. second layout is attached
How can i achieve this?
Refer this link Floating Action Button Toolbar https://github.com/AlexKolpa/fab-toolbar
There you need to add dependency in the project.
compile 'com.github.alexkolpa:floating-action-button-toolbar:0.5.1'
In your XML file,
<com.github.alexkolpa.fabtoolbar.FabToolbar
android:id="#+id/fab_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
tb:tb_anim_duration="500"
tb:tb_button_gravity="end"
tb:tb_container_gravity="center"
>
<ImageView
android:id="#+id/attach"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_attachment_white_48dp"
android:layout_marginLeft="#dimen/icon_margin"
android:layout_marginRight="#dimen/icon_margin"
/>
<!-- More buttons can be added here -->
To hide or show the Toolbar, simply call hide() and show().
FabToolbar fabToolbar = ((FabToolbar) findViewById(R.id.fab_toolbar));
findViewById(R.id.attach).setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
fabToolbar.hide();
}
});
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 am attempting to create a drop-down menu like the one found in the Google+ app. A screenshot can be found below. I have looked at Spinners and Popup Menus, but neither of these fit exactly for what I am trying to create. The first image shows the closed menu, and the second shows what the drop-down menu looks like when opened.
http://www.droid-life.com/wp-content/uploads/2014/05/google-plus-4.4-1.jpg
The menu should not appear inside the action bar, and when scrolling, the menu displaying the selected option remains at the top of the screen.
Sorry I don't have enough reputation to add comments, So I'll post as an answer, hope it'll help anybody. This is just my alternative solution trying to achieve a ui like google plus app as you've posted.
My current solution is to use a toolbar beneath the actionbar(which is a toolbar also set as actionbar). Then I add onClickListener for the toolbar. When the toolbar is tapped, a recyclerview will be visible. Which the recyclerview can be populate by dynamic data or custom data you put in the layout. Example code :
main_layout.xml
<LinearLayout .... >
// the actionbar toolbar
<android.support.v7.widget.Toolbar
android:id="#+id/action_toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
app:theme="#style/toolbarStyle"/>
// second toolbar act as the spinner
<android.support.v7.widget.Toolbar
android:id="#+id/dropdown_toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
style="#style/dropdownToolbar">
..... // add a spinner indicator (imageview)
</android.support.v7.widget.Toolbar>
//separator line
<View
android:id="#+id/separator_line"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:background="#adacad"/>
// two child overlaps in framelayout
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white">
// the visible layout example
<android.support.v7.widget.RecyclerView
android:id="#+id/default_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
// the layout that is visible when toolbar is tapped
// this is spinner content, put anything u want here
<android.support.v7.widget.RecyclerView
android:id="#+id/dropdown_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"/>
</LinearLayout>
This will give u a full width and length layout. the dropdown_recyclerview content depends on what u want. I added an imageview to indicate if the fake spinner is open or close. Sample code for java :
MainActivity.java
//action toolbar
Toolbar actionToolbar = (Toolbar) findViewById(R.id.action_toolbar);
setSupportActionBar(actionToolbar);
RecyclerView dropdownRecyclerView = (RecyclerView) findViewById(R.id.dropdown_recyclerview);
//second toolbar
Toolbar dropdownToolbar = (Toolbar) findViewById(R.id.dropdown_toolbar);
//Listen for toolbar onClick
dropdownToolbar.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//toggle visibility of dropdown spinner
if (!SHOW_SPINNER_FLAG) {
//set indicator close / open
dropdownRecyclerView.setVisibility(View.VISIBLE);
} else {
//set indicator close / open
dropdownRecyclerView.setVisibility(View.VISIBLE);
}
}
});
Later on you can customized the layout and add some animation to reveal the fake spinner layout. If there's other way, please share. For the moment this is what i use in my app and it works fine for me. Sorry for my poor english.
example app image