美文网首页
Drawable的使用之形状绘制

Drawable的使用之形状绘制

作者: saofeng | 来源:发表于2017-06-13 15:15 被阅读57次

    利用 StateListDrawable 根据对象的状态,使用多个不同的图像来表示同一个图形,语法是我们常用到的<selector>,加上形状可绘制对象GradientDrawable

    call_down_selector.xml

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_pressed="true">
            <shape android:shape="oval">
                <gradient android:angle="270" android:endColor="#be2626" android:startColor="#da4444"></gradient>
                <corners android:radius="45dp"></corners>
                <!-- <size
                     android:width="90dp"
                     android:height="90dp"></size>-->
            </shape>
         </item> 
    
        <item>
            <shape android:shape="oval">
                <gradient android:angle="270" android:endColor="#d42a2a" android:startColor="#f34c4c"></gradient>
                <corners android:radius="45dp"></corners>
                <!-- <size
                     android:width="90dp"
                     android:height="90dp"></size>-->
            </shape>
        </item>
    </selector>
    

    call_up_selector.xml

    <?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="rectangle">
                <gradient android:angle="270" android:endColor="#115e8e" android:startColor="#1886c9"></gradient>
                <corners android:radius="45dp"></corners>
            </shape>
        </item>
    
    
        <item>
            <shape android:shape="rectangle">
                <gradient android:angle="270" android:endColor="#13699e" android:startColor="#1b95e0"></gradient>
                <corners android:radius="45dp"></corners>
            </shape>
        </item>
    </selector>
    

    activity_main.xml

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:weightSum="1">
    
        <ImageView
            android:id="@+id/myimage"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:background="@drawable/call_down_selector"
            android:scaleType="center"
            android:src="@drawable/call_down" />
    
        <ImageView
            android:id="@+id/myimage2"
            android:layout_width="230dp"
            android:layout_height="90dp"
            android:layout_marginLeft="20dp"
            android:background="@drawable/call_up_selector"
            android:scaleType="center"
            android:src="@drawable/call_up" />
    </Line
    

    注意 :android:scaleType="center" 可以保证src 资源不会缩放

    Paste_Image.png

    也可以这样使用
    xx_selector.xml

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

    pressed__button.xml

    <?xml version="1.0" encoding="UTF-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <!-- 填充的颜色,渐变色 -->
        <gradient
            android:startColor="#da4444"
            android:endColor="#be2626"
            android:angle="270" />
        <!-- 设置按钮的四个角为弧形 -->
        <!-- android:radius 弧形的半径 -->
        <corners android:radius="0dip" />
        <!-- padding:Button里面的文字与Button边界的间隔 -->
        <padding
            android:left="0dp"
            android:top="0dp"
            android:right="0dp"
            android:bottom="0dp"
            />
    </shape>
    

    也就是进一步分离,有利于复用性。使用时可根据需求和个人喜好使用不同的组合形式。

    详细可参考 GradientDrawable
    xml中使用可参考 Drawable Resources.

    相关文章

      网友评论

          本文标题:Drawable的使用之形状绘制

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