ste9206
ste9206

Reputation: 1892

how to shape the border on the left of this textview?

I've seen it in an iOS app:

enter image description here

and I want to implement a TextView like this in my Android app. So I've made this drawable:

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

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#fff"/>
    <stroke android:width="1dp"
        android:color="@color/colorPrimary" />
    <padding android:left="5dp"
        android:top="5dp"
        android:right="5dp"
        android:bottom="5dp"/>
    <corners android:bottomRightRadius="7dp"
        android:bottomLeftRadius="7dp"
        android:topLeftRadius="7dp"
        android:topRightRadius="7dp"/>
</shape>

but I don't know how to make the blue color on the left. Anyone could help me?

Thanks

Upvotes: 1

Views: 430

Answers (3)

ste9206
ste9206

Reputation: 1892

Based on @Er. Joshi answers, I have found this solution that works good:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/blueButton"/>
            <corners
                android:bottomLeftRadius="10dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="10dp"/>
        </shape>

    </item>

    <item android:left="5dp">
        <shape android:shape="rectangle">
        <solid android:color="#FFFFFF"/>
            <stroke android:width="1dp"
                android:color="#BDBDBD" />
            <padding android:left="10dp"
                android:top="5dp"
                android:right="5dp"
                android:bottom="5dp"/>
            <corners
                android:bottomLeftRadius="5dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="5dp"/>

        </shape>

    </item>
</layer-list>

Upvotes: 1

Surya Prakash Kushawah
Surya Prakash Kushawah

Reputation: 3201

try this

 <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="#FF0000" />
    </shape>
</item>
<item android:left="5dp">
    <shape android:shape="rectangle">
        <solid android:color="#000000" />
    </shape>
</item>
</layer-list>

Upvotes: 1

Jugal K
Jugal K

Reputation: 195

You can try this :

 <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#FF0000"/>
            <corners
                android:bottomLeftRadius="10dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="10dp"/>
        </shape>

    </item>

    <item android:left="5dp"
        >
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF"/>
            <corners
                android:bottomLeftRadius="5dp"
                android:bottomRightRadius="5dp"
                android:topLeftRadius="5dp"
                android:topRightRadius="5dp"/>

        </shape>
    </item>
</layer-list>

Upvotes: 3

Related Questions