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

しかし、上記のどれもうまくいきませんでした。提案された重複質問の解決策も試しましたが、どれも機能しません。ボタンは緑色のままで、正方形にもなりました。

PS波及効果を追加する方法も知っておくとよいでしょう。それも理解できませんでした。

ドキュメントで説明されているように、デフォルトでは、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がコメントで述べたように、デザインサポートライブラリのアイコンの色を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. FAB押された状態での色を変更したい場合は、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に色を追加し、fabに属性を含めることに注意してください

   app:backgroundTint="@color/addedColor"

素材テーマや素材の部品 FloatingActionButton、デフォルトではそれがに設定された色取りstyles.xml属性をcolorSecondary。

• このapp:backgroundTint属性はxmlで使用できます。

<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のフローティングアクションボタンの新しいテーマ属性マッピング

アプリのテーマ：

• colorSecondaryを設定して、FABの背景の色を設定します（backgroundTintにマップします）。
• colorOnSecondaryを設定して、アイコン/テキストの色とFABのリップルカラーを設定します（色合いとリップルカラーにマップします）。

<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に以下の2行を追加します。そして、

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

コトリンで：

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