Android에서 플로팅 액션 버튼 색상 변경

머티리얼의 플로팅 액션 버튼 색상을 변경하려고했지만 성공하지 못했습니다.

<android.support.design.widget.FloatingActionButton
    android:id="@+id/profile_edit_fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="16dp"
    android:clickable="true"
    android:src="@drawable/ic_mode_edit_white_24dp" />

나는 추가하려고 노력했다 :

android:background="@color/mycolor"

또는 코드를 통해 :

FloatingActionButton fab = (FloatingActionButton) rootView.findViewById(R.id.profile_edit_fab);
fab.setBackgroundColor(Color.parseColor("#mycolor"));

또는

fab.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#mycolor")));

그러나 위의 어느 것도 효과가 없었습니다. 또한 제안 된 중복 질문에서 해결책을 시도했지만 그중 아무것도 작동하지 않습니다. 버튼은 녹색으로 유지되었고 정사각형이되었습니다.

추신 : 잔물결 효과를 추가하는 방법을 아는 것도 좋을 것입니다.

문서에 설명 된대로 기본적으로 styles.xml 속성 colorAccent에 설정된 색상이 사용됩니다 .

이보기의 배경색은 테마의 colorAccent로 기본 설정됩니다. 런타임에이를 변경하려면 setBackgroundTintList (ColorStateList)를 통해 변경할 수 있습니다.

색상을 변경하려면

• app : backgroundTint 속성을 가진 XML로

<android.support.design.widget.FloatingActionButton
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    app:backgroundTint="@color/orange"
    app:borderWidth="0dp"
    app:elevation="6dp"
    app:fabSize="normal" >

• 와 코드 .setBackgroundTintList (아래의 답변을 ywwynm )

의견에서 @Dantalian이 언급했듯이 Design Support Library의 아이콘 색상 을 v22 (포함) 로 변경하려면 다음을 사용할 수 있습니다

android:tint="@color/white"     

v23 이후의 디자인 지원 라이브러리의 경우 다음을 사용할 수 있습니다.

app:tint="@color/white"   

또한 androidX라이브러리를 사용하면 XML 레이아웃에서 0dp 테두리를 설정해야합니다.

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    app:backgroundTint="@color/orange"
    app:borderWidth="0dp"
    app:elevation="6dp"
    app:fabSize="normal" />

Vijet Badigannavar의 답변은 정확하지만 사용 ColorStateList은 일반적으로 복잡하며 사용 방법을 알려주지 않았습니다. 우리는 종종 View정상 상태와 압축 상태에서 색상 을 변경하는 데 집중하기 때문에 더 자세한 내용을 추가 할 것입니다.

1. FAB정상 상태에서 색상 을 변경하려면 다음 과 같이 작성하면됩니다.

   mFab.setBackgroundTintList(ColorStateList.valueOf(your color in int));

2. PressedFAB 상태에서 색상 을 변경하려면 Design Support Library 22.2.1 덕분에 작성하면됩니다.

   mFab.setRippleColor(your color in int);

   이 속성을 설정하면을 길게 누르면 FAB색상이있는 잔물결이 터치 포인트에 나타나고의 전체 표면에 나타납니다 FAB. FAB정상적인 상태에서는 색상이 변경되지 않습니다 . API 21 (Lollipop) 아래에서는 잔물결 효과 FAB가 없지만를 누르면 색상이 계속 변경됩니다.

마지막으로, 상태에 대해 더 복잡한 효과를 구현하려면을 깊이 파고 들어야합니다. 다음 ColorStateList은 SO 질문입니다. 프로그래밍 방식으로 ColorStateList를 어떻게 작성합니까? .

업데이트 : @Kaitlyn의 의견에 감사드립니다. backgroundTint를 색상으로 사용하여 FAB의 획을 제거하려면 app:borderWidth="0dp"xml에서 설정할 수 있습니다 .

으로 바실 Valchev이 코멘트에서 언급이보기보다 간단하지만 내 XML에 몰래되지 않았 음을 미묘한 차이가있다.

<android.support.design.widget.FloatingActionButton
    android:id="@+id/profile_edit_fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="16dp"
    android:clickable="true"
    android:src="@drawable/ic_mode_edit_white_24dp"
    app:backgroundTint="@android:color/white"/>

다음과 같습니다.

app:backgroundTint="@android:color/white"

그리고 아닙니다

android:backgroundTint="@android:color/white"

앱을 사용하여 FAB의 색상을 변경하려고하면 몇 가지 문제가 있습니다. 버튼의 프레임은 색상이 다르므로 수행해야 할 작업 :

app:backgroundTint="@android:color/transparent"

코드에서 색상을 설정하십시오.

actionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.white)));

그냥 사용하세요

app:backgroundTint="@color/colorPrimary"

사용하지 마십시오

android:backgroundTint="@color/colorPrimary"

FAB는에 따라 색상이 지정됩니다 colorAccent.

<style name="AppTheme" parent="Base.Theme.AppCompat.Light">
    <item name="colorAccent">@color/accent</item>
</style>

mFab.setBackgroundTintList(ColorStateList.valueOf(ContextCompat.getColor(mContext,R.color.mColor)));

다른 솔루션이 작동 할 수 있습니다. 이것은 10 파운드 고릴라 방식으로 이와 유사한 경우에 광범위하게 적용 할 수있는 이점이 있습니다.

Styles.xml :

<style name="AppTheme.FloatingAccentButtonOverlay" >
    <item name="colorAccent">@color/colorFloatingActionBarAccent</item>
</style>

레이아웃 XML :

<android.support.design.widget.FloatingActionButton
       android:theme="AppTheme.FloatingAccentButtonOverlay"
       ...
 </android.support.design.widget.FloatingActionButton>

이 문서는 기본적으로 @ color / accent를 사용하도록 제안합니다. 그러나 우리는 코드를 사용하여 그것을 재정의 할 수 있습니다

fab.setBackgroundTintList(ColorStateList)

또한 기억하십시오

이 라이브러리를 사용하는 최소 API 버전은 15이므로 업데이트해야합니다! 당신이 그것을하고 싶지 않다면 사용자 정의 드로어 블을 정의하고 장식해야합니다!

아래 줄을 사용하여 플로팅 동작 버튼 배경색 변경

app:backgroundTint="@color/blue"

플로팅 동작 버튼 아이콘 색상 변경

android:tint="@color/white"     

자동 완성 덕분입니다. 몇 번의 타격과 시련 끝에 운이 좋았습니다.

    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    card_view:backgroundTint="@color/whicheverColorYouLike"

-또는-(둘 다 기본적으로 동일 함)

    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:backgroundTint="@color/whicheverColorYouLike"

이것은 디자인 라이브러리 23.1.0이있는 API 버전 17에서 나를 위해 일했습니다.

나는 같은 문제와 그것의 모든 것이 내 머리를 때리고있다. https://stackoverflow.com/a/35697105/5228412 감사합니다

우리가 할 수있는 일

 favourite_fab.setImageDrawable(ContextCompat.getDrawable(getBaseContext(), R.drawable.favourite_selected));

그것은 나를 위해 잘 작동하고 여기에 도달 할 다른 사람들을 바랍니다.

 <android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    app:elevation="6dp"
    app:backgroundTint="@color/colorAccent"
    app:pressedTranslationZ="12dp"
    android:layout_margin="@dimen/fab_margin"
    android:src="@drawable/add"/>

res / values ​​/ color.xml에 색상을 추가하고 팹에 속성을 포함시킵니다.

   app:backgroundTint="@color/addedColor"

으로 재료 테마 와 시약 FloatingActionButton 기본적으로는 설정 색상 소요 styles.xml속성을 colorSecondary.

• app:backgroundTintxml 에서 속성을 사용할 수 있습니다 .

<com.google.android.material.floatingactionbutton.FloatingActionButton
       ...
       app:backgroundTint=".."
       app:srcCompat="@drawable/ic_plus_24"/>

• 당신이 사용할 수있는 fab.setBackgroundTintList();

• <item name="backgroundTint">속성을 사용하여 스타일을 사용자 정의 할 수 있습니다

  <!--<item name="floatingActionButtonStyle">@style/Widget.MaterialComponents.FloatingActionButton</item> -->
  <style name="MyFloatingActionButton" parent="@style/Widget.MaterialComponents.FloatingActionButton">
    <item name="backgroundTint">#00f</item>
    <!-- color used by the icon -->
    <item name="tint">@color/...</item>
  </style>

• 재료 구성 요소 버전 1.1.0 부터 새로운 materialThemeOverlay속성을 사용하여 일부 구성 요소에 대해서만 기본 색상을 재정의 할 수 있습니다 .

  <style name="MyFloatingActionButton" parent="@style/Widget.MaterialComponents.FloatingActionButton">
    <item name="materialThemeOverlay">@style/MyFabOverlay</item>
  </style>

  <style name="MyFabOverlay">
    <item name="colorSecondary">@color/custom2</item>
    <!-- color used by the icon -->
    <item name="colorOnSecondary">@color/...</item>
  </style>

머티리얼 1.1.0의 플로팅 액션 버튼 에 대한 새로운 테마 속성 매핑

앱 테마에서 :

• FAB의 배경색을 설정하려면 colorSecondary 설정 (backgroundTint에 매핑)
• FAB의 아이콘 / 텍스트 및 잔물결 색상의 색상을 설정하려면 colorOnSecondary를 설정합니다 (틴트 및 잔물결 색상으로 매핑).

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- ...whatever else you declare in your app theme.. -->
    <!-- Set colorSecondary to change background of FAB (backgroundTint) -->
    <item name="colorSecondary">@color/colorSecondary</item>
    <!-- Customize colorSecondary to change icon/text of FAB (maps to tint and rippleColor) -->
    <item name="colorOnSecondary">@android:color/white</item>
</style>

데이터 바인딩 을 사용할 때 다음과 같은 작업을 수행 할 수 있습니다.

android:backgroundTint="@{item.selected ? @color/selected : @color/unselected}"

나는 매우 간단한 예를 만들었습니다

나는이 android : background = "@ color / colorAccent"와 같이 그것을했다. 폴더 res로 가서 폴더 값을 클릭 한 다음 colors.xml의 colors.xml을 클릭하면 colorAccent의 색상을 변경하고 android에서 호출한다 : background 그리고 그 일

우리가 놓친 요점은 버튼의 색상을 설정하기 전에이 색상에 원하는 값으로 작업하는 것이 중요하다는 것입니다. 따라서 값> 색상으로 이동할 수 있습니다. 기본 색상을 찾을 수 있지만 색상과 이름을 변경하여 복사하여 붙여 넣어 색상을 만들 수도 있습니다. 그런 다음 ... activity_main에서 부동 버튼의 색상을 변경하면 만든 색상을 선택할 수 있습니다

예-값에 대한 코드> 기본 색상이있는 색상 + 내가 만든 3 가지 색상 더 :

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>

    <color name="corBotaoFoto">#f52411</color>
    <color name="corPar">#8e8f93</color>
    <color name="corImpar">#494848</color>

</resources>

이제 만들었고 "corPar"라는 이름의 플로팅 액션 버튼 :

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_input_add"
        android:tint="#ffffff"
        app:backgroundTint="@color/corPar"/>

그것은 나를 위해 일했다. 행운을 빕니다!

드로어 블이없는 플로팅 액션 버튼이있는 경우 다음을 사용하여 프로그래밍 방식으로 색조를 변경할 수 있습니다.

fab.getBackground().mutate().setTint(ContextCompat.getColor(yourContext, R.color.anyColor));

color.xml 파일에 색상을 추가 한 다음이 코드 줄을 추가하십시오. floatingActionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.fab2_color)));

프로그래밍 방식으로 색상을 변경하려는 경우이 코드를 사용할 수 있습니다

floating.setBackgroundTintList(getResources().getColorStateList(R.color.vermelho));

사용하다

app : backgroundTint = "@ color / orange"

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/id_share_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/share"
        app:backgroundTint="@color/orange"
        app:fabSize="mini"
        app:layout_anchorGravity="end|bottom|center" />



</androidx.coordinatorlayout.widget.CoordinatorLayout>

머티리얼 디자인의 경우, 방금 플로팅 액션 버튼 색상을 다음과 같이 변경했습니다. 플로팅 액션 버튼 xml에 아래 두 줄을 추가하십시오. 그리고 완료

 android:backgroundTint="@color/colorPrimaryDark"
 app:borderWidth="0dp"

코 틀린에서 :

val gray = getColor(requireContext(), R.color.green)
binding.fabSubmit.backgroundTintList = ColorStateList.valueOf(gray)