Shape's stroke doesn't appear

Question

I defined a Drawable with a stroke but the stroke does not appear on the UI.

<ImageView
    android:id="@+id/otherSecurityLaneImageView"
    android:layout_width="130dp"
    android:layout_height="52dp"
    android:layout_marginStart="10dp"
    android:padding="10dp"
    android:background="@drawable/ll_rounded_corners_6dp"
    android:backgroundTint="@color/white"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" 
    tools:src="@drawable/poi_icon_security_lane_clear" />

Here's how @drawable/ll_rounded_corners_6dp is defined:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <stroke android:width="20dp" android:color="@color/ll_red" />
    <corners android:radius="6dp" />
</shape>

I expected to see a fat red border around the ImageView in the Android Studio design view but none appears.

score 3 · Answer 1 · answered May 06 '19 at 21:36

You can use various combinations:

app:backgroundTint="@android:color/holo_green_light"
app:backgroundTintMode="multiply"

ll_rounded_corners_6dp.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <stroke android:width="20dp" android:color="@android:color/holo_red_dark" />
    <corners android:radius="6dp" />
    <solid android:color="@android:color/holo_blue_dark" />
</shape>

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/darker_gray"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/ImageView1"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/ll_rounded_corners_6dp"
        android:padding="10dp"
        android:src="@mipmap/ic_launcher_round"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageView
        android:id="@+id/ImageView2"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/ll_rounded_corners_6dp"
        android:padding="10dp"
        android:src="@mipmap/ic_launcher_round"
        app:backgroundTint="@android:color/holo_green_light"
        app:backgroundTintMode="multiply"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/ImageView1" />

    <ImageView
        android:id="@+id/ImageView3"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_marginStart="10dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/ll_rounded_corners_6dp"
        android:padding="10dp"
        android:src="@mipmap/ic_launcher_round"
        app:backgroundTint="@android:color/holo_blue_light"
        app:backgroundTintMode="screen"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/ImageView2" />

</android.support.constraint.ConstraintLayout>

score 3 · Answer 2 · answered May 16 '19 at 05:38

I tried your code. Your drawable code is fine.

But to show stroke, There are need some changes in layoit xml code,

Just remove android:backgroundTint="@color/white" because of background tint color stroke does not appear, the main cause of it is that backgroundTint set the color into background of ImageView.

If you need to use backgroundTint you can use same color as stroke color.

Please try below code:

<ImageView
        android:id="@+id/otherSecurityLaneImageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:padding="10dp"
        android:background="@drawable/ll_rounded_corners_6dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:src="@mipmap/ic_launcher" />

I hope its working for you.

Thanks, if you have a link to documentation that explains why `android:backgroundTint` conflicts with `stroke`, that would be great info to include here. — Michael Osofsky, May 16 '19 at 16:59

score 0 · Answer 3 · answered May 06 '19 at 20:23

0

After trial and error I got the stroke to appear by removing the android:backgroundTint parameter from the ImageView. I could not find documentation about it. I also tried different android:tintModes but none of them helped.

answered May 06 '19 at 20:23

Michael Osofsky

11,429
16
68
113

Shape's stroke doesn't appear

3 Answers3