Cara mengubah warna ikon hamburger di laci navigasi desain material

88

Saya mengikuti contoh ini

http://www.androidhive.info/2015/04/android-getting-started-with-material-design/

dan dalam contoh ini ditampilkan ikon hamburger berwarna putih, saya ingin menyesuaikannya dan menjadikannya hitam, tetapi saya tidak dapat menemukan apa pun tentang cara mengubahnya, dapatkah ada yang tahu cara menyesuaikannya?

Nyata

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="info.androidhive.materialdesign" >


    <uses-permission android:name="android.permission.INTERNET"></uses-permission>

    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"></uses-permission>
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/MyMaterialTheme" >
        <activity
            android:name=".activity.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

gaya

<resources>

    <style name="MyMaterialTheme" parent="MyMaterialTheme.Base">

    </style>

    <style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="homeAsUpIndicator">@drawable/hamburger</item>
    </style>

</resources>

Aktifitas utama

public class MainActivity extends AppCompatActivity implements FragmentDrawer.FragmentDrawerListener {

    private static String TAG = MainActivity.class.getSimpleName();

    private Toolbar mToolbar;
    private FragmentDrawer drawerFragment;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
       mToolbar = (Toolbar) findViewById(R.id.toolbar);

        setSupportActionBar(mToolbar);
        getSupportActionBar().setDisplayShowHomeEnabled(true);

        drawerFragment = (FragmentDrawer)
                getSupportFragmentManager().findFragmentById(R.id.fragment_navigation_drawer);
        drawerFragment.setUp(R.id.fragment_navigation_drawer, (DrawerLayout) findViewById(R.id.drawer_layout), mToolbar);
        drawerFragment.setDrawerListener(this);

        // display the first navigation drawer view on app launch
        displayView(0);
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // 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.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        if(id == R.id.action_search){
            Toast.makeText(getApplicationContext(), "Search action is selected!", Toast.LENGTH_SHORT).show();
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onDrawerItemSelected(View view, int position) {
        displayView(position);
    }

    private void displayView(int position) {
        Fragment fragment = null;
        String title = getString(R.string.app_name);
        switch (position) {
            case 0:
                fragment = new HomeFragment();
                title = getString(R.string.title_home);
                break;
            case 1:
                fragment = new FriendsFragment();
                title = getString(R.string.title_friends);
                break;
            case 2:
                fragment = new MessagesFragment();
                title = getString(R.string.title_messages);
                break;
            case 3:
                fragment = new ContactUsFragment();
                title = getString(R.string.title_contactus);
                break;
            case 4:
                fragment = new AboutUsFragment();
                title = getString(R.string.title_aboutus);
                break;
            default:
                break;
        }

        if (fragment != null) {
            FragmentManager fragmentManager = getSupportFragmentManager();
            FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
            fragmentTransaction.replace(R.id.container_body, fragment);
            fragmentTransaction.commit();

            // set the toolbar title
            getSupportActionBar().setTitle(title);
        }
    }
Aditya
sumber
cukup gunakan baris berikut <item name = "homeAsUpIndicator"> @ drawable / icon_top_menu </item> di tema style.xml. ,, ganti icon_top_menu dengan drawable khusus
Reprator
saya menambahkan <item name = "homeAsUpIndicator"> @ drawable / icon_top_menu </item> ini .. sekarang Anda dapat mengetahui apa yang harus dilakukan ..
Aditya
tambahkan gambar lain di drawable Anda dengan ikon menu burger warna yang diinginkan dan ganti icon_top_menu dengan gambar di atas
Nitesh
icon_top_menu harus gambar kan?
Aditya
saya menambahkan satu gambar <item name = "homeAsUpIndicator"> @ drawable / hamburger </item> gambar stilnya menampilkan gambar putih
Aditya

Jawaban:

232

Untuk mengubah warna ikon hamburger Anda harus membuka kelas "style.xml", lalu coba kode ini:

<style name="MyMaterialTheme" parent="MyMaterialTheme.Base">

</style>

<style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

<style name="DrawerArrowStyle" parent="@style/Widget.AppCompat.DrawerArrowToggle">
    <item name="spinBars">true</item>
    <item name="color">@android:color/black</item>
</style>

Jadi periksa <item name="color">@android:color/black</item>baris. Ubah saja warna yang Anda inginkan di sini.

Anand Singh
sumber
bagaimanapun Anda dapat memeriksa tautan github.com/codepath/android_guides/wiki/… ini . Ini memiliki tutorial yang bagus.
Anand Singh
jadi tulis kode di atas di MainActivity Anda, itu akan berhasil.
Anand Singh
tetapi tidak memungkinkan untuk mengunduh
Aditya
Jawaban yang bagus. Apakah Anda kebetulan tahu cara mengubah warna ikon untuk aktivitas yang dipilih?
AndroidDevBro
63

lakukan secara terprogram tambahkan baris ini

actionBarDrawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.white));
Sai Gopi Me
sumber
tapi bagaimana kita mendapatkan referensi ke actionBarDrawerToggle? (menjalankan kode yang Anda sarankan akan menghasilkan nol karena kami tidak mereferensikan ke actionBarDrawerToggle)
Daron
1
Tidak perlu mencari lagi, Sai Gopi N menjawab pertanyaan dengan benar. Untuk menjawab Daron, Anda harus membuat contoh dalam aktivitas utama Anda. ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle (ini, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close);
KeepAtIt
15

1. Dalam Color.xml.<color name="hamburgerBlack">#000000</color>

2. Dalam style.xml.

<style name="DrawerIcon" parent="Widget.AppCompat.DrawerArrowToggle">
        <item name="color">@color/hamburgerBlack</item>
    </style>

3. Kemudian kelas tema utama Anda (Nama file style.xml). Saya memiliki "AppTheme".

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
         <item name="drawerArrowStyle">@style/DrawerIcon</item>
    </style>
Jigish
sumber
13

Mengganti colorControlNormal juga berfungsi.

<item name="colorControlNormal">@android:color/holo_red_dark</item>
pengguna1689757
sumber
9

Untuk itu Anda dapat melanjutkan sebagai berikut:

protected ActionBarDrawerToggle drawerToggle;

drawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.black));
venky
sumber
@Gratien Asimbahwe kode yang Anda posting ini akan macet karena tidak ada referensi ke drawerToggle .... bagaimana cara kita mendapatkan referensi?
Daron
8

yourProject / res / values ​​/ styles.xml

di styles.xml tambahkan:

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/white</item> 
</style>
smarteist
sumber
hanya untuk API 20 dan lebih tinggi
Paixols
2
<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorTransparent"

hapus tema juga

    android:theme="@style/AppThemeNoActionBar.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
      ***

pindahkan ini

*** app: popupTheme = "@ style / AppThemeNoActionBar.PopupOverlay">

</android.support.design.widget.AppBarLayout>

akhirnya tambahkan ini

 <style name="AppThemeNoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

Ke heme utama Anda

        <item name="colorControlNormal">@color/colorRedTitle</item>

    </style>
Goodlife
sumber
1

Ini berfungsi dengan baik saat Anda menyetel app: theme = "@ style / MyMaterialTheme"

Sudeep Kaushik
sumber
Atau jika Anda mencocokkan nama tema manifes Android Anda dengan nama gaya di styles.xml Anda.
Nic Parmee
0

Setelah perjuangan selama 2 jam, postingan ini membantu saya. Dalam contoh material Androidhive, ubah warna primer ke warna lain untuk mendapatkan warna bilah tindakan baru. kode di bawah ini untuk mendapatkan tanda panah pada bilah tindakan dan membuat teks kustom. Akhirnya saya mengerti bahwa, ikon panah akan ada di file sumber daya appcompat tetapi ikon hamburger tidak ada di sumber daya. jika ada, kita dapat mengubahnya saat runtime

setSupportActionBar(toolbar);
        final Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
        upArrow.setColorFilter(getResources().getColor(R.color.black), PorterDuff.Mode.SRC_ATOP);
        getSupportActionBar().setHomeAsUpIndicator(upArrow);
        getSupportActionBar().setTitle(Html.fromHtml("<font color=\"black\">" + "All Addresses" + "</font>"));
        getSupportActionBar().show();

untuk mengubah tombol home, saya mengikuti jawaban @anandsingh.

Tarun Voora
sumber
2
Itu cara yang cukup hacky dan sulit dipelihara .. Menurut saya akan lebih baik tidak melakukan apa pun daripada mengikuti ini. Itu bisa membantu untuk mendapatkan sampel yang berfungsi untuk demo.
OlivierM
@Tarun Voora - ini mungkin yang saya cari ... saya sedang mencari cara untuk mengubahnya menggunakan kode ... saya akan memeriksanya dalam beberapa hari ke depan ... terima kasih sebelumnya! .. Saya mencari ikon menu hamburger ... tapi ini mungkin mengarahkan saya ke arah yang benar.
Daron
0
//----------your own toolbar-----------------------------

            <?xml version="1.0" encoding="utf-8"?>
            <android.support.v7.widget.Toolbar 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="wrap_content"
                android:elevation="4dp"
                android:padding="1dp"
                android:background="@color/blue"
                >
                </android.support.v7.widget.Toolbar>

    //-----------Main activity xml, add your own toolbar-----------------------------------------------
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.v1technologies.sgcarel.FrameActivity">
        <include
            android:id="@+id/toolbar"
            layout="@layout/toolbar"
            />
        <FrameLayout
            android:padding="2dp"
            android:layout_marginTop="70dp"
            android:id="@+id/frame_frame_activity"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

    </FrameLayout>
    </RelativeLayout>


        //----  In your activity-----------------------

                   toolbar = (Toolbar) findViewById(R.id.toolbar);       
                    setSupportActionBar(toolbar);

            //===========================================================================

             @Override
                public boolean onCreateOptionsMenu(Menu menu) {
                    // Inflate the menu; this adds items to the action bar if it is present.
                    getMenuInflater().inflate(R.menu.menu_main, menu);

                    int color = Color.parseColor("#334412");
                    final PorterDuffColorFilter colorFilter = new PorterDuffColorFilter(color, PorterDuff.Mode.SRC_ATOP);

                    for (int i = 0; i < toolbar.getChildCount(); i++) {
                        final View v = toolbar.getChildAt(i);

                        if (v instanceof ImageButton) {
                            ((ImageButton) v).setColorFilter(colorFilter);
                        }
                    }
                    return true;
                }
Raktim Bhattacharya
sumber
0

Jika Anda ingin mengubah warna hanya ke ikon panel samping navigasi Anda, coba ini:

<android.support.design.widget.NavigationView
    app:itemIconTint="@color/thecolorthatyouwant"
 />

langsung di activity_drawer.xml Anda

Gabry_Neo
sumber
-1

Ikon hamburger dikontrol oleh ActionBarDrawerTogglekelas tindakan Anda . Jika Anda menggunakan perpustakaan compat android yang harus seperti sekarang. Anda dapat mengubah warna seperti ini:

    toggle?.drawerArrowDrawable?.color = ContextCompat.getColor(context, R.color.colorPrimary)
Ememobong AkpanEkpo
sumber
kode yang Anda posting ini akan macet karena tidak ada referensi ke drawerToggle .... bagaimana kita mendapatkan referensi?
Daron