Форма Android: круг с отметкой

Question

Я пытаюсь получить круг с отметкой в ​​середине, используя рисованную фигуру.

Это то, что я хотел бы:

Не могли бы вы предложить мне, как подойти к нему?

Answer 1

Попробуйте перейти с вектором Drawable. Если у вас есть два или более различных рисунка, вы можете сделать из них слой.

Однако сработает следующий код.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="#fff"/>
            <size
                android:width="30dp"
                android:height="30dp"/>
        </shape>
    </item>

    <item
        android:width="18dp"
        android:height="3dp"
        android:top="15dp"
        android:right="17dp"
        android:gravity="center">
        <rotate
            android:fromDegrees="40">
            <shape android:shape="rectangle">
                <solid android:color="#D6006C"/>
            </shape>
        </rotate>
    </item>

    <item
        android:width="30dp"
        android:height="3dp"
        android:left="12dp"
        android:top="4dp"
        android:gravity="center"
        >
        <rotate
            android:fromDegrees="-50">
            <shape android:shape="rectangle">
                <solid android:color="#D6006C"/>
            </shape>
        </rotate>
    </item>

    <item
        android:width="60dp"
        android:height="60dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent"/>
        </shape>
    </item>

</layer-list>

Answer 2

Вы можете попробовать это

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size
                android:width="32dp"
                android:height="32dp" />
            <solid android:color="#fff" />
        </shape>
    </item>
    <item
        android:width="18dp"
        android:height="4dp"
        android:gravity="center"
        android:right="18dp"
        android:top="15dp">
        <rotate android:fromDegrees="40">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-180"
                    android:endColor="#FF0066"
                    android:startColor="#D6006C" />
            </shape>
        </rotate>
    </item>
    <item
        android:width="64dp"
        android:height="64dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:width="32dp"
        android:height="4dp"
        android:gravity="center"
        android:left="12dp"
        android:top="4dp">
        <rotate android:fromDegrees="-50">
            <shape android:shape="rectangle">
                <gradient
                    android:angle="-90"
                    android:endColor="#FF0066"
                    android:startColor="#D6006C" />
            </shape>
        </rotate>
    </item>
</layer-list>

Answer 3

Сначала создайте вектор со значком галочки с градиентом "ic_tick_vector" Требуется API 21 или выше

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

<path
    android:pathData="M9,16.17L4.83,12l-1.42,1.41L9,19 21,7l-1.41,-1.41z"
    android:strokeColor="?android:attr/colorAccent"
    android:strokeWidth="0">
    <aapt:attr name="android:fillColor">
        <gradient
            android:endX="10"
            android:endY="20"
            android:startX="1"
            android:startY="20"
            android:type="linear">
            <item
                android:color="?android:attr/colorAccent"
                android:offset="0.0" />

            <item
                android:color="?android:attr/colorPrimaryDark"
                android:offset="1.0" />
        </gradient>
    </aapt:attr>
</path>

<path android:strokeWidth="0.1"
    android:strokeColor="@color/colorAccent"
    android:pathData="M0,80 H100" />
</vector>

, затем создайте рисование с фоном круга "round_background"

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">

    <shape android:shape="oval">

        <stroke android:color="#557C7373" android:width="10dp"/>
        <solid android:color="@color/lightBlue"/>
        <size android:width="150dp" android:height="150dp"/>

    </shape>
</item>
<item>
    <shape android:shape="oval">
        <solid android:color="@color/white"/>
        <size android:width="100dp" android:height="100dp"/>

    </shape>
</item>


</selector>

Использованиеэто в вашем изображении теперь у вас будет закругленный фон с галочкой в ​​центре (градиент)

<ImageView
     android:background="@drawable/round_background"

     android:layout_gravity="center"
     android:src="@drawable/ic_tick_vector" />

Answer 4

Это создаст галочку с градиентной галочкой.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="#fff"/>
            <size
                android:width="30dp"
                android:height="30dp"/>
        </shape>
    </item>
    <item
        android:width="18dp"
        android:height="3dp"
        android:top="15dp"
        android:right="17dp"
        android:gravity="center">
        <rotate
            android:fromDegrees="40">
            <shape android:shape="rectangle">
                <solid android:color="#D6006C"/>
            </shape>
        </rotate>
    </item>
    <item
        android:width="30dp"
        android:height="3dp"
        android:left="12dp"
        android:top="4dp"
        android:gravity="center"
        >
        <rotate
            android:fromDegrees="-50">
            <shape android:shape="rectangle">
                <gradient android:startColor="#D6006C"
                    android:endColor="#491F2B"/>
            </shape>
        </rotate>
    </item>
    <item
        android:width="60dp"
        android:height="60dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent"/>
        </shape>
    </item>
</layer-list>

Answer 5

Попробуйте это:

<vector  android:height="45dp"
android:viewportHeight="45" android:viewportWidth="45"
android:width="45dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#F2F2F2" android:fillType="evenOdd"
    android:pathData="M22.5,22.5m-22.5,0a22.5,22.5 0,1 1,45 0a22.5,22.5 0,1 1,-45 0"
    android:strokeColor="#00000000" android:strokeWidth="1"/>
<path android:fillColor="#F7286F" android:fillType="nonZero"
    android:pathData="M21.7692,31.1334C20.5904,32.2889 18.6777,32.2889 17.4994,31.1334L10.8841,24.6492C9.7053,23.4943 9.7053,21.6195 10.8841,20.4646C12.0623,19.3092 13.975,19.3092 15.1538,20.4646L19.0952,24.3274C19.3928,24.6185 19.8758,24.6185 20.1739,24.3274L30.8462,13.8666C32.0244,12.7111 33.9371,12.7111 35.1159,13.8666C35.682,14.4214 36,15.1742 36,15.9589C36,16.7435 35.682,17.4963 35.1159,18.0511L21.7692,31.1334Z"
    android:strokeColor="#00000000" android:strokeWidth="1"/>

Это нарисовано как показано ниже:

Answer 6

Этот код должен работать:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        tools:ignore="UnusedResources">
<item>
    <shape android:shape="oval">
        <solid android:color="@android:color/black"/> //enter the color you want
        <size
            android:width="64dp"
            android:height="64dp"/>
    </shape>
</item>
<item>
    <bitmap android:src="@drawable/ic_check_white_36dp"
            android:gravity="center"/>
</item>