Is there a way to animate the default 3-vertical-dotted menu icon on toolbar?
I use toolbar as actionbar with the standard code:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
and I also use the onCreateOptionsMenu method inside activity where I inflate my menu.xml file
but I don't know how to gain more control over the overflow icon which is created automatically. What I'm most interested in is how to reference the menu icon So I can animate it. I don't care about the animation type. It can be a simple rotation animation
Well, you play with the View specifically ActionMenuView so try this, copy the codes into your Activity
//we declare our objects globally
Toolbar tool; ActionMenuView amv;
then override onPrepareOptionsMenu, what you decide to return is your choice
#Override
public boolean onPrepareOptionsMenu(Menu menu) {
//to be safe you can check if children are greater than 1
amv = (ActionMenuView) tool.getChildAt(1);//hope you've met amv
return true;
}
now this is the crucial part- whenever you want to animate the "3 verticall dots" -(your overflow) you have to check visible children-(i.e if you want to) actually forget that
amv.getChildAt(amv.getChildCount()-1).startAnimation(AnimationUtils.loadAnimation(
MainActivity.this,R.anim.abc_fade_in));
that gives you a basic fade-in animation- you can pimp your ride now.
EDIT 1:
The above code made assumptions that you have nothing added to your Toolbar aside from just inflating the menu in onCreateOptionsMenu.
Suppose you have a complex ToolBar use this rather for your initialisation
#Override
public boolean onPrepareOptionsMenu(Menu menu) {
for(int i =0; i < tool.getChildCount(); ++i){
if(tool.getChildAt(i).getClass().getSimpleName().equals("ActionMenuView")){
amv = (ActionMenuView) tool.getChildAt(i);
break;
}
}
return true;
}
Also where you call your initialisation of amv View can be in either onCreateOptionsMenu or onPrepareOptionsMenu, i chose onPrepareOptionsMenu because i wanted readability
Hope it helps
Related
So I have this toolbar in my app, and I want to display different menu items depending on whether the user is logged in or not. When the user logs in or out I want to update my layout which for now is the toolbar menu to represent the change. For some reason though, my menu items are not removed at all, all of them are visible at all times, regardless of the login state.
My menu items:
<menu
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/action_add"
android:icon="#drawable/ic_action_add"
android:title="#string/action_add"
app:showAsAction="ifRoom"/>
<item
android:id="#+id/action_login"
android:icon="#drawable/ic_action_logged_out"
android:title="#string/action_log_in"
app:showAsAction="always"/>
<item
android:id="#+id/action_logout"
android:icon="#drawable/ic_action_logged_in"
android:title="#string/action_log_out"
app:showAsAction="always"/>
</menu>
The first menu item is only supposed to be visible to a user that is logged in. Also I guess it's self explanatory but I only want one of the log in/out buttons to be visible depending on the login state.
My Java code:
protected void initializeToolbar(){
myToolbar = (Toolbar) findViewById(R.id.my_toolbar);
menu = myToolbar.getMenu();
resetToolbarMenu();
myToolbar.setOnMenuItemClickListener(this);
}
private void resetToolbarMenu(){
menu.clear();
getMenuInflater().inflate(R.menu.menu, menu);
if(loginPrefs.getBoolean("login", false)) { //loginPrefs is reference to a SharedPreference object
menu.removeItem(1);
} else {
menu.removeItem(2);
menu.removeItem(0);
}
}
Reason I got two methods is that I only want to set up the toolbar and listener once, but I want to be able to change the menu every time the user logs in/out without reloading the page.
After a successful login the resetToolbarMenu() method will be called again.
I suppose the menu.remove(0) does not update the UI, but I could not find another way to reach my menu object without first inflating it and then getting it from the toolbar, and I assume the inflation is what decides what items are visible. Basically, I could not find a way to remove any menu items before inflating or updating the UI in another way than inflating.
Solution:
I changed my java code into something like this:
protected void initializeToolbar(){
myToolbar = (Toolbar) findViewById(R.id.my_toolbar);
setSupportActionBar(myToolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu, menu);
return super.onCreateOptionsMenu(menu); // Don't know if this is necessary or if returning true is prefered.
}
#Override
public boolean onPrepareOptionsMenu(Menu menu) {
if(loginPrefs.getBoolean("login", false)) {
menu.getItem(0).setVisible(true);
menu.getItem(1).setVisible(false);
menu.getItem(2).setVisible(true);
} else {
menu.getItem(0).setVisible(false);
menu.getItem(1).setVisible(true);
menu.getItem(2).setVisible(false);
}
return true;
}
I also had to call invalidateOptionsMenu() on logout/login to update the toolbar/menu. However onPrepareOptionsMenu() is also automatically called whenever you open the menu for items that aren't shown on the toolbar itself.
PS: OnCreateOptionsMenu and OnPrepareOptionsMenu will not be used unless you remember to setSupportActionBar(myToolbar) as I forgot.
You can create options menu by overriding onCreateOptionsMenu. You can create 2 xml and inflate either one of them depending on your logic. To force a redraw of the menu, you can call invalidateOptionsMenu.
For example
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
if (login) {
inflater.inflate(R.menu.login_menu, menu);
} else {
inflater.inflate(R.menu.logout_menu, menu);
}
return true;
}
And outside change the flag and force redraw
login = false; // or true
invalidateOptionsMenu();
You have to override onPrepareOptionsMenu in the activity to change the items in the menu.
From the documentation:
Prepare the Screen's standard options menu to be displayed. This is called right before the menu is shown, every time it is shown. You can use this method to efficiently enable/disable items or otherwise dynamically modify the contents.
In my app, I need to change the menu of the navigationView, when I click on the header
First state
Second state
I wanted to get the currently active menu of my navigationView to toggle between the two menus. This is what I have written so far:
public void toggleMenu(){
navigationView.getMenu().clear();
navigationView.inflateMenu(R.menu.menu_trips);
}
Instead of inflating the same menu all the time, I need to create an if to inflate the menu which is not currently active, something like this:
if (navigationView == R.menu.menu_trips){
navigationView.inflateMenu(R.menu.activity_main_drawer);
} else if (navigationView == R.menu.activity_main_drawer){
navigationView.inflateMenu(R.menu.menu_trips);
}
I do not want to add an MenuItem, I just want to replace the menu. Clearing it and then inflating is the best option I found.
If you have a better solution, please tell me :)
You can not get menu id from Menu class.
I suggest you to keep a global variable that keeps your current menu id. Or you can compare first items to understand which menu is currently active.
Solved it:
String activeMenu;
protected void onCreate(){
activeMenu = "main";
}
public void toggleMenu(){
navigationView.getMenu().clear();
if (activeMenu.equals("main")){
navigationView.inflateMenu(R.menu.menu_trips);
activeMenu = "trips";
} else if (activeMenu.equals("trips")){
navigationView.inflateMenu(R.menu.activity_main_drawer);
activeMenu = "main";
}
}
I have a ViewPager where pages contain charting views which react to sliding movements. Due to this i resorted to changing the page by sliding from the edge of the screen. But that leaves me with the problem that this is also the gesture to open the NavigationDrawer.
Until now i used the following code to achieve this:
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
SetContentView(GetLayoutId());
Toolbar = FindViewById<Toolbar>(Resource.Id.toolbar);
if (Toolbar != null)
{
// set this flag so the colors colorPrimaryDark and android:statusBarColor have an effect
// setting android:statusBarColor to transparent causes the drawer to be dran underneath a translucent status bar
Window.AddFlags(WindowManagerFlags.DrawsSystemBarBackgrounds);
// make the toolbar the replacement of the action bar
SetSupportActionBar(Toolbar);
}
// add the hamburger icon
m_DrawerLayout = FindViewById<DrawerLayout>(Resource.Id.drawer_layout);
var actionBarDrawerToggle = new ActionBarDrawerToggle(this, m_DrawerLayout, Toolbar, Resource.String.empty, Resource.String.empty);
m_DrawerLayout.AddDrawerListener(actionBarDrawerToggle);
// make sure the drawer can't be opened by swiping, to do this we set the lock mode to closed
// but if we just do this, it can't be closed by swiping either, so set the lock mode to unlocked when the drawer is opened, and locked again when it's closed
m_DrawerLayout.DrawerOpened += (object sender, DrawerLayout.DrawerOpenedEventArgs e) =>
{
m_DrawerLayout.SetDrawerLockMode(DrawerLayout.LockModeUnlocked);
};
m_DrawerLayout.DrawerClosed += (object sender, DrawerLayout.DrawerClosedEventArgs e) =>
{
m_DrawerLayout.SetDrawerLockMode(DrawerLayout.LockModeLockedClosed);
};
m_DrawerLayout.SetDrawerLockMode(DrawerLayout.LockModeLockedClosed);
//calling sync state is necessay or else the hamburger icon wont show up
actionBarDrawerToggle.SyncState();
}
It worked as intended, until i updated to the Android Support Design Library 23.1.1.1, now setting the lock mode to closed also prevents the menu from being opened by tapping on the hamburger icon.
Looking at the source code for the latest version of the ActionBarDrawerToggle class, this does indeed seem to be the new intended behavior. It's toggle() method now looks like this:
private void toggle() {
int drawerLockMode = mDrawerLayout.getDrawerLockMode(GravityCompat.START);
if (mDrawerLayout.isDrawerVisible(GravityCompat.START)
&& (drawerLockMode != DrawerLayout.LOCK_MODE_LOCKED_OPEN)) {
mDrawerLayout.closeDrawer(GravityCompat.START);
}
else if (drawerLockMode != DrawerLayout.LOCK_MODE_LOCKED_CLOSED) {
mDrawerLayout.openDrawer(GravityCompat.START);
}
}
whereas it previously just checked the drawer's opened/closed state.
This is unfortunate, since it will now take a workaround to achieve the old behavior. Perhaps the simplest thing to do is just to revert to an older version of the support library. However, if you want to keep the newest version, one possible solution is as follows.
First remove the Toolbar argument from the ActionBarDrawerToggle constructor call.
actionBarDrawerToggle = new ActionBarDrawerToggle(this,
m_DrawerLayout,
Resource.String.empty,
Resource.String.empty);
This will cause the Activity's OnOptionsItemSelected() method to fire upon clicking the toggle, since you've set the Toolbar as the support ActionBar. We will also need to call SupportActionBar.SetDisplayHomeAsUpEnabled(true) to actually show the toggle, since the ActionBarDrawerToggle class interacts somewhat differently with an ActionBar than it does with a Toolbar, with respect to their child Views.
In the Activity's OnOptionsItemSelected() method, we then simply unlock the drawer before calling the toggle's own OnOptionsItemSelected() method, which handles the opening and closing of the drawer.
public override bool OnOptionsItemSelected (IMenuItem item)
{
switch (item.ItemId)
{
case Android.Resource.Id.Home:
m_DrawerLayout.SetDrawerLockMode(DrawerLayout.LockModeUnlocked);
actionBarDrawerToggle.OnOptionsItemSelected(item);
return true;
...
}
...
}
Your actionBarDrawerToggle will need to be a field of your Activity, and you can remove the DrawerOpened handler.
I have an activity with new support Toolbar and navigation drawer. The Toolbar relates to the content e.g. list of items. Multiple items can be selected - then ActionMode is shown (Context Action Bar). However the system ActionMode position, size and layout order does not correspond to the Toolbar, which would be appropriate.
Question is: how can I adjust the system ActionMode to correspond to (be aligned with) my Toolbar? Or is there any other recommended alternative? See my cases below
Portrait
NavDrawer may be hidden in side (1-green) - this is OK for both Toolbar and ActionMode.
Both Toolbar and its content are overlapped by the navigation drawer the drawer is opened (2-yellow). However, when ActionMode is active, it is displayed always over the NavDrawer (3-red), but I want it to look like (2-yellow), because the ActionMode is related to the hidden content.
This issue is similar to this question:
How to make the Contextual ActionMode Bar overlay the appcompat-v7 Toolbar but not the navigation drawer?
Tablet/landscape
In landscape the NavDrawer fits next to the toolbar and content (left). The ActionMode always overlays the NavDrawer and Toolbar and has full screen width (right-red). Again I would like the ActionMode to be in the same position as Toolbar is (left-yellow).
I solved it by using another Toolbar (actionModeToolbar), which I can put anywhere in layout and show or hide it as appropriate.
I found some useful hints how to use Toolbar here:
https://gist.github.com/gabrielemariotti/ae63392e1c70bc33af8b
Here is how I created ActionMode using Toolbar with legacy ActionMode.Callback. I have used methods similar to system ActionMode for partial compatibility.
Note, that ActionMode.Callback is not required anymore, because system ActionMode is not used and code can be refactored.
class ToolbarActionMode {
Toolbar actionModeToolbar;
ActionMode.Callback callback;
void startActionMode() {
actionModeToolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override public void onClick(View v) {
toolbarActionMode.finishActionMode();
}
});
actionModeToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
#Override public boolean onMenuItemClick(MenuItem menuItem) {
return callback.onActionItemClicked(null, menuItem);
}
});
// will create menu using inflateMenu(R.menu.menu_res)
callback.onCreateActionMode(null, null);
invalidate();
actionModeToolbar.setVisibility(View.VISIBLE);
}
void finishActionMode() {
callback.onDestroyActionMode(null);
actionModeToolbar.setVisibility(View.GONE);
}
void invalidate() {
// will update title + menu
callback.onPrepareActionMode(null, actionModeToolbar.getMenu());
}
void setTitle(CharSequence title) {
actionModeToolbar.setTitle(title);
}
void inflateMenu(int menuRes) {
actionModeToolbar.inflateMenu(menuRes);
}
}
I have referenced this post: Change spinner style in toolbar to enable a spinner in the new toolbar. My question is if I want to add or remove this spinner based on when different fragments are displayed, how can I remove this if it is being inflated in the toolbar xml?
With the actionbar, I could add or remove menu items, can I do the same with the id of the spinner from the xml? Right now, the spinner comes up blank when it is in a fragment without me populating it with data.
I'm using View.setVisibility(int) to hide a Spinner in my Toolbar based on the current Fragment.
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_menu, menu);
switch (getCurrentFragment()) {
case FRAGMENT_WITH_SPINNER:
mSpinner.setVisibility(View.VISIBLE);
break;
case FRAGMENT_WITHOUT_SPINNER:
mSpinner.setVisibility(View.GONE);
break;
}
return true;
}
I do this in onCreateOptionsMenu() so it is refreshed when some component call
mActivity.invalidateOptionsMenu();