美文网首页代码片段分享
圆形背景图标 (button),点击变色,简单实现

圆形背景图标 (button),点击变色,简单实现

作者: 花艺荣 | 来源:发表于2019-12-11 16:57 被阅读0次

    如图 实现右侧上传button,点击整体变色


    Screenshot_20191211-165118_FileManager.jpg

    核心代码

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    
        <item android:state_pressed="true">
            <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
                <item>
                    <shape xmlns:android="http://schemas.android.com/apk/res/android"
                        android:shape="oval"
                        android:useLevel="false">
                        <solid android:color="#26000000" />
                        />
                    </shape>
                </item>
                <item android:drawable="@drawable/cloud_upload_pressed" />
            </layer-list>
        </item>
    
        <item android:state_pressed="false">
            <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
                <item>
                    <shape xmlns:android="http://schemas.android.com/apk/res/android"
                        android:shape="oval"
                        android:useLevel="false">
                        <solid android:color="#8d000000" />
                        />
                    </shape>
                </item>
                <item android:drawable="@drawable/cloud_upload" />
            </layer-list>
        </item>
    </selector>
    

    使用简单

    <TextView
            android:id="@+id/videoUpload"
            android:layout_width="50dp"
            android:layout_height="50dp"
            ..........
            android:background="@drawable/upload_bg"
            android:clickable="true" 
            android:onClick="uploadTo..."/>
    

    注意点:
    透明背景图片,图片应留有一定padding

    shape

    <?xml version="1.0" encoding="utf-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape=["rectangle" | "oval" | "line" | "ring"] >
        <corners
            android:radius="integer"
            android:topLeftRadius="integer"
            android:topRightRadius="integer"
            android:bottomLeftRadius="integer"
            android:bottomRightRadius="integer" />
        <gradient
            android:angle="integer"
            android:centerX="integer"
            android:centerY="integer"
            android:centerColor="integer"
            android:endColor="color"
            android:gradientRadius="integer"
            android:startColor="color"
            android:type=["linear" | "radial" | "sweep"]
            android:useLevel=["true" | "false"] />
        <padding
            android:left="integer"
            android:top="integer"
            android:right="integer"
            android:bottom="integer" />
        <size
            android:width="integer"
            android:height="integer" />
        <solid
            android:color="color" />
        <stroke
            android:width="integer"
            android:color="color"
            android:dashWidth="integer"
            android:dashGap="integer" />
    </shape>
    

    相关文章

      网友评论

        本文标题:圆形背景图标 (button),点击变色,简单实现

        本文链接:https://www.haomeiwen.com/subject/ayfagctx.html