【问题标题】:How to change color of hamburger icon in material design navigation drawer如何更改材料设计导航抽屉中汉堡图标的颜色
【发布时间】:2015-10-30 10:48:01
【问题描述】:

我正在关注这个例子

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

在这个例子中,它显示汉堡图标为白色,我想自定义它并使其变黑,但我无法找到如何更改它的任何内容,谁能告诉如何自定义它?

清单

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

风格

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

主活动

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

【问题讨论】:

  • 只需在 style.xml 主题中使用以下行 @drawable/icon_top_menu 。,用自定义 drawable 替换 icon_top_menu
  • 我添加了这个 @drawable/icon_top_menu ..现在你能告诉我该怎么做了..
  • 在你的drawable中添加另一个带有所需颜色汉堡菜单图标的图像,并将icon_top_menu替换为上面的图标
  • icon_top_menu 应该是图片吧?
  • 我添加了一张图片@drawable/hamburger它仍然显示白色图像

标签: java android user-interface material-design navigation-drawer


【解决方案1】:

要改变汉堡图标的颜色,你必须打开“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>

所以检查&lt;item name="color"&gt;@android:color/black&lt;/item&gt; 行。只需在此处更改您想要的颜色即可。

【讨论】:

【解决方案2】:

以编程方式添加这一行

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

【讨论】:

  • 但是我们如何获得对 actionBarDrawerToggle 的引用? (运行您建议的代码将返回 null,因为我们没有引用 actionBarDrawerToggle)
  • 别再看了,Sai Gopi N 正确回答了这个问题。要回答 Daron,您必须在主要活动中创建一个实例。 ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close);
【解决方案3】:

1.在Color.xml.&lt;color name="hamburgerBlack"&gt;#000000&lt;/color&gt;

2.在style.xml中。

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

3。然后你的主主题类(文件名style.xml)。我有“AppTheme”。

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

【讨论】:

    【解决方案4】:

    覆盖 colorControlNormal 也可以。

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

    【讨论】:

      【解决方案5】:

      为此,您可以进行如下操作:

      protected ActionBarDrawerToggle drawerToggle;
      
      drawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.black));
      

      【讨论】:

      • @Gratien Asimbahwe 您发布的这段代码会崩溃,因为没有对drawerToggle 的引用......我们如何获得引用?
      【解决方案6】:

      yourProject/res/values/styles.xml

      在styles.xml中添加:

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

      【讨论】:

      • 仅适用于 API 20 及更高版本
      【解决方案7】:
      <android.support.design.widget.AppBarLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:background="@color/colorTransparent"
      

      也删除主题

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

      删除这个

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

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

      最后加上这个

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

      到你的主要血红素

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

      【讨论】:

        【解决方案8】:

        当您设置 app:theme="@style/MyMaterialTheme" 时,这可以正常工作

        【讨论】:

        • 或者,如果您将您的 android 清单主题名称与您的 styles.xml 中的样式名称相匹配。
        【解决方案9】:

        经过 2 个小时的奋斗,这篇文章帮助了我。 在 Androidhive 材质示例中,将原色更改为另一种以获得新的操作栏颜色。 下面的代码用于在操作栏上获取箭头标记并制作自定义文本。 最后我明白了,箭头图标将出现在 appcompat 资源文件中,但汉堡图标不会出现在资源中。如果存在,我们可以在运行时更改它

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

        为了更改主页按钮,我关注了@anandsingh 的回答。

        【讨论】:

        • 这是一种非常老套且难以维护的方式。我认为最好不要做任何事情而不是遵循这个。不过,这可能有助于获得一个用于演示的示例。
        • @Tarun Voora - 这可能正是我正在寻找的……我正在寻找一种使用代码更改它的方法……我将在接下来的几天内对此进行研究。 ..提前谢谢!...我正在寻找汉堡菜单图标...但这可能会为我指明正确的方向。
        【解决方案10】:
        //----------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;
                        }
        

        【讨论】:

          【解决方案11】:

          如果您只想更改导航抽屉图标的颜色,请尝试以下操作:

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

          直接在你的activity_drawer.xml中

          【讨论】:

            【解决方案12】:

            汉堡图标由您的操作ActionBarDrawerToggle 类控制。 如果您使用的是目前必须的 android 兼容库。您可以像这样更改颜色:

                toggle?.drawerArrowDrawable?.color = ContextCompat.getColor(context, R.color.colorPrimary)
            

            【讨论】:

            • 您发布的这段代码将崩溃,因为没有对drawerToggle 的引用......我们如何获得引用?
            猜你喜欢
            • 1970-01-01
            • 2016-02-02
            • 2018-11-07
            • 1970-01-01
            • 2018-08-21
            • 2017-01-21
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多