How can I make a triangle drawable on the top left of my view?

Issue

I have created this drawable:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item  >
        <rotate
            android:fromDegrees="45"
            android:toDegrees="10"
            android:pivotX="100%"
            android:pivotY="-0%" >
            <shape
                android:shape="rectangle"   >
                <solid
                    android:color="@color/color_primary"  />
            </shape>

        </rotate>
    </item>
</layer-list>

On the preview it looks like this:

And I have put it into this View:

        <View
        android:id="@+id/my_view"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:background="@drawable/triangle"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />

And this View looks like this on the preview (and on the phone):

Why doesn't the View just show the triangle on the corner like on the triangle preview? Also, I should mention that I want it to fill half of the View square, basically go from the the top right corner to the bottom left corner.

Thanks.

Edit: I was given a suggestion to use:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item  >
        <rotate
            android:fromDegrees="45"
            android:toDegrees="-135"
            android:pivotX="90%"
            android:pivotY="-45%" >
            <shape
                android:shape="rectangle"   >
                <solid
                    android:color="@color/color_primary"  />
            </shape>

        </rotate>
    </item>
</layer-list>

And that does produce a corner triangle but it doesn't fill half of the View square. This is what it does:

Solution

I would solve this by using a <vector> drawable instead of a <layer-list>.

<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:fillColor="@color/color_primary"
        android:pathData="M0 24v-24h24z"/>

</vector>

Answered By - Ben P.