CODEWITHSUNDEEP
androidandroid-drawableandroid-vectordrawable
Sanjeet A
Sanjeet A

Reputation: 5227

Vector Drawable not showing vertical line

I am creating drawable in xml using the vector. I am able to draw a rectangle using the path but when I am trying to draw a completely vertical or horizontal line its not showing. Here is my code 

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:viewportWidth="24.0"
        android:viewportHeight="24.0">

    <path
        android:strokeWidth="1"
        android:strokeColor="#c1ae1e"
        android:pathData="M0 0,H24,V24,H0,V0"/>

    <path
        android:strokeWidth="3"
        android:strokeColor="#4c4c4c"
        android:fillColor="#36352c"
        android:pathData="M12 0,L12 24"/>

    <path
        android:strokeWidth="3"
        android:strokeColor="#4c4c4c"
        android:fillColor="#36352c"
        android:pathData="M0 12,L24 12"/>

</vector>

And here is the preview output- enter image description here

Upvotes: 2

Views: 2230

Answers (1)

Thyme Cypher
Thyme Cypher

Reputation: 73

Try combining it into one path. I'm not sure why, but having a completely horizontal or vertical line with only two points will not render. Since I had to make a cross shape, I was able to get away with combining both the vertical or horizontal lines like so:

    <path
    android:strokeColor="#FF000000"
    android:strokeWidth="0.5"
    android:pathData="M14,0 l0,28 M0,14 l28,0"/>

This will also happen if you make an arc that calculates to be a straight like (not something most people would do, but I've seen it while changing arc values, and might be related as to why the lines do not show)

Give this a try:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">

    <path
        android:strokeWidth="1"
        android:strokeColor="#c1ae1e"
        android:pathData="M0 0,H24,V24,H0,V0"/>

    <path
        android:strokeWidth="3"
        android:strokeColor="#4c4c4c"
        android:fillColor="#36352c"
        android:pathData="M12 0,L12 24 M0 12,L24 12"/>

</vector>

Upvotes: 1

Related Questions