如何将浮动操作按钮用作正方形?

3
有很多SO帖子说他们的按钮因为一个bug而显示为正方形。
但是我的目标是使用一个正方形按钮。如何将圆形浮动操作按钮更改为正方形?
以下是相关链接: - 带有正方形形状的浮动操作按钮 - 使用Android Design Library实现正方形浮动操作按钮 - 浮动操作按钮显示为正方形
<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"     
        android:backgroundTint="@color/standardBlue"
        app:srcCompat="@drawable/ic_3d_model"/>
3个回答

9

您可以使用Material Components库中的官方FloatingActionButton以及shapeAppearanceOverlay属性来实现。

只需使用以下代码:

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        app:shapeAppearanceOverlay="@style/fab_square"

使用

<style name="fab_square" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">0dp</item>
</style>

enter image description here


1

FloatingActionButton没有提供除rounded以外的形状,可以参考请求:允许设置FAB的形状

但是有很多其他方法可以做到这一点,我个人推荐使用robertlevonyancustomFloatingActionButton库,它易于使用和定制。

正方形形状

将以下代码添加到您的模块(app)级别Gradle文件中即可:

implementation 'com.robertlevonyan.view:CustomFloatingActionButton:3.0.1'

现在将以下代码添加到 activity_main.xml 文件中。
<com.robertlevonyan.views.customfloatingactionbutton.FloatingActionButton
       android:id="@+id/custom_fab"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_gravity="bottom|end" />

你也可以通过添加 app:fabType="square" 在 XML 中进行自定义,但我更喜欢在 MainActivity.java 中进行

然后在 MainActivity.java 中自定义 floatingactionbutton

public class MainActivity extends AppCompatActivity {
    private FloatingActionButton floatingActionButton;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        floatingActionButton = findViewById(R.id.custom_fab);

        floatingActionButton.setFabType(FabType.FAB_TYPE_SQUARE); //set button type to square
        floatingActionButton.setFabIcon(getResources().getDrawable(R.drawable.ic_baseline_add_btn_24, null));

    }
}

输出

enter image description here


1
这不正确。官方的 FAB 支持使用 ShapeAppearanceModel 进行形状处理,您可以定义自定义的 CornerTreatment,而不仅仅是 RoundedCornerTreatmentCutCornerTreatment。在这种情况下,RoundedCornerTreatment 就足够了,只需使用 0dp,您可以在我的答案中查看。 - Gabriele Mariotti

0

你最好使用由Robertlevonyan提供的customFloatingActionButton库。

<com.robertlevonyan.examples.customfloatingactionbutton.view.FloatingLayout
        android:id="@+id/floating_layout"
        app:fabType="square"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接