浮动操作按钮图标不在中心位置。

Question

我在SO上找不到任何其他答案能够帮助我。

这是我的FAB xml：

<com.google.android.material.floatingactionbutton.FloatingActionButton xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fabTransfer"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    app:fabCustomSize="@dimen/fab_size_normal"
    android:layout_margin="16dp"
    app:srcCompat="@drawable/ic_add_white_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="#FFFFFFFF"
    android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/>
 </vector>

然而我的图标看起来是这样的！

有任何想法是怎么回事吗？我也尝试了其他图标（png和矢量图），但情况仍然一样。

- MSpeed

---

希望您的实际资源文件中向量标签已经关闭，这里只是因为疏忽而被省略了。 - Nikos Hidalgo

我在想这是否与视口有关，视口本质上是可绘制画布的大小。尝试使用不同的值进行实验，看看是否有任何区别，或者将它们全部删除，看看是否有效。 - Nikos Hidalgo

@NikosHidalgo 我尝试调整数值，但它似乎总是偏离中心，就像它的左上角锚定在错误的位置一样。 - MSpeed

我能想到的唯一潜在解决方法是将图像资源作为可绘制对象而不是矢量对象，并在布局的设计选项卡中从Android Studio提供的选择菜单中拖动操作按钮，以便您可以看到向导，指导您如何将可绘制对象应用于fab的前景。 - Nikos Hidalgo

嗨，Speed，请问com.google.android.material:material的版本是多少？请尝试使用1.0.0。 - Aamir Khan

Answer 1

按照这个答案，您应该尝试将app:fabCustomSize设置为24dp，看看是否效果更好。

- Grzegorz Adam Hankiewicz

Answer 2

这可能是因为布局样式覆盖了浮动按钮样式。要解决这个问题，请确保重新建立自己定义的样式，如下：

在 styles.xml 中：

    <style name="AppTheme.NoActionBar" parent="Theme.MaterialComponents.Light.Bridge">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="colorPrimary">@color/colorPrimaryDark</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorPrimaryDark</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@color/black_app</item>
        <item name="android:textColor">@color/white</item>
        <item name="floatingActionButtonStyle">@style/FabButtonStyle</item>
    </style>

    <style name="FabButtonStyle" parent="Widget.MaterialComponents.FloatingActionButton">
        <item name="backgroundTint">@color/teal_200</item>
        <item name="tint">@color/white</item>
    </style>

然后确保视图的布局符合该样式：

在AndroidManifiest.xml中。

<activity
            android:name=".OnBoardingActivity"
            android:configChanges="orientation"
            android:screenOrientation="portrait"
            android:theme="@style/AppTheme.NoActionBar"
            tools:ignore="LockedOrientationActivity" />

- yaircarreno

Answer 3

app:fabCustomSize="48dp"

- Zeeshan Ali

Answer 4

解决方案是为FAB添加一个样式，该样式扩展了Widget.MaterialComponents.FloatingActionButton。

<style name="MyFabStyle" parent="Widget.MaterialComponents.FloatingActionButton">
        <item name="backgroundTint">@color/fab_background</item>
        <item name="rippleColor">#0d9bed</item>
</style>

- MSpeed

---

这对我没有用，我也看不出图标的居中对齐如何受到这个自定义样式的影响。 - DMonkey

这个可行，但尝试所有其他提议的答案：fabTransfer.setScaleType(ImageView.ScaleType.CENTER)。 我正在从旧的支持库迁移到28+。 - DMonkey

Answer 5

尝试将此属性 android:layout_gravity="bottom|end" 更改为 android:layout_gravity="center"。

- Willy Rosa Huanca

---

不影响可绘制，但会影响按钮在其父布局中的位置。 - Nikos Hidalgo

Answer 6

这是因为你写了：android:layout_gravity="bottom|end"，所以它会在底部结束。

你应该用“center”替换它。

如果不起作用，请尝试：

android:gravity="center"

- ImNeos

---

不，layout_gravity 影响小部件在布局中的位置。android:gravity 在这里没有任何影响。 - MSpeed