简体   繁体   English

如何更改材料设计导航抽屉中汉堡包图标的颜色

[英]How to change color of hamburger icon in material design navigation drawer

I am following this example我正在关注这个例子

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

and in this example it is showing hamburger icon white,i want to customize it and make it black,but i am not able to find anything to how to change it,can any one tell how to customize it?在这个例子中,它显示的汉堡包图标是白色的,我想定制它并把它变成黑色,但我找不到任何关于如何改变它的东西,谁能告诉我如何定制它?

Manifest显现

<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>

style风格

<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>

MainActivity主要活动

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);
        }
    }

To change color of hamburger icon you have to open "style.xml" class, then try this code: 要更改汉堡包图标的颜色,您必须打开“style.xml”类,然后尝试以下代码:

<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>

So check <item name="color">@android:color/black</item> line. 所以检查<item name="color">@android:color/black</item>行。 Just change your desired color here. 只需在此更改所需的颜色即可。

以编程方式添加此行

actionBarDrawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.white));

覆盖colorControlNormal也有效。

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

1.In Color.xml. 1.在Color.xml中。 <color name="hamburgerBlack">#000000</color>

2.In style.xml. 2.在style.xml中。

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

3. Then your main theme class(File name style.xml).I have “AppTheme”. 3.然后你的主题类(文件名style.xml)。我有“AppTheme”。

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

yourProject/res/values/styles.xml yourProject / RES /值/ styles.xml

in the Style.xml add: 在Style.xml中添加:

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/white</item> 
</style>
enter code here :

For that you can proceed as follows: 为此,您可以按以下步骤操作:

protected ActionBarDrawerToggle drawerToggle;

drawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.black));
<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorTransparent"

remove themes too 也删除主题

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

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

remove this 删除这个

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

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

finally add this 最后添加这个

 <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>

To your main heme 对你的主要血红素

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

    </style>

当你设置app:theme =“@ style / MyMaterialTheme”时这很好用

//----------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;
                }

If you want to change the color just to your navigation drawer icon, try this: 如果您只想将颜色更改为导航抽屉图标,请尝试以下操作:

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

straight in your activity_drawer.xml 直接在您的activity_drawer.xml中

The hamburger icon is controlled by your action ActionBarDrawerToggle class. 汉堡包图标由您的ActionBarDrawerToggle类操作控制。 If you are using the android compat libraries which is a must as at now. 如果你正在使用android compat库,那是现在必须的。 You can change the color like this: 您可以像这样更改颜色:

    toggle?.drawerArrowDrawable?.color = ContextCompat.getColor(context, R.color.colorPrimary)
  val drawerToggle = DrawerArrowDrawable(this)
    drawerToggle.color = ContextCompat.getColor(this,R.color.white)
    (actionBarDrawerToggle as ActionBarDrawerToggle).drawerArrowDrawable = drawerToggle

After a struggle of 2 hours , this post helped me . 经过2个小时的斗争,这篇文章帮助了我。 In Androidhive material example, change primary color to another for getting new actionbar color. 在Androidhive材质示例中,将主要颜色更改为另一种颜色以获取新的操作栏颜色。 this below code is for getting arrow mark on action bar and making custom text. 以下代码用于在操作栏上获取箭头标记并制作自定义文本。 Finally i understood that, arrow icon will be in appcompat resource files but hamburger icon not present in resources. 最后我明白了,箭头图标将在appcompat资源文件中,但资源中不存在汉堡包图标。 if it is present we can change it at 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();

for changing the home button, i followed @anandsingh answer. 为了更改主页按钮,我跟着@anandsingh回答。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

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