Question

几天前，我拥有完美的FAB，现在图像不会居中，这使我发疯！这就是我现在得到的：

我正在使用CardView中的按钮。这是按钮xml标记：

<android.support.design.widget.FloatingActionButton
            android:id="@+id/btn_options"
            style="@style/fab"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_marginEnd="@dimen/fab_margin"
            android:layout_marginTop="20dp"
            android:elevation="10dp"
            android:scaleType="center"
            android:src="@drawable/ic_options"
            android:tint="@color/colorPrimary"
            card_view:layout_constraintEnd_toEndOf="parent"
            card_view:layout_constraintTop_toTopOf="parent" />

这是可绘制文件：ic_options.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportHeight="24.0"
    android:viewportWidth="24.0">
<path
    android:fillColor="#FF000000"
    android:pathData="M12,8c1.1,0 2,-0.9 2,-2s-0.9,-2 -2,-2 -2,0.9 -2,2 0.9,2 2,2zM12,10c-1.1,0 -2,0.9 -2,2s0.9,2 2,2 2,-0.9 2,-2 -0.9,-2 -2,-2zM12,16c-1.1,0 -2,0.9 -2,2s0.9,2 2,2 2,-0.9 2,-2 -0.9,-2 -2,-2z"/>
</vector>

奇怪的是，当我将FAB宽度和高度更改为wrap_content时，它会正确居中，但按钮会变大，而我不希望这样。

这个问题发生在我对整个项目进行了一些更改之后，具体取决于Android Studio Inspector。但是，这种布局没有改变，我只是不知道发生了什么事！

你有什么主意吗？

编辑：

CardView代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/tools"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    style="@style/AppTheme"
    android:layout_width="match_parent"
    android:layout_height="170dp"
    android:layout_gravity="top"
    app:ignore="NamespaceTypo"
    android:layout_marginEnd="10dp"
    android:layout_marginStart="10dp"
    android:layout_marginTop="12dp"
    card_view:cardCornerRadius="2dp"
    >


<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="400dp"
        android:layout_height="220dp"
        android:contentDescription="@string/contentDescription_mapBackground"
        android:foreground="@drawable/map_overlay" />

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:padding="@dimen/fab_margin"
        card_view:layout_constraintEnd_toStartOf="@+id/btn_options"
        card_view:layout_constraintStart_toStartOf="parent">

        <TextView
            android:id="@+id/name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:letterSpacing="0.04"
            android:textColor="@color/colorWhite"
            android:textSize="17sp" />

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="6dp"
            android:drawableStart="@drawable/ic_marker2"
            android:drawableTint="@color/white"
            android:textColor="@color/colorWhite"
            android:textSize="12sp" />


    </LinearLayout>


        <android.support.design.widget.FloatingActionButton
            android:id="@+id/btn_options"
            style="@style/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="@dimen/fab_margin"
            android:layout_marginTop="20dp"
            android:elevation="10dp"
            android:scaleType="center"
            android:src="@drawable/ic_options"
            android:tint="@color/colorPrimary"
            app:fabCustomSize="40dp"
            card_view:layout_constraintTop_toTopOf="parent"
            card_view:layout_constraintEnd_toEndOf="parent"
            />


</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>

Answer 1

您可以使用android:layout_width="wrap_content" android:layout_height="wrap_content"和app:fabSize="mini"或app:fabCustomSize="40dp"。

它适合你吗？

Answer 2

使用app:fabCustomSize属性代替大小编码。

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_options"
    app:fabCustomSize="100dp"
    />

Answer 3

就我而言，我已经解决了以下问题：

android:fabSize="mini" // mini - 40dp
android:match_parent="40dp"
android:wrap_content="40dp"

所以您应该设置fab按钮和android：match_parent的大小 android：wrap_content相似

Answer 4

不是将图像设置为cardview，而是尝试在fab的cardview内添加imageview小部件，然后将重力设置为imageview的中心

Answer 5

在我的应用程序中，我有一个带有cardviews的recyclerview项目，并且fab位于cardview的相对布局内，但是cardview位于垂直的线性布局内，并且fab图标按预期放置。
如果容易的话，可以将fab放在布局内，或者将cardview放在布局内。
我知道这没有道理，但是您的问题很奇怪

Answer 6

我在材质上的FloatingActionButton遇到了同样的问题，我可以通过添加 maxImageSize 来解决此问题，如下所示：

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_print"
        app:maxImageSize="@dimen/_6m" />

其中src可绘制尺寸为24 x 24，尺寸为48dp。

FAB内部的中心图片

6 个答案: