web-dev-qa-db-fra.com

Icône Hamburger de navigation de barre d'outils manquante

Je cherche un moyen d'afficher l'icône de hamburger sans l'aide de Drawer/DrawerToggle et d'utiliser l'icône par défaut incluse dans Android enter image description here

En réglant getSupportActionBar().setDisplayHomeAsUpEnabled(true);, la flèche arrière est affichée, mais pas l’hambuerger. Les autres publications sur Stackoverflow (comme this ou this ) utilisent DrawerLayout ou un dessin personnalisable. Je ne trouve pas le vecteur ni le png de l'icône de hamburger sur la source Android.

Savez-vous comment puis-je trouver l'icône de hamburger d'origine dans Android/bibliothèque de support? (ou comment l'afficher)

Remarque: vous trouverez les fichiers vectoriels et png sur le site Web google.com/design: http://www.google.com/design/spec/resources/sticker- sheets-icons.html #

Dans mon activité

mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);

mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        Log.d(LOG_TAG, "navigation clicked");
    }
});

Fichier de mise en page

<Android.support.v7.widget.Toolbar
    Android:id="@+id/toolbar"
    Android:layout_height="wrap_content"
    Android:layout_width="match_parent"
    Android:minHeight="?attr/actionBarSize"
    Android:background="?attr/colorPrimary"
    app:theme="@style/ThemeOverlay.AppCompat.ActionBar"/>

Styles.xml

<!-- Base application theme. -->
<style name="Theme.AppTheme" parent="Theme.AppCompat.Light.NoActionBar">


    <item name="colorPrimary">@color/primaryDef</item>
    <item name="colorPrimaryDark">@color/primaryDarkDef</item>
    <item name="colorAccent">@color/primaryDef</item>

    <!-- Remove the actionbar shadow-->
    <item name="Android:windowContentOverlay">@null</item>
</style>
androidandroid-support-librarymaterial-designandroid-toolbar
67
Hugo Gresse

Si vous voulez utiliser le même tiroir que Lollipop, laissez-moi vous dire que ce n'est pas une image statique. Cette image est dessinée en temps réel par une classe appelée DrawerArrowDrawableToggle. Donc, il n'y a pas d'icône "hamburger" pour cela.

Toutefois, si vous souhaitez que l'icône de hamburger ne comporte aucune animation, vous pouvez la trouver ici:

https://material.io/tools/icons/?icon=menu&style=baseline

enter image description here

37
Pedro Oliveira

Pour avoir une icône de hamburger animée, vous devez utiliser DrawerLayout avec ActionBarDrawerToggle et activer l'icône pour le ActionBar et pour le ActionBarDrawerToggle.

Exemple:

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
DrawerLayout drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle mDrawerToggle;

setSupportActionBar(toolbar);
final ActionBar actionBar = getSupportActionBar();

if (actionBar != null)
{
   actionBar.setDisplayHomeAsUpEnabled(true);
   mDrawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.hello_world, R.string.hello_world)
   {

      public void onDrawerClosed(View view)
      {
         supportInvalidateOptionsMenu();
         //drawerOpened = false;
      }

      public void onDrawerOpened(View drawerView)
      {
         supportInvalidateOptionsMenu();
         //drawerOpened = true;
      }
   };
   mDrawerToggle.setDrawerIndicatorEnabled(true);
   drawerLayout.setDrawerListener(mDrawerToggle);
   mDrawerToggle.syncState();
}

En outre, vous devez ajouter ces méthodes à votre activité:

@Override
protected void onPostCreate(Bundle savedInstanceState)
{
    super.onPostCreate(savedInstanceState);
    mDrawerToggle.syncState();
}

@Override
public void onConfigurationChanged(Configuration newConfig)
{
    super.onConfigurationChanged(newConfig);
    mDrawerToggle.onConfigurationChanged(newConfig);
}
31
mohax

Vous pouvez essayer de créer votre propre dessin pour l'icône de hamburger comme celle-ci.

<vector xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:width="24dp"
    Android:height="24dp"
    Android:viewportHeight="24.0"
    Android:viewportWidth="24.0">
    <path
        Android:fillColor="#ffffff"
        Android:pathData="M3,18h18v-2L3,16v2zM3,13h18v-2L3,11v2zM3,6v2h18L21,6L3,6z" />
</vector>

Puis dans votre fragment/activité,

getSupportActionBar().setHomeAsUpIndicator(R.drawable.as_above);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

Pour les autres tirages, cela pourrait aider: https://github.com/google/material-design-icons/blob/master/navigation/drawable-anydpi-v21/

11
BBrain

Pour cela il vous suffit d'écrire sur quelques lignes

   DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
   ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
   drawer.addDrawerListener(toggle);
   toggle.setDrawerIndicatorEnabled(true);
   toggle.syncState();

toggle.setDrawerIndicatorEnabled (true); si c'est faux, rendez-le vrai ou supprimez cette ligne

11
Vivek Barai

J'ai eu le même problème et j'ai trouvé la solution la plus simple ici:

appcompatv7-v21-navigation-tiroir-ne-montrant pas-hamburger-icon

Tout ce que je devais faire était d'appeler:

mDrawerToggle.syncState();
9
Kacper Wolkowski

Voici la solution la plus simple qui a fonctionné pour moi.

La ActionBarDrawerToggle a deux constructeurs de types. L'un d'eux prend barre d'outils en tant que paramètre. Utilisez ce (deuxième ci-dessous) pour obtenir le hamburger animé .

ActionBarDrawerToggle(this, mDrawerLayout, R.string.content_desc_drawer_open, 
R.string.content_desc_drawer_close);

ActionBarDrawerToggle(this, mDrawerLayout, toolbar, R.string.content_desc_drawer_open, 
R.string.content_desc_drawer_close);`  //use this constructor
8
Thupten

J'ai eu le même problème. Obtenez le ToolBar puis définissez l’icône Navigation

final Android.support.v7.widget.Toolbar toolbar = (Android.support.v7.widget.Toolbar) findViewById(R.id.toolbar);
toolbar.setNavigationIcon(R.drawable.blablabla);
7
Mikheil Zhghenti
    Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
    mToolbar.setTitle("title");
    setSupportActionBar(mToolbar);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true); 
    getSupportActionBar().setHomeButtonEnabled(true);
    getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_list);
7
Tarun Voora

ok pour cacher la flèche utiliser

getSupportActionBar().setDisplayHomeAsUpEnabled(false);
getSupportActionBar().setHomeButtonEnabled(false);

puis recherchez l'icône de hamburger dans le Web -> hamburger

et finalement, définissez ceci dans votre projet avec la méthode de la barre d’action:

getSupportActionBar().setLogo(R.drawable.hamburger_icon);
5
Sniper

Peut-être que vous pouvez essayer ceci, mais vous perdrez l'animation entre les icônes flèche et hamburger

@Override
protected void onCreate(Bundle arg0) {
    super.onCreate(arg0);
    super.setContentView(R.layout.activity_menu_drawer_left);

_drawerToggle = new ActionBarDrawerToggle(this, _drawerLayout, R.string.drawer_opened, R.string.drawer_closed) {
        public void onDrawerOpened(View drawerView) {
            super.onDrawerOpened(drawerView);
            changeDrawerIconOnDrawerClick(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
        }

        /** Called when a drawer has settled in a completely closed state. */
        public void onDrawerClosed(View view) {
            super.onDrawerClosed(view);
            changeDrawerIconOnDrawerClick(R.drawable.ic_drawer);
        }
    };

     //to change default icon to hamburger item initially
    changeDrawerIconOnDrawerClick(R.drawable.ic_drawer);    }



private void changeDrawerIconOnDrawerClick(int resourceId) {
    //Drawable icon = ContextCompat.getDrawable(getApplicationContext(), resourceId);
    Drawable icon = ResourcesCompat.getDrawable(getResources(), resourceId, null);
    icon.setColorFilter(getResources().getColor(R.color.white), PorterDuff.Mode.SRC_ATOP);
    _drawerToggle.setDrawerIndicatorEnabled(false);
    _drawerToggle.setHomeAsUpIndicator(icon);
}
3
DoubleK

Ajoutez simplement les éléments suivants dans votre méthode onCreate,

if (getSupportActionBar() != null) {
            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            getSupportActionBar().setHomeButtonEnabled(true);
        }

        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, mDrawer, mToolbar, R.string.home_navigation_drawer_open, R.string.home_navigation_drawer_close) {

            public void onDrawerClosed(View view) {
                super.onDrawerClosed(view);
                invalidateOptionsMenu();
            }

            public void onDrawerOpened(View drawerView) {
                super.onDrawerOpened(drawerView);
                invalidateOptionsMenu();
            }

            @Override
            public void onDrawerSlide(View drawerView, float slideOffset) {
                super.onDrawerSlide(drawerView, slideOffset);
            }
        };
        mDrawer.addDrawerListener(toggle);
        toggle.syncState();

et dans strings.xml,

<string name="home_navigation_drawer_open">Open navigation drawer</string>
<string name="home_navigation_drawer_close">Close navigation drawer</string>
2
Nanda Gopal

Remplace la flèche par défaut par votre propre dessinable

getSupportActionBar().setHomeAsUpIndicator(R.drawable.hamburger);

2
junhaotee
 ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar,
            R.string.navigation_drawer_open, R.string.navigation_drawer_close);
    drawer.addDrawerListener(toggle);
    toggle.syncState();

c'est travailler avec moi

2
Mohamed Hamole

Utilisez ce constructeur dans MyActionBarDrawerToggle:

    public MyActionBarDrawerToggle(AppCompatActivity Host, DrawerLayout drawerlayout, SupportToolbar toolbar, int openedResource, int closedResource)
        : base(Host, drawerlayout, toolbar, openedResource, closedResource)
    {
        mHostActivity = Host;
        mOpenedResource = openedResource;
        mClosedResource = closedResource;
    }

et appelez cette méthode dans mainActivity (Using AppCompatActivity)

        mDrawerToggle = new MyActionBarDrawerToggle(
            this,                           //Host Activity
            mDrawerLayout,                  //DrawerLayout
            mToolbar,                       //Toolbar
            Resource.String.openDrawer,     //Opened Message
            Resource.String.closeDrawer     //Closed Message
        );


        mDrawerLayout.AddDrawerListener(mDrawerToggle);
        SupportActionBar.SetHomeButtonEnabled(true);
        SupportActionBar.SetDisplayShowTitleEnabled(true);
        mDrawerToggle.DrawerIndicatorEnabled = true;
        mDrawerToggle.SyncState();
1
Cyphrix_17

dans onCreate():

    setSupportActionBar(toolbar);
    ActionBar actionBar = getSupportActionBar();
    drawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.open, R.string.close) {
        @Override
        public void onDrawerClosed(View drawerView) {
            super.onDrawerClosed(drawerView);
            supportInvalidateOptionsMenu();
        }

        @Override
        public void onDrawerOpened(View drawerView) {
            super.onDrawerOpened(drawerView);
            supportInvalidateOptionsMenu();
        }
    };
    drawerLayout.setDrawerListener(drawerToggle);


    drawerToggle.setToolbarNavigationClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Backstack.get(MainActivity.this).goBack();
        }
    });
    //actionBar.setHomeAsUpIndicator(R.drawable.ic_menu);
    //getSupportActionBar().setDisplayHomeAsUpEnabled(false);
    actionBar.setDisplayHomeAsUpEnabled(false);
    actionBar.setHomeButtonEnabled(true);

Et lors de la configuration de la navigation UP:

private void setupViewsForKey(Key key) {
    if(key.shouldShowUp()) {
        drawerToggle.setDrawerIndicatorEnabled(false);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    }
    else {
        getSupportActionBar().setDisplayHomeAsUpEnabled(false);
        drawerToggle.setDrawerIndicatorEnabled(true);
    }
    drawerToggle.syncState();
1
EpicPandaForce