图标未在 FloatingActionButton 的中心对齐

Question

我正在为我的音乐播放器应用程序设计这个 activity。我有三个浮动操作按钮来执行 Play、Next 和 上一个 操作。

但是，我希望“下一个”和“上一个”按钮比“播放”按钮稍微小一些。为此，我在 activity 的 xml 文件中调整了两个按钮的高度和宽度。

<!-- Prev. Button -->
<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="45dp"
    android:layout_height="45dp"
    android:id="@+id/id_prev"
    android:layout_centerVertical="true"
    android:layout_marginEnd="22dp"
    android:layout_toStartOf="@+id/play_pause"
    android:src="@drawable/ic_skip_previous"/>    

<!-- Play. Button -->
<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:focusable="true"
    android:clickable="true"
    android:id="@+id/play_pause"
    android:src="@drawable/ic_play"/>

<!-- Next. Button -->
<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/id_next"
    android:layout_width="45dp"
    android:layout_height="45dp"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:layout_marginStart="22dp"
    android:layout_toEndOf="@+id/play_pause"
    android:clickable="true"
    android:focusable="true"
    android:src="@drawable/ic_skip_next" />

我面临的问题是，每次我将浮动操作按钮的高度和宽度更改为 45dp 或任何其他尺寸时，按钮内的图标都会被推到右下角。下一张图片显示了我在说什么。

如何获得 Next 和 Prev 浮动操作按钮内的图标完美地保持在中心并且仍然将两个按钮的大小保持在 45dp？

Answer 1

您应该添加 fabSize="mini" 属性而不是将 45dp 设置为 layout_width 和 layout_height 除了 wrap_content。

<!-- Prev. Button -->
<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/id_prev"
    android:layout_centerVertical="true"
    android:layout_marginEnd="22dp"
    android:layout_toStartOf="@+id/play_pause"
    android:src="@drawable/ic_skip_previous"
    app:fabSize="mini" />

Answer 2

您可以改用比例属性...

android:scaleX="0.9"

android:scaleY="0.9"

或在java...

使用 setScaleX 和 setScaleY 属性...

图标未在 FloatingActionButton 的中心对齐

Icon not aligning in the center of FloatingActionButton

xml

android

android-layout

floating-action-button