简体   繁体   中英

How can I change the icon of the navigation drawer and its item android studio

im new on android studio and I use the navigation drawer for my app. but I don't know how to change the icon of each on navigation drawer by default. I want to use my own icon PLEASE HELP!

This I want to change the icon:

在此处输入图片说明

and also of this item

在此处输入图片说明

 <?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:openDrawer="start"> <include layout="@layout/app_bar_main" android:layout_width="match_parent" android:layout_height="match_parent" /> <android.support.design.widget.NavigationView android:id="@+id/nav_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" android:fitsSystemWindows="true" app:headerLayout="@layout/nav_header_main" app:menu="@menu/activity_main_drawer" app:itemIconTint="#000000"/> </android.support.v4.widget.DrawerLayout> 

you just need to use toolbar and set navigation icon for it.

toolbar = (Toolbar) findViewById(R.id.toolbar);
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view_main_activity);
    navigationView.setNavigationItemSelectedListener(this);
    toolbar.setNavigationIcon(R.mipmap.ic_menu);

1)create a menu folder in R folder

2)now in menu create navigation_menu.xml file : paste this code - add icons from drawable folder

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <group android:checkableBehavior="all">
        <item
            android:id="@+id/home"
            android:title="Home"
            android:icon="@drawable/user"
            />

        <item
            android:id="@+id/earn"
            android:title="Wallet"
            android:icon="@drawable/earn"
            />
        <item
            android:id="@+id/notifications"
            android:title="Notifications"
            android:icon="@drawable/notification"
            />
    </group>
    <group android:checkableBehavior="single"
        android:menuCategory="secondary"
        android:id="@+id/secondary">
        <item
            android:title="Help"
            android:visible="false"
            android:id="@+id/help"
            android:icon="@drawable/ic_action_help"
            />
        <item
            android:title="About Us"
            android:id="@+id/aboutus"
            android:icon="@drawable/ic_action_name"
            >
        </item>
    </group>
</menu>

add this menu file in NavigaitonView tag

3)if you want to create your own toolbar for Navigation view. create toolbar.xml in your layout folder and paste this code ** add image in ImageView

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:elevation="10dp"
    >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_hamburger"
        android:id="@+id/hamburger"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Hello"
        android:textColor="@color/light_grey"
        android:gravity="center"
        android:padding="@dimen/small_padding"
        android:textSize="14dp"
        android:id="@+id/title_text"/>

</android.support.v7.widget.Toolbar>

4)add this toolbar in layout file

  <include
            layout="@layout/toolbar"
            android:id="@+id/toolbar"/>

5) goto Activity where you want to create Navigation View and do the following

public class MainActivity extends BaseActivity {


    TextView titleToolbarTV;
    ImageView  hamburgerIV;
    DrawerLayout drawerLayout;
    NavigationView navigationView;
    Toolbar toolbar; 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);  

        titleToolbarTV = (TextView)findViewById(R.id.title_text); 

        toolbar = (Toolbar)findViewById(R.id.toolbar);
        hamburgerIV = (ImageView)findViewById(R.id.hamburger);
        drawerLayout = (DrawerLayout) findViewById(R.id.base_layout);
        navigationView = (NavigationView)findViewById(R.id.navigation_drawer);
        setSupportActionBar(toolbar);
        getSupportActionBar().setTitle("");
        loginPreferences = new LoginPreferences(MainActivity.this);
        user = loginPreferences.getUser();
        hamburgerIV.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(drawerLayout.isDrawerOpen(GravityCompat.START)){
                    drawerLayout.closeDrawer(GravityCompat.START);
                }
                else{
                    drawerLayout.openDrawer(GravityCompat.START);
                }
            }
        });

 }
 }

***dont forget to add NoActionBar for your layout file

When I created a navigation view using default template provided by android studio, I faced same problem. I wanted to change the background of the navigation view header and place my own icon.

But I used simple technique to go step wise down to the header of navigation drawer. Please check this line from your code under NavigationView

app:headerLayout="@layout/nav_header_main"

This is the navigation header layout under folder layout . Open this file and place code here. My header looks like this, I have assigned the nice black background (with gradient) to this.

To assign my own application icon, I have provided my own drawable (or mipmap) under the image view. Notice this ImageView has been placed by the default template. PS this is trimmed code of my navigation header, do not want to overwhelm you with unnecessary code.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/nav_header_height"
    android:background="@drawable/side_nav_bar">

   <!--My app icon-->
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing"
        android:src="@mipmap/ic_launcher" />

    <!--My company/product name-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing"
        android:text="@string/IDS_0235"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1"
        android:textColor="@color/colorTextLight"/>

    <!--My website link-->
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM