OR

Question

我想改变fab按钮边框颜色。边框颜色为白色，内部颜色为黑色或透明

我希望我的按钮看起来像这样：

Answer 1

drawable

中的

fab.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="2"
    android:useLevel="false" >
    <solid android:color="@android:color/transparent" />

    <stroke
        android:width="3dp"
        android:color="@android:color/white" />
</shape>

layout

中的浮动操作按钮

<android.support.design.widget.FloatingActionButton
        android:id="@+id/buttton_float"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_action_social_notifications"
        android:background="@drawable/fab"
        android:layout_margin="@dimen/fab_margin"
        android:layout_gravity="bottom|right"
        app:fabSize="normal"
        app:backgroundTint="@android:color/white"
        app:rippleColor="@android:color/black"
        app:borderWidth="0dp"
        app:elevation="2dp"
        app:pressedTranslationZ="12dp"/>

注意：您的FAB的自定义设计违反了Floating Action Button

的Google Material Design准则

Answer 2

您可以在没有可绘制对象的情况下制作圆圈

  <android.support.design.widget.FloatingActionButton
        android:id="@+id/bottom_navigation_fab"
        style="@style/fab_material"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerInParent="true"
        android:layout_gravity="bottom|center"
        app:borderWidth="3dp"
        android:backgroundTint="@color/mountain_meadow" // inner circle color
        android:layout_marginBottom="10dp"
        android:tint="@color/white"
        app:backgroundTint="@color/white" // border color
        app:srcCompat="@drawable/bottom_nav_star" />

输出：

Answer 3

首先创建一个.xml形状资源，让我们将其命名为ring.xml并将以下内容放入其中：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:innerRadiusRatio="1"
            android:shape="ring"
            android:thicknessRatio="1"
            android:useLevel="false">

            <solid android:color="#FFF"/>
            <stroke
                android:width="5dp"
                android:color="#000"/>
        </shape>
    </item>
    <item>
        <bitmap xmlns:android="http://schemas.android.com/apk/res/android"
                android:src="@drawable/ic_cast_light"/>
    </item>

</layer-list>

你必须使用厚度和innerRadius属性才能使它正确，但是应该这样做！位图源也只是一个填充符，你想把你的F图像放在那里。

然后你宣布你的工厂，请像你这样引用你的戒指：

android:background="@drawable/ring"

OR

在您的java代码中，执行以下操作：

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setBackgroundResource(R.drawable.ring);

希望这有帮助！

Answer 4

如果你想设置浮动按钮边框，那么你就是这样做的。首先创建一个xml文件

<强> fab_background.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="2"
    android:useLevel="false" >

    <!--Here if you want to set transparent can set-->
    <solid android:color="@color/white" />

    <!--Here you can set your fab button border color-->
    <stroke
        android:width="3dp"
        android:color="@color/white" />
</shape>

然后在你的xml布局文件中使用之后。

<强> main_activity.xml

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/rl_content_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/black">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:padding="5dp"
        android:background="@drawable/fab_background">

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_map"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:elevation="0dp"
            android:src="@android:drawable/ic_media_play"
            app:fabSize="normal"
            app:elevation="0dp"/>
    </LinearLayout>

</RelativeLayout>

Answer 5

您可以使用以下解决方案：

app:backgroundTint="@android:color/white 

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_add_doc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:onClick="navigateToCreateActivity"
        android:backgroundTint="@color/colorPrimary"
        app:backgroundTint="@android:color/white"
        android:layout_marginBottom="@dimen/fab_margin"
        android:layout_marginEnd="50dp"
        app:srcCompat="@drawable/ic_plus"/>

对边界很好。如下图

如何更改android设计支持库FAB Button边框颜色？

5 个答案:

OR