Search code examples
androidxmlbuttoncolorsandroid-button

Set background color and border color of Button using Shape Drawable in Android 8


I am trying to set background color and border color of Button using Shape Drawable (create button_start.xml in drawable) in Android 8, but it does not seem to work.

button_start.xml file: enter image description here

activity_main.xml file: enter image description here

result:
enter image description here


Solution

  • Short answer:.
    You don't need to define a background shape, just use a MaterialButton with the shapeAppearanceOverlay attribute:

            <com.google.android.material.button.MaterialButton
                android:layout_width="100dp"
                android:layout_height="100dp"
                style="@style/Widget.MaterialComponents.Button"
                app:backgroundTint="@color/...."
                app:strokeColor="@color/...."
                app:strokeWidth="5dp"
                android:padding="0dp"
                android:insetLeft="0dp"
                android:insetTop="0dp"
                android:insetRight="0dp"
                android:insetBottom="0dp"
                android:text="BUTTON"
                app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.MyApp.Button.Circle"
                />
    

    with:

    <style name="ShapeAppearanceOverlay.MyApp.Button.Circle" parent="">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">50%</item>
    </style>
    

    enter image description here


    Long answer:
    If you want to use a background shape you have to add app:backgroundTint="@null".
    Something like:

    <Button
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@drawable/shape_oval"
        app:backgroundTint="@null"
    

    Using a Material Components Theme the Button is replaced at runtime by a MaterialButton which use a own MaterialShapeDrawable as background. You can define a custom background but to avoid that the custom background doesn't get tinted you have to add app:backgroundTint="@null".
    The 2 solutions are not equivalent.
    Using a custom android:background the default MaterialShapeDrawable is not used and some features like stroke, shapeappearance, ripple are not set (since they are related to the MaterialShapeDrawable) . You have to provide them with your custom background.