☰

Android フローティングアクションボタンの色を変更する 質問する

tag-icon • tag-icon java android android-5.0-lollipop floating-action-button
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 波及効果を追加する方法も知っておくと良いのですが、それも理解できませんでした。

ベストアンサー1

で説明したようにドキュメンテーションデフォルトでは、 styles.xml属性colorAccentで設定された色が使用されます。

このビューの背景色は、デフォルトでテーマの colorAccent に設定されます。実行時にこれを変更する場合は、setBackgroundTintList(ColorStateList) で変更できます。

色を変えたい場合

  • XML で属性app:backgroundTint を持つ
<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のコードで（答えは以下うわー）

@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" />

おすすめ記事