머티리얼 디자인 탐색 창에서 햄버거 아이콘의 색상을 변경하는 방법


88

나는이 예를 따르고있다

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

바로 다음 줄 <항목 이름 = "homeAsUpIndicator을"> 사용 @ 드로어 블 / 사진 icon_top_menu </ 항목> style.xml 테마에 ,, 사용자 정의 당김과 icon_top_menu를 교체합니다.
Reprator

나는이 <항목 이름 = "homeAsUpIndicator을"> 추가 @ 드로어 블 / 사진 icon_top_menu </ 항목> .. 이제 .. 무엇을 말할 수있다
아 디트

원하는 색상 햄버거 메뉴 아이콘을 사용하여 당김에 다른 이미지를 추가로 icon_top_menu을 대체한다는 점에서 위
Nitesh

icon_top_menu 이미지가 맞아야합니까?
Aditya

나는 하나 개의 이미지 <항목 이름 = "homeAsUpIndicator"> @ 드로어 블 / 사진 햄버거 </ 항목> 화이트 이미지를 보여주는 그 STIL 추가
아 디트

답변:


230

햄버거 아이콘의 색상을 변경하려면 "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>

그러니 <item name="color">@android:color/black</item>라인을 확인하십시오 . 여기에서 원하는 색상을 변경하십시오.


어쨌든이 github.com/codepath/android_guides/wiki/… 링크를 확인할 수 있습니다 . 좋은 튜토리얼이 있습니다.
Anand Singh

따라서 MainActivity에 위의 코드를 작성하면 작동합니다.
Anand Singh

하지만 다운로드를 허용하지
아 디트


좋은 대답입니다. 대신 선택한 활동의 ​​아이콘 색상을 변경하는 방법을 알고 계십니까?
AndroidDevBro

63

프로그래밍 방식으로이 줄 추가

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

하지만 actionBarDrawerToggle에 대한 참조는 어떻게 얻습니까? (제안 된 코드를 실행하면 actionBarDrawerToggle에 대한 참조가 없기 때문에 null이 반환됩니다.)
Daron

1
더 이상 보지 마십시오. Sai Gopi N이 질문에 올바르게 대답했습니다. Daron에게 대답하려면 기본 활동에서 인스턴스를 만들어야합니다. ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle (this, drawerLayout, toolbar, R.string.drawer_open, R.string.drawer_close);
KeepAtIt

15

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

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>

13

colorControlNormal 재정의도 작동합니다.

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

8

이를 위해 다음과 같이 진행할 수 있습니다.

protected ActionBarDrawerToggle drawerToggle;

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

@Gratien Asimbahwe 귀하가 게시 한이 코드는 drawerToggle에 대한 참조가 없기 때문에 충돌합니다 .... 어떻게 참조를 얻습니까?
Daron

8

yourProject / res / values ​​/ styles.xml

styles.xml에서 다음을 추가하십시오.

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

API 20 이상에만 해당
Paixols

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

1

app : theme = "@ style / MyMaterialTheme"를 설정하면 제대로 작동합니다.


또는 Android 매니페스트 테마 이름을 styles.xml의 스타일 이름과 일치시키는 경우.
Nic Parmee

0

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 답변을 따랐습니다.


2
그것은 꽤 해키하고 유지하기 어려운 방법입니다 .. 나는 이것을 따르는 것보다 아무것도하지 않는 것이 낫다고 말하고 싶습니다. 그래도 데모에서 작동하는 샘플을 얻는 데 도움이 될 수 있습니다.
OlivierM

@Tarun Voora-이것은 내가 찾고있는 것일 수 있습니다 ... 나는 코드를 사용하여 그것을 변경하는 방법을 찾고 있습니다 ... 다음 며칠 안에 이것을 조사 할 것입니다 ... 미리 감사드립니다! .. . 나는 햄버거 메뉴 아이콘을 찾고 있지만 ... 이것은 나를 올바른 방향으로 가리킬 수 있습니다.
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;
                }

0

탐색 창 아이콘으로 만 색상을 변경하려면 다음을 시도하십시오.

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

activity_drawer.xml에서 바로


-1

햄버거 아이콘은 액션 ActionBarDrawerToggle클래스에 의해 제어됩니다 . 지금과 같이 필수 Android compat 라이브러리를 사용하는 경우. 다음과 같이 색상을 변경할 수 있습니다.

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

당신이 게시 한이 코드는 drawerToggle에 대한 참조가 없기 때문에 충돌 할 것입니다 .... 어떻게 참조를 얻습니까?
Daron
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.