美文网首页高级UI
Shape自定义图片

Shape自定义图片

作者: 规诫 | 来源:发表于2019-07-24 15:16 被阅读6次

    使用自定义shap步骤:

    1. 在res下创建drawable目录
    2. 在drawable目录下创建一个根标签为shape的xml文件
    3. 去指定shape的形状及填充颜色等
    4. 在布局资源中使用backgroud属性来引入使用该图形xml

    椭圆(圆)代码

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval" >
        //渐变色
        <gradient android:startColor="#F80101"
            android:centerColor="#0B20BA"
            android:endColor="#1AAE0E"/>
    </shape>
    

    矩形代码

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle" >
        //圆角
        <corners android:radius="30dp"/>
        //填充颜色
        <solid android:color="#FF0000"/>
    </shape>
    

    环形代码

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" 
        android:shape="ring"
        android:innerRadius="20dp"
        android:thickness="19dp"
        android:useLevel="false">
        <!-- android:innerRadius="30dp" 内圆半径
         android:thickness="10dp" 环形宽度 -->
         <!-- 给环形加边框    
             注意:边框的宽度+环形的宽度+内圆的半径=组件宽度的一半 -->
        <stroke android:width="1dp"
            android:color="#FD0202"/>
            <!-- 填充色会填充环形 -->
            <solid android:color="#48C36C"/>
    </shape>
    

    选择器

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android" >
        <!-- android:state_pressed="false"组件没有被按下时显示的背景
        android:drawable="@drawable/rectangle_bg"
         -->
        <item android:state_pressed="false" 
            android:drawable="@drawable/rectangle_bg"></item>
         <!-- android:state_pressed="true"组件被按下时显示的背景
        android:drawable="@drawable/rectangle_bg2"
         -->
        <item android:state_pressed="true" 
            android:drawable="@drawable/rectangle_bg2"></item>
    </selector>
    

    相关文章

      网友评论

        本文标题:Shape自定义图片

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