Android圆形图像按钮与形状和矢量

时间:2017-07-03 06:39:17

标签: android xml performance android-cardview

我正在尝试使用文本和阴影创建圆形图像按钮列表,如下图所示:

enter image description here

我尝试使用“Card View”和Shape以及回收视图,但没有任何东西给我我想要的结果。 我检查一些现有的库,但他们正在处理图像并重新绘制它以获得结果,这是一个巨大的内存消耗。

修改

这是我使用的代码: circle.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false">
        <shape android:shape="ring">
            <solid android:color="#0dbe00"/>
        </shape>
    </item>
    <item android:state_pressed="true">
        <shape android:shape="ring">
            <solid android:color="#c20586"/>
        </shape>
    </item>
</selector>

img.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/pic_one" />
    <item android:drawable="@drawable/circle" />

</layer-list>

bg_user.xml

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:viewportWidth="1000"
    android:viewportHeight="1000"
    android:width="1000dp"
    android:height="1000dp">
    <path
        android:pathData="M329.6 725.6H55.2C122 857.1 245.1 955.1 393 987.4c34.4 7.5 70.1 11.6 106.8 11.6 194.3 0 362.5 -111.2 444.9 -273.4z"
        android:fillColor="#000000"
        android:fillAlpha="0.8" />
    <path
        android:pathData="M998.5 500.3C998.5 775.8 775.2 999 499.8 999 224.3 999 1 775.7 1 500.3 1 224.8 224.3 1.5 499.8 1.5c275.4 0 498.7 223.3 498.7 498.8z"
        android:strokeWidth="10"
        android:strokeColor="#000000"
        android:strokeMiterLimit="10" />
</vector>

活动布局:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/parent_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#202230"
    android:orientation="vertical">

    <RelativeLayout
        android:id="@+id/circle_layout"
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/bg_user">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/img"/>

        <View
            android:id="@+id/seprater_viewtv"
            android:layout_width="match_parent"
            android:layout_height="5dp"
            android:layout_above="@+id/rating_viewtv"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:background="@android:color/black" />

        <TextView
            android:id="@+id/rating_viewtv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="3dp"
            android:text="4.5"
            android:textColor="@android:color/black" />
    </RelativeLayout>
    <android.support.v7.widget.CardView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:elevation="12dp"
        android:id="@+id/view2"
        android:layout_centerHorizontal="true"
        android:innerRadius="0dp"
        android:shape="ring"
        android:background="@drawable/bg_user"
        app:cardCornerRadius="100dp"
        android:thicknessRatio="1.9">
        <ImageView
            android:layout_height="match_parent"
            android:layout_width="match_parent"
            android:id="@+id/imageView1"
            android:src="@drawable/pic_one"
            android:layout_alignParentTop="true">
        </ImageView>
    </android.support.v7.widget.CardView>

</LinearLayout>

这是我得到的结果:

enter image description here

0 个答案:

没有答案