Diamond shape xml background for android view

2020-08-05 11:15发布

问题:

Hi anyone please suggest me how to create android xml drawable like below image?

Now I am using below code

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

but its result is triangle but I need above shape.

回答1:

Check this,

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:left="43dp"
    android:top="43dp"
    android:right="43dp"
    android:bottom="43dp">
    <rotate android:fromDegrees="45">
        <shape>
            <size
                android:width="200dp"
                android:height="200dp" />
            <gradient
                android:startColor="#0fdcc9"
                android:endColor="#0fdcc9" />
            <stroke
                android:width="5dp"
                android:color="#2DACA0" />
        </shape>
    </rotate>
</item>
</layer-list>


回答2:

This is my drawable file for diamond shape ic_diamond.xml file.

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="372.7dp"
android:height="367.4dp"
android:viewportWidth="372.7"
android:viewportHeight="367.4">

<path
    android:fillColor="#50AE89"
    android:strokeColor="#266D4F"
    android:strokeWidth="5"
    android:strokeMiterLimit="10"
    android:pathData="M188.706,51.8702 L318.105,181.269 L183.968,315.406 L54.5691,186.007
                   L188.706,51.8702 Z" />
</vector>

I include this in simple view:

<View
    android:layout_width="100dp"
    android:layout_height="40dp"
    android:layout_centerInParent="true"
    android:background="@drawable/ic_diamond"
    />

Here, is the result:



回答3:

i fixed with this tutorial here

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="43dp"
        android:left="43dp"
        android:right="43dp"
        android:state_pressed="true"
        android:top="43dp">
        <rotate android:fromDegrees="45">
            <shape>
                <size
                    android:width="200dp"
                    android:height="200dp" />
                <gradient
                    android:endColor="@color/colorPrimaryDark"
                    android:startColor="@color/colorPrimaryDark" />

                <stroke
                    android:width="5dp"
                    android:color="@color/colorPrimary" />
                <corners android:radius="7dp" />
                <padding
                    android:bottom="10dp"
                    android:left="10dp"
                    android:right="10dp"
                    android:top="10dp" />
            </shape>
        </rotate>
    </item>
</layer-list>


回答4:

Here is a drawable resource which creates a 200dp square and rotates it 45° to form a diamond shape:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="50dp"
        android:left="50dp"
        android:right="50dp"
        android:top="50dp">
        <rotate android:fromDegrees="45">
            <shape>
                <size
                    android:width="200dp"
                    android:height="200dp"/>
                <stroke
                    android:width="10dp"
                    android:color="#358165"/>
                <solid android:color="#69BE9E"/>
            </shape>
        </rotate>
    </item>
</layer-list>