FloatingActionButton 显示两种颜色(圆圈)
FloatingActionButton showing two colors (circles)
我在其唯一父级是 CoordinatorLayout 的布局中添加了一个 FloatingActionButton,所以我不明白 backgroundTint 颜色从何而来。
我尝试更改颜色以匹配内圈,但它会将整个按钮更改为纯色。
我也应用了不同的样式,但它根本没有改变按钮。
我以前解决过这个问题,但我不记得我是怎么做到的。
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="@drawable/ic_action_add"
app:layout_anchor="@+id/edit_layout"
app:layout_anchorGravity="bottom|right|end" />
灰色来自您为 style.xml
中的应用主题定义的 colorAccent
。现在 @drawable/ic_action_add
是实心圆圈内的加号。尝试改用下面的图标:
ic_add_black_24dp.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="#000000"
android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
</vector>
然后为 FloatingActionButton
的背景色调设置深红色,为图标色调设置灰色:
<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="16dp"
app:layout_anchor="@+id/edit_layout"
app:layout_anchorGravity="bottom|right|end"
app:tint="#404D54"
app:backgroundTint="#6F303A"
app:srcCompat="@drawable/ic_add_black_24dp" />
结果:
您没有提供任何 app:backgroundTint
,因此它使用 colors.xml 中的默认值 colorAccent
。
解决这个问题:
1.Add colors.xml
的新颜色
<color name="fab_tint">#33d1ac</color>
2.Change代码如下:
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="@drawable/ic_action_add"
app:layout_anchor="@+id/edit_layout"
app:layout_anchorGravity="bottom|right|end"
app:backgroundTint="@color/fab_tint"/>
我在其唯一父级是 CoordinatorLayout 的布局中添加了一个 FloatingActionButton,所以我不明白 backgroundTint 颜色从何而来。
我尝试更改颜色以匹配内圈,但它会将整个按钮更改为纯色。
我也应用了不同的样式,但它根本没有改变按钮。 我以前解决过这个问题,但我不记得我是怎么做到的。
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="@drawable/ic_action_add"
app:layout_anchor="@+id/edit_layout"
app:layout_anchorGravity="bottom|right|end" />
灰色来自您为 style.xml
中的应用主题定义的 colorAccent
。现在 @drawable/ic_action_add
是实心圆圈内的加号。尝试改用下面的图标:
ic_add_black_24dp.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="#000000"
android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
</vector>
然后为 FloatingActionButton
的背景色调设置深红色,为图标色调设置灰色:
<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="16dp"
app:layout_anchor="@+id/edit_layout"
app:layout_anchorGravity="bottom|right|end"
app:tint="#404D54"
app:backgroundTint="#6F303A"
app:srcCompat="@drawable/ic_add_black_24dp" />
结果:
您没有提供任何 app:backgroundTint
,因此它使用 colors.xml 中的默认值 colorAccent
。
解决这个问题:
1.Add colors.xml
的新颜色<color name="fab_tint">#33d1ac</color>
2.Change代码如下:
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="@drawable/ic_action_add"
app:layout_anchor="@+id/edit_layout"
app:layout_anchorGravity="bottom|right|end"
app:backgroundTint="@color/fab_tint"/>