Hamburger icon doesn't animate with AppCompat library - android

I'm using the appcompat-v7 library to backport the Lollipop Toolbar. It looks correct, but it does not animate when I click the hamburger icon (it stays a hamburger icon). What's strange is that if I open the drawer and rotate the device, the hamburger icon changes to an arrow like it should had already been prior to rotating. If I rotate back to portrait, it stays an arrow. Here's my code:
import android.support.v7.app.ActionBarDrawerToggle;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_base_navigation);
mDrawerLayout = ButterKnife.findById(this, R.id.drawer_layout);
mContentFrameLayout = ButterKnife.findById(this, R.id.content);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.open_menu, R.string.close_menu);
mDrawerLayout.setDrawerListener(this);
}
#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 boolean onOptionsItemSelected(MenuItem item) {
return mDrawerToggle.onOptionsItemSelected(item) || super.onOptionsItemSelected(item);
}
And my theme:
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light" />
</resources>

The problem is with this line: mDrawerLayout.setDrawerListener(this);
The DrawerListener has a method called onDrawerSlide(). That is where the animation is triggered, and it is handled by the ActionBarDrawerToggle object. Switch out that line with this:
mDrawerLayout.setDrawerListener(mDrawerToggle);
If you need to listen for events on the drawer, you can override them on the ActionBarDrawerToggle object:
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.open_menu, R.string.close_menu) {
#Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
getSupportActionBar().setTitle(R.string.app_name);
}
#Override
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
getSupportActionBar().setTitle(getTitle());
}
};
Be sure to call through to the super implementation.

Related

Navigation drawer hamburger icon not showing up with v7 ActionBarDrawerToggle

I've been trying to create a navigation drawer for an existing app. I've found a few tutorials for this, but most of them (including the official Android guide) appear to be for the v4 ActionBarDrawerToggle library, which has been deprecated. I'm trying to use the v7 library instead, but my ActionBarDrawerToggle doesn't seem to do what the documentation says it should do.
Edit: Modified my code as per the answer below. The hamburger icon now switches back and forth correctly, but when the user taps the hardware back button to go back to the main fragment of my app, the hamburger icon disappears entirely. Why does this happen?
private void addDrawerItems() {
String[] itemArray = {"About", "Nearby", "Settings", "Feedback",};
mAdapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, itemArray);
mDrawerList.setAdapter(mAdapter);
mDrawerList.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Log.d("ContributionsActivity", "Item " + position + " selected");
}
});
}
private void setupDrawer() {
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.drawer_open, R.string.drawer_close) {
/** Called when a drawer has settled in a completely open state. */
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
}
/** Called when a drawer has settled in a completely closed state. */
public void onDrawerClosed(View view) {
super.onDrawerClosed(view);
invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
}
};
mDrawerToggle.setDrawerIndicatorEnabled(true);
mDrawerLayout.setDrawerListener(mDrawerToggle);
}
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setTitle(R.string.title_activity_contributions);
setContentView(R.layout.activity_contributions);
//Set up navigation drawer
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
mDrawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout);
mDrawerList = (ListView)findViewById(R.id.drawer_list);
addDrawerItems();
setupDrawer();
...
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// enabling drawer toggle by clicking on the app icon.
if (mDrawerToggle.onOptionsItemSelected(item)) {
return true;
} else {
switch (item.getItemId()) {
case android.R.id.home:
if (mediaDetails.isVisible()) {
getSupportFragmentManager().popBackStack();
}
return true;
default:
return super.onOptionsItemSelected(item);
}
}
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
mDrawerToggle.syncState();
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
mDrawerToggle.syncState();
}
You're missing sync state, add it and everything should be fine.

How to make navigation drawer toggle forcibly close all the time

I am using DrawerToggle with toolbar in my project. I have a requirement to make drawer toggle in active (i.e it should not open or close on click or swipe). But I am completely struct how to achieve the things by making the toggle event standstill. I know that my question is quite different but my requirement is to control dynamically on a runtime to control the property of drawertoggle.
I am also posting piece of code I am using for drawertoggle in my project for your reference
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.drawer_layout);
findViews();
createFragments ();
materialColorNames = getResources ().getStringArray(R.array.color_names);
drawerAdpater = new DrawerAdapter(this,materialColorNames);
mDrawerList.setAdapter(drawerAdpater);
if (toolbar != null) {
changeTitleText ("Droid");
toolbar.setTitleTextColor (getResources ().getColor (R.color.droid_white));
setSupportActionBar (toolbar);
}
initDrawer();
updateFragment (0);
mDrawerList.setOnItemClickListener(new DrawerItemClickListener());
}
#Override
protected void onResume () {
super.onResume ();
}
private void changeTitleText (CharSequence title) {
toolbar.setTitle(title);
}
private void createFragments () {
myProjectsFragment = new MyProjectsFragment();
}
private void findViews() {
mDrawerList = (ListView) findViewById(R.id.left_drawer);
toolbar = (Toolbar) findViewById(R.id.toolbar);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
}
private void initDrawer() {
drawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close) {
#Override
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
}
#Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
// mDrawerLayout.closeDrawer(mDrawerList);
}
};
mDrawerLayout.setDrawerListener(drawerToggle);
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
drawerToggle.syncState();
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
drawerToggle.onConfigurationChanged(newConfig);
}
private void updateFragment(int position) {
FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
switch (position) {
case 0:
ft.replace(R.id.content_frame, myProjectsFragment);
break;
}
Kindly please help me with this solution. I am seraching this to be done for the long time. Thanks in advance. Please let me know through comments if my question is not clear.
In your onCreate() after drawer layout and list are found call:
mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED, mDrawerList);
drawerToggle.setDrawerIndicatorEnabled(false);
From the Javadoc:
public void setDrawerLockMode (int lockMode, View drawerView)
Enable or disable interaction with the given drawer.
This allows the application to restrict the user's ability to open or close the given drawer. DrawerLayout will still respond to calls to openDrawer(int), closeDrawer(int) and friends if a drawer is locked.

Android ActionBar Up button won't open navigation drawer

I've been trying to make my Navigation Drawer open using the ActionBarActivity's Up button for a few hours now, but I just can't seem to work it out.
Right now, I can open it by swiping/sliding right and I can see the arrow Up/Back button in the ActionBar, but the Navigation Drawer won't open once I tap the button.
Please note I'm using Support v7 ActionBarDrawerToggle.
Here's my ActionBarActivity's onCreate:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
if (savedInstanceState == null) {
getFragmentManager().beginTransaction()
.add(R.id.container, new HomeFragment())
.commit();
}
Log.d(TAG, "onCreate");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
mDrawerLayout = (DrawerLayout) findViewById(R.id.main_drawer_layout);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.drawer_open, R.string.drawer_close);
mDrawerLayout.setDrawerListener(mDrawerToggle);
mDrawerToggle.setDrawerIndicatorEnabled(true);
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
Log.d(TAG, "onPostCreate");
mDrawerToggle.syncState();
}
Am I missing something? Perhaps there's a method call that links the ActionBar's Up/Back button to the DrawerToggle?
Any help/guidance is very well appreciated.
Update: I also tried using mDrawerToggle.syncState(); and nothing changed. Updated the onCreate method above to include the syncState call.
Update 2: I updated the code again to how it currently stands in my MainActivity file. I made a few changes as suggested but the drawer still won't open.
I've tested this in two devices: in an HTC One m7 with Android 5.0.2 and Sense 6.5 and in an x86 AVD Emulator running Lollipop SDK 21.
Take a look at my codes first:
public class HomeActivity extends ActionBarActivity implements
DrawerCloseListener {
private Toolbar toolbar;
private DrawerLayout drawer;
private ActionBarDrawerToggle drawerToggle;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home);
toolbar = (Toolbar) findViewById(R.id.home_toolbar);
toolbar.setNavigationIcon(R.drawable.icon_nav);
setSupportActionBar(toolbar);
drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
drawerToggle = new ActionBarDrawerToggle(this, drawer, toolbar,
R.string.app_name, R.string.app_name);
drawerToggle.setHomeAsUpIndicator(R.drawable.icon_nav);
drawer.setDrawerListener(drawerToggle);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (drawerToggle.onOptionsItemSelected(item)) {
return true;
}
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
return super.onOptionsItemSelected(item);
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
// TODO Auto-generated method stub
super.onConfigurationChanged(newConfig);
drawerToggle.onConfigurationChanged(newConfig);
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onPostCreate(savedInstanceState);
drawerToggle.syncState();
}
#Override
public void onBackPressed() {
// TODO Auto-generated method stub
if (drawer.isDrawerOpen(Gravity.LEFT | Gravity.START)) {
drawer.closeDrawers();
return;
}
super.onBackPressed();
}
#Override
public void onDrawerClose() {
// TODO Auto-generated method stub
if (drawer.isDrawerOpen(Gravity.LEFT | Gravity.START)) {
drawer.closeDrawers();
}
}
}
And among codes above, I replaced ActionBar by ToolBar, but you still can use ActionBar where there is a ToolBar. Did you miss something?
You need to sync your drawer toggle in order to get the up button to well ... sync :)
mDrawerToggle.syncState();
You need to change order of two lines :
1.
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.drawer_open, R.string.drawer_close);
then 2.
mDrawerLayout.setDrawerListener(mDrawerToggle);
Because while setting setDrawerListener the object mDrawerToggle was not initialized
Hope this will solve your work
I think you should add
mDrawerToggle.setDrawerIndicatorEnabled(true);
and move this line mDrawerLayout.setDrawerListener(mDrawerToggle); after mDrawerToggle = new ActionBarDrawerToggle(...);
Edit: After I checked my code again, the closing and opening is handled in separate method
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
if(mDrawerLayout.isDrawerOpen(drawerList)) {
mDrawerLayout.closeDrawer(drawerList);
}
else {
mDrawerLayout.openDrawer(drawerList);
}
return true;
default:
return super.onOptionsItemSelected(item);
}
}

NavigationDrawer: no more animation on drawer icon when setting drawer listener

<-- the drawer icon
If you create, with android studio, a project with a navigation drawer, when you open/close the drawer, there will be a smooth animation of the drawer icon.
If I add a drawer listener to my drawerlayout, there is no more animation the drawer icon doesnt change anymore:
DrawerLayout dl = (DrawerLayout) findViewById(R.id.drawer_layout);
dl.setDrawerListener(new ActionBarDrawerToggle(this, dl,R.drawable.ic_drawer,R.string.navigation_drawer_open,R.string.navigation_drawer_close));
I tried to override methods of ActionBarDrawerToggle to add calls to syncState().
DrawerLayout dl = (DrawerLayout)findViewById(R.id.drawer_layout);
mDrawerToggle = new ActionBarDrawerToggle(this, dl,
R.drawable.ic_drawer, R.string.drawer_open, R.string.drawer_close) {
#Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
mDrawerToggle.syncState();
}
#Override
public void onDrawerStateChanged(int newState) {
super.onDrawerStateChanged(newState);
mDrawerToggle.syncState();
}
public void onDrawerClosed(View view) {
super.onDrawerClosed(view);
mDrawerToggle.syncState();
}
/** Called when a drawer has settled in a completely open state. */
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
mDrawerToggle.syncState();
}
};
dl.setDrawerListener(mDrawerToggle);
Now, when the drawer is open, I have a small icon, and then it switch to a large icon when the drawer is closed, but I dont have the smooth animation.
Does somebody know how to get the smooth animation?
Try to put the #Override annotations that are missing for the last two listeners and remove all syncState() calls. Call syncState() from your Activity's onPostCreate:
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
mDrawerToggle.syncState();
}
I have had the same problem.It's been a long time since the question was asked, but if you are still interested, here is my answer.
put
invalidateOptionsMenu();
instead of
syncstate();
for onDrawerClosed(), onDrawerOpened(), onDrawerSlide(), onDrawerStateChanged()
Also, put
#Override
protected void onPostCreate(Bundle savedInstanceState){
super.onPostCreate(savedInstanceState);
mDrawerToggle.syncState();
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
mDrawerToggle.onConfigurationChanged(newConfig);
}
Intilize the boolean as false..private boolean isDrawerOpen = false;
public void onDrawerSlide(View drawerView, float slideOffset) {
if(slideOffset > .55 && !isDrawerOpen){
super.onDrawerSlide(drawerView, 1);
onDrawerOpened(drawerView);
isDrawerOpen = true;
} else if(slideOffset < .45 && isDrawerOpen) {
super.onDrawerSlide(drawerView,slideOffset);
onDrawerClosed(drawerView);
isDrawerOpen = false;
}
}
public void onDrawerClosed(View view) {
getActionBar().setTitle("Your title");
invalidateOptionsMenu();
}
public void onDrawerOpened(View drawerView) {
getActionBar().setTitle("your title");
invalidateOptionsMenu();
}
};

Changing Navigation drawer icon on action bar android

I have created a NavigationDrawer in my app using the ActionBar.
As showed in the picture above I want to change the NavigationDrawer toggle button icon to something I want. How can I change it?
Here is my code:-
mDrawerList.setOnItemClickListener(new SlideMenuClickListener());
// enabling action bar app icon and behaving it as toggle button
getActionBar().setDisplayHomeAsUpEnabled(true);
getActionBar().setHomeButtonEnabled(true);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,
R.drawable.hamburger_button, //nav menu toggle icon
R.string.app_name, // nav drawer open - description for accessibility
R.string.app_name // nav drawer close - description for accessibility
) {
public void onDrawerClosed(View view)
{
getActionBar().setTitle(mTitle);
// calling onPrepareOptionsMenu() to show action bar icons
invalidateOptionsMenu();
}
public void onDrawerOpened(View drawerView) {
getActionBar().setTitle("Settings");
// calling onPrepareOptionsMenu() to hide action bar icons
invalidateOptionsMenu();
}
};
mDrawerLayout.setDrawerListener(mDrawerToggle);
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
mDrawerToggle.syncState();
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
// Pass any configuration change to the drawer toggls
mDrawerToggle.onConfigurationChanged(newConfig);
}
If I try changing it to R.drawable.hamburger_button It still shows the default icon
To replace the drawer indicator icon with your own drawable(non animated) using the v7 ActionBarDrawerToggle, you can do the following:
//After instantiating your ActionBarDrawerToggle
mDrawerToggle.setDrawerIndicatorEnabled(false);
Drawable drawable = ResourcesCompat.getDrawable(getResources(), R.drawable.your_custom_icon, getActivity().getTheme());
mDrawerToggle.setHomeAsUpIndicator(drawable);
mDrawerToggle.setToolbarNavigationClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (mDrawerLayout.isDrawerVisible(GravityCompat.START)) {
mDrawerLayout.closeDrawer(GravityCompat.START);
} else {
mDrawerLayout.openDrawer(GravityCompat.START);
}
}
});
Try changing the icon manually by using setHomeAsUpIndicator() .
Like,
ActionBar actionBar = getActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeAsUpIndicator(R.drawable.ic_drawer);
and
ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(...){};
mDrawerToggle.setHomeAsUpIndicator(R.drawable.ic_drawer_toggle);
Please make sure you include these to sync the states of the icon properly.
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
mDrawerToggle.syncState();
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
mDrawerToggle.onConfigurationChanged(newConfig);
}
Here is a working solution:
setSupportActionBar(toolbar2);
toggle = new ActionBarDrawerToggle(this,drawerLayout,toolbar2, R.string.navigation_drawer_open,R.string.navigation_drawer_close);
bottomNavigationView.setOnNavigationItemSelectedListener(this);
navigationView=findViewById(R.id.nav_view);
navigationView.setNavigationItemSelectedListener(this);
toggle.syncState();
//------------To change Navigation drawer icon ---------------//
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_favorite_black_24dp);
this Youtube video helped
https://www.youtube.com/watch?v=biUaIO-N7Ew
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,
R.drawable.hamburger_button(This you the icon), //nav menu toggle icon
R.string.app_name, // nav drawer open - description for accessibility
R.string.app_name // nav drawer close - description for accessibility
)
call super class methods of ActionBarDrawerToggle super.onDrawerClosed(view) and super.onDrawerOpened(drawerView) like
mDrawerToggle = new ActionBarDrawerToggle(...){
public void onDrawerClosed(View view)
{
super.onDrawerClosed(view);
//---your code
}
public void onDrawerOpened(View drawerView)
{
super.onDrawerOpened(drawerView);
//---your code
}
}
For me adding the setHomeAsUpIndicator worked.
mDrawerToggle = new ActionBarDrawerToggle(
this, /* host Activity */
mDrawerLayout, /* DrawerLayout object */
R.drawable.custom_icon, /* nav drawer image to replace 'Up' caret */
R.string.drawer_open, /* "open drawer" description for accessibility */
R.string.drawer_close /* "close drawer" description for accessibility */
) {
public void onDrawerClosed(View view) {
getSupportActionBar().setTitle(mTitle);
invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
}
public void onDrawerOpened(View drawerView) {
getSupportActionBar().setTitle(mDrawerTitle);
invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
}
};
mDrawerLayout.setDrawerListener(mDrawerToggle);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.custom_icon);
Under the initialization of ActionBarDrawerToggle write the following code:
toolbar.setNavigationIcon(R.drawable.ic_menu_camera);
First of all you should in manifest try this code :
android:icon="#drawable/ic_icon1"
This is image for total logo of your app
android:logo="#drawable/ic_drower"
This is image for action bar
After that in main-activity try this code :
actionBar.setDisplayUseLogoEnabled(true);
setSupportActionBar(yourToolbar);
yourToolbar.setNavigationIcon({yourDrawable});
Don't set Navigation Icon before setSupportActionBar()

Categories

Resources