IT이야기

새로운 소재 테마에서 백 화살표의 색상을 변경하는 방법은 무엇입니까?

cyworld 2022. 7. 3. 10:08
반응형

새로운 소재 테마에서 백 화살표의 색상을 변경하는 방법은 무엇입니까?

SDK를 API 21로 업데이트하여 왼쪽을 가리키는 검은 화살표가 되었습니다.

검은 뒷 화살표

회색으로 해 주세요.내가 어떻게 그럴 수 있을까?

예를 들어 Play Store에서 화살표는 흰색입니다.

스타일을 세팅하기 위해서 이렇게 해봤어요.사용한 적이 있다@drawable/abc_ic_ab_back_mtrl_am_alpha★★★★★★에homeAsUpIndicator이 그리기 가능은 투명(알파만)하지만 화살표는 검은색으로 표시됩니다.DrawerArrowStyle 나의 '나'를 @drawable/grey_arrowhomeAsUpIndicator.

<!-- Base application theme -->
<style name="AppTheme" parent="Theme.AppCompat.Light">

    <item name="android:actionBarStyle" tools:ignore="NewApi">@style/MyActionBar</item>
    <item name="actionBarStyle">@style/MyActionBar</item>

    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>

    <item name="homeAsUpIndicator">@drawable/abc_ic_ab_back_mtrl_am_alpha</item>
    <item name="android:homeAsUpIndicator" tools:ignore="NewApi">@drawable/abc_ic_ab_back_mtrl_am_alpha</item>
</style>

<!-- ActionBar style -->
<style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid">

    <item name="android:background">@color/actionbar_background</item>
    <!-- Support library compatibility -->
    <item name="background">@color/actionbar_background</item>
</style>

<!-- Style for the navigation drawer icon -->
<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="spinBars">true</item>
    <item name="color">@color/actionbar_text</item>
</style>

지금까지의 제 해결방안은@drawable/abc_ic_ab_back_mtrl_am_alpha흰색인 것 같고, 포토 에디터를 사용하여 원하는 색으로 칠합니다.동작합니다만, 사용하고 싶은 것은@color/actionbar_text를 들면DrawerArrowStyle.

코드를 통해 달성할 수 있습니다.그리기 가능한 뒤로 화살표를 가져와 필터를 사용하여 색상을 수정한 후 뒤로 버튼으로 설정합니다.

final Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
upArrow.setColorFilter(getResources().getColor(R.color.grey), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(upArrow);

리비전 1:

23한 리소스 API 23(Marshmallow)까지부터 그리기 가능한 리소스abc_ic_ab_back_mtrl_am_alpha요.abc_ic_ab_back_material.

편집:

이 코드를 사용하여 원하는 결과를 얻을 수 있습니다.

toolbar.getNavigationIcon().setColorFilter(getResources().getColor(R.color.blue_gray_15), PorterDuff.Mode.SRC_ATOP);

을 보다Toolbar ★★★★★★★★★★★★★★★★★」TintManager 「」,drawable/abc_ic_ab_back_mtrl_am_alpha의 값 「」으로 되어 있습니다.colorControlNormal.

과 함께).<item name="colorControlNormal">@color/my_awesome_color</item>내 테마에서) 근데 난 아직 까맣게.

업데이트:

이렇게 하다. 이렇게 맞춰야 .actionBarTheme속성(비특정) actionBarStyle가 있는 경우colorControlNormal.

예:

<style name="MyTheme" parent="Theme.AppCompat.Light">        
    <item name="actionBarTheme">@style/MyApp.ActionBarTheme</item>
    <item name="actionBarStyle">@style/MyApp.ActionBar</item>
    <!-- color for widget theming, eg EditText. Doesn't effect ActionBar. -->
    <item name="colorControlNormal">@color/my_awesome_color</item>
    <!-- The animated arrow style -->
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

<style name="MyApp.ActionBarTheme" parent="@style/ThemeOverlay.AppCompat.ActionBar">       
    <!-- THIS is where you can color the arrow! -->
    <item name="colorControlNormal">@color/my_awesome_color</item>
</style>

<style name="MyApp.ActionBarStyle" parent="@style/Widget.AppCompat.Light.ActionBar">
    <item name="elevation">0dp</item>      
    <!-- style for actionBar title -->  
    <item name="titleTextStyle">@style/ActionBarTitleText</item>
    <!-- style for actionBar subtitle -->  
    <item name="subtitleTextStyle">@style/ActionBarSubtitleText</item>

    <!-- 
    the actionBarTheme doesn't use the colorControlNormal attribute
    <item name="colorControlNormal">@color/my_awesome_color</item>
     -->
</style>

위의 모든 제안을 시험했다.툴바의 네비게이션아이콘 디폴트 Back 버튼 화살표 색상을 변경하는 유일한 방법은 기본 테마에서 colorControlNormal을 다음과 같이 설정하는 것입니다.아마도 부모가 테마를 사용하고 있기 때문일 것이다.AppCompat.Light.NoAction바

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/white</item> 
  //the rest of your codes...
</style>

도구 모음 테마에 단일 속성을 추가해야 합니다.

<style name="toolbar_theme" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="colorControlNormal">@color/arrow_color</item>
</style>

이 toolbar_theme를 툴바에 적용합니다.

또는

테마에 직접 적용할 수 있습니다.

<style name="CustomTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/arrow_color</item> 
  //your code ....
</style>

추가만 하면 됩니다.

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

현재 앱 테마로 이동합니다.

Toolbar 한번 써보세요.

Drawable drawable = toolbar.getNavigationIcon();
drawable.setColorFilter(ContextCompat.getColor(appCompatActivity, colorId), PorterDuff.Mode.SRC_ATOP);

이전 코멘트의 대부분에서 언급했듯이 해결책은 다음과 같이 추가하는 것입니다.

<item name="colorControlNormal">@color/white</item>앱 테마에 맞춰주세요.그러나 레이아웃의 툴바 요소에 다른 테마가 정의되어 있지 않은지 확인하십시오.

     <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            android:elevation="4dp"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

Carles의 답변은 정답입니다만, getDrawable()이나 getColor()와 같은 메서드는 제가 이 답변을 쓸 때 거의 사용되지 않았습니다.그래서 업데이트된 답변은

Drawable upArrow = ContextCompat.getDrawable(context, R.drawable.abc_ic_ab_back_mtrl_am_alpha);
upArrow.setColorFilter(ContextCompat.getColor(context, R.color.white), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(upArrow);

다른 stackoverflow 쿼리를 실행한 결과 ContextCompat.getDrawable()을 호출하는 것은

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    return resources.getDrawable(id, context.getTheme());
} else {
    return resources.getDrawable(id);
}

ContextCompat.getColor()는 다음과 같습니다.

public static final int getColor(Context context, int id) {
    final int version = Build.VERSION.SDK_INT;
    if (version >= 23) {
        return ContextCompatApi23.getColor(context, id);
    } else {
        return context.getResources().getColor(id);
    }
}

링크 1: Context Compat.getDrawable()

링크 2: Context Compat.getColor()

롤리팝 전에 효과가 있는 해결책을 찾았어요."actionBarWidget" 내에서 "colorControlNormal"을 설정합니다.테마"를 클릭하여 homeAsUpIndicator 색상을 변경합니다.위에서 락게코의 답변을 다음과 같이 수정:

<style name="MyTheme" parent="Theme.AppCompat.Light">        
    <item name="actionBarTheme">@style/MyApp.ActionBarTheme</item>
    <item name="actionBarStyle">@style/MyApp.ActionBar</item>
    <!-- color for widget theming, eg EditText. Doesn't effect ActionBar. -->
    <item name="colorControlNormal">@color/my_awesome_color</item>
    <!-- The animated arrow style -->
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
    <!-- The style for the widgets on the ActionBar. -->
    <item name="actionBarWidgetTheme">@style/WidgetStyle</item>
</style>

<style name="WidgetStyle" parent="style/ThemeOverlay.AppCompat.Light">
    <item name="colorControlNormal">@color/my_awesome_color</item>
</style>

compileSdkVersoin 25에서는 다음과 같이 할 수 있습니다.

styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light">
     <item name="android:textColorSecondary">@color/your_color</item>
</style>

여기에 이미지 설명 입력

메뉴 탐색 아이콘 색상 변경

최종 변환 메뉴 아이콘 색상

in style.xml:

<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>
    <item name="android:textColor">@color/colorAccent</item>


</style>

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







In Mainfests.xml :

<activity android:name=".MainActivity"
        android:theme="@style/MyMaterialTheme.Base"></activity>

다음 방법을 사용합니다.

private Drawable getColoredArrow() {
    Drawable arrowDrawable = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
    Drawable wrapped = DrawableCompat.wrap(arrowDrawable);

    if (arrowDrawable != null && wrapped != null) {
        // This should avoid tinting all the arrows
        arrowDrawable.mutate();
        DrawableCompat.setTint(wrapped, Color.GRAY);
    }

    return wrapped;
}

이제 다음을 사용하여 그리기 가능함을 설정할 수 있습니다.

getSupportActionBar().setHomeAsUpIndicator(getColoredArrow());

솔루션은 매우 심플합니다.

앱이라는 이름의 당신의 스타일에 다음 줄을 넣기만 하면 됩니다.테마

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

xml 코드 전체가 아래와 같이 표시됩니다(기본 스타일).

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

        <item name="colorPrimary">#0F0F0F</item>
        <item name="android:statusBarColor">#EEEEF0</item>
        <item name="android:windowLightStatusBar">true</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:windowActivityTransitions">true</item>

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

이 될 수 바를앱 bar bar bar another another ( ( ( ( ( ( setActionBar ★★★★★★★★★★★★★★★★★」setSupportActionBar) 및 이 코드를

final Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
upArrow.setColorFilter(getResources().getColor(R.color.grey), PorterDuff.Mode.SRC_ATOP);
toolbar.setNavigationIcon(upArrow);

그럼 이번에는 '아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 네.onOptionItemSelected[(뒤로)]버튼을 누르면 콜백이 표시됩니다.은 하다, 하다, 하다를 사용해서 할 수 요.setNavigationOnClickListener

toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        getActivity().onBackPressed(); //or whatever you used to do on your onOptionItemSelected's android.R.id.home callback
    }
});

메뉴로 작업하면 잘 될지 모르겠어요.

Material Components(소재 컴포넌트)에서는 다음과 같이 작업을 수행했습니다.

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="drawerArrowStyle">@style/AppTheme.DrawerArrowToggle</item>
</style>

<style name="AppTheme.DrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@android:color/white</item>
</style>

우리는 같은 문제에 부딪혔고 우리가 원했던 것은 단지 이 문제를

앱: collapse Icon

툴바의 Atribute는 문서화되어 있지 않기 때문에 찾을 수 없었습니다. :)

<android.support.v7.widget.Toolbar
         android:id="@+id/toolbar"
         android:layout_width="match_parent"
         android:layout_height="@dimen/toolbarHeight"
         app:collapseIcon="@drawable/collapseBackIcon" />

이거 먹어봐

public void enableActionBarHomeButton(AppCompatActivity appCompatActivity, int colorId){

    final Drawable upArrow = ContextCompat.getDrawable(appCompatActivity, R.drawable.abc_ic_ab_back_material);
    upArrow.setColorFilter(ContextCompat.getColor(appCompatActivity, colorId), PorterDuff.Mode.SRC_ATOP);

    android.support.v7.app.ActionBar mActionBar = appCompatActivity.getSupportActionBar();
    mActionBar.setHomeAsUpIndicator(upArrow);
    mActionBar.setHomeButtonEnabled(true);
    mActionBar.setDisplayHomeAsUpEnabled(true);
}

함수 호출:

enableActionBarHomeButton(this, R.color.white);

툴바 테마를 @style/ThemeOverlay로 변경했습니다.AppCompat.

그리고 화살은 짙은 회색으로 변했다.

            <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:gravity="center"
            app:layout_collapseMode="pin"
            app:theme="@style/ThemeOverlay.AppCompat.Light">

이것이 나에게 효과가 있었다.

다음 속성을 테마에 추가하십시오.

api 21 위의 도구 모음/수행 표시줄 뒤로 화살표를 변경하려면

<item name="android:homeAsUpIndicator">@drawable/your_drawable_icon</item>

api 21 아래의 도구 모음/수행 표시줄 뒤로 화살표를 변경하려면

<item name="homeAsUpIndicator">@drawable/your_drawable_icon</item>

작업 모드를 변경하려면 뒤로 화살표를 누르십시오.

<item name="actionModeCloseDrawable">@drawable/your_drawable_icon</item>

도구 모음/수행 표시줄 그림자를 제거하려면

<item name="android:elevation" tools:targetApi="lollipop">0dp</item>
<item name="elevation">0dp</item>
<!--backward compatibility-->
<item name="android:windowContentOverlay">@null</item>

작업 표시줄 오버플로우 그리기 가능을 변경하려면

<!--under theme-->
<item name="actionOverflowButtonStyle">@style/MenuOverflowStyle</item>

<style name="MenuOverflowStyle" parent="Widget.AppCompat.ActionButton.Overflow">
<item name="srcCompat">@drawable/ic_menu_overflow</item>

참고: 21 미만의 api에 대한 벡터 그리기 가능 지원 때문에 'android:src' 대신 'srcCompat'이 사용됩니다.

백/위 화살표의 색상을 변경하는 가장 간단한 방법(및 최선의 방법)입니다.가장 좋은 점은 (다른 답변과 달리) 부작용이 없다는 것입니다!

  • 와의 Widget.AppCompat.DrawerArrowToggle을합니다.color그 밖에 당신이 원하는 특성도 있습니다.
  • 해 주세요.drawerArrowStyle앱 테마에서 속성을 선택합니다.

스타일 작성:

<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
    <!--        Set that the nav buttons will animate-->
    <item name="spinBars">true</item>
    <!--        Set the color of the up arrow / hamburger button-->
    <item name="color">@color/white</item>
</style>

앱 테마에서 스타일 설정:

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

    <!--  Change global up-arrow color with no side-effects    -->
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

를 변경하려면ToolBar텍스트 색상(및 기타 속성), 작성style:

<style name="ToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="android:textColor">@color/white</item>
    <item name="titleTextColor">@color/white</item>
    <item name="colorControlNormal">@color/white</item> <!-- colorControlNormal is Probably not necessary    -->
</style>

그런 다음 AppTheme에서 해당 스타일을 설정합니다.

<!-- Base application theme. -->
<style name="AppTheme.MyProduceApp" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

    <!--  Style the toolbar (mostly the color of the text) -->
    <item name="toolbarStyle">@style/ToolbarStyle</item>
    <!--  Change color of up-arrow    -->
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

탐색 아이콘의 색상을 다음과 같이 프로그래밍 방식으로 변경할 수 있습니다.

mToolbar.setNavigationIcon(getColoredArrow()); 

private Drawable getColoredArrow() {
        Drawable arrowDrawable = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
        Drawable wrapped = DrawableCompat.wrap(arrowDrawable);

        if (arrowDrawable != null && wrapped != null) {
            // This should avoid tinting all the arrows
            arrowDrawable.mutate();
                DrawableCompat.setTintList(wrapped, ColorStateList.valueOf(this.getResources().getColor(R.color.your_color)));
            }
        }

        return wrapped;
}
private fun setToolbarNavigationIconColor(context: Context, toolbar: Toolbar?, color: Int) {
    val drawableBack = toolbar?.navigationIcon
    drawableBack?.let {
        val drawableWrap = DrawableCompat.wrap(drawableBack).mutate()
        DrawableCompat.setTint(
            drawableWrap, ContextCompat.getColor(context, white)
        )
        toolbar.navigationIcon = drawableWrap
    }
}

모든 솔레이션을 보았지만 문제를 해결하지 못했습니다. 문제를 해결하려면 이 코드를 XML 파일에 추가하십시오. 어둡게만 하면 됩니다.

 app:theme="@style/ThemeOverlay.AppCompat.Light"

제거만 하면 됩니다.android:homeAsUpIndicator그리고.homeAsUpIndicator잘 될 거예요.color속성의DrawerArrowStyle스타일은 충분해야 합니다.

더 나은 해결책이 없다면...

내가 한 일은 내가 한 일삼아@drawable/abc_ic_ab_back_mtrl_am_alpha흰색으로 보이는 이미지를 사진 편집기를 사용하여 원하는 색으로 칠합니다.

언급URL : https://stackoverflow.com/questions/26788464/how-to-change-color-of-the-back-arrow-in-the-new-material-theme

반응형