shape的xml用法


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"   
android:layout_height="match_parent" >
<!--注意 android:background="@drawable/btn_selector"-->    
<Button 
android:id="@+id/Button1"        
android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:layout_centerInParent="true"        
android:background="@drawable/btn_selector"         
android:text="@string/hello_world" /> 
</RelativeLayout>

drawabel下创建一个selector的xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">     
<!-- Button正常状态下的背景 -->    
<item android:drawable="@drawable/btn_bg_normal" 
android:state_pressed="false"/>    
<!-- Button按下时的背景 -->   
<item android:drawable="@drawable/btn_bg_pressed" 
android:state_pressed="true"/>
</selector>

在drawable 目录下新建两个 shape文件分别是btn_bg_normal.xml,和btn_bg_pressed.xml文件

btn_bg_normal.xml


<?xml version="1.0" encoding="utf-8"?>

<!-- 按钮正常的时候的背景 -->

<!-- shape的默认形状是rectangle,还有oval(椭圆),line(线),ring(圆环),我就用过rectangle,其他的大家可以试一试 -->

<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 矩形的圆角弧度 -->

    <corners android:radius="10dp" />

    <!-- 矩形的填充色 -->

    <solid android:color="#FF4081" />

    <!-- 矩形的边框的宽度,每段虚线的长度,和两段虚线之间的颜色和颜色 -->

    <stroke

        android:width="1dp"

        android:dashWidth="8dp"

        android:dashGap="4dp"

        android:color="#4eb621" />

</shape>

btn_bg_pressed.xml


<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 矩形的圆角弧度 -->

    <corners android:radius="10dp" />

    <!-- 矩形的填充色 -->

    <solid android:color="#3F51B5" />

    <!-- 矩形的边框的宽度,每段虚线的长度,和两段虚线之间的颜色和颜色 -->

    <stroke

        android:width="1dp"

        android:color="#4eb621"

        android:dashGap="4dp"

        android:dashWidth="8dp" />

</shape>

 

注意 stroke 是指shape的边界线;

gradient是渐变线的api


angle:角度,当 android:type=“linear”时有效 ,亿45度为单位,逆时针方向旋转

centerX:Float。渐变色中心的 X 相对位置( 0-1.0 )。当 android:type=“linear”时无效 

centerY:Float。渐变色中心的 Y 相对位置( 0-1.0 )。当 android:type=“linear”时无效 

centerColor:color。可选的颜色,出现在 start 和 end 颜色之间。 

gradientRadius:Float。渐变色的半径。当 android:type=“radial” 时有效。 

startcolor:开始的颜色 

endcolor:结束的颜色 

type:渐变色的样式。有效值为: 

“linear”:线性渐变,默认值 

“radial”:环形渐变。 start 颜色是处于中间的颜色 

“sweep”:扇形渐变 

useLevel:Boolean。“ true ”表示可以当作 LevelListDrawable 使用(没搞懂是什么意思)

如果我们想给一个TextView 添加这样一个背景,一层背景是白色的,另外一层是蓝色的但是只露出来一部分,就可以使用layer-list实现。


<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    

	<!--最近的项目中需要用到多个图层堆叠到一块儿,就研

	究了一下android中的layer-list。android中的layer-list

	就是用来多个图层堆叠显示的。 -->

    <item>

      <shape > <!-- 第一层的颜色为蓝色 -->

          <solid android:color="@color/blue"/>

      </shape>

    </item>

    

    <!-- 第二层的颜色,也就是最上面的一层,因为第二层相对于

    View的底部上移两个dp所以第一层会露出一个dp的黑色所以

         给人一种只有底部边框的假象 -->

    <item android:bottom="2dip">

        <shape>

            <solid android:color="@color/white"/>

        </shape>

    </item>

 

</layer-list>


<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

 

    <!--上面的为背景的底层-->

    <item>

        <shape android:shape="rectangle">

            <solid android:color="@color/colorPrimary" />

        </shape>

    </item>

 

    <!--背景上面的图层 让底部的背景露出来4dp的高度-->

    <item android:bottom="4dp">

        <shape android:shape="rectangle">

            <solid android:color="@color/colorAccent" />

        </shape>

    </item>

</layer-list>

效果图:


<?xml version="1.0dip" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

	

    <item>

        <bitmap android:src="@drawable/ic_launcher"

            android:gravity="center"/>

    </item>

    <item android:left="10dip" android:top="10dip">

        <bitmap android:src="@drawable/ic_launcher"

            android:gravity="center"/>

    </item>

    <item android:left="20dip" android:top="20dip">

        <bitmap android:src="@drawable/ic_launcher"

            android:gravity="center"/>

    </item>

    <item android:left="30dip" android:top="30dip">

        <bitmap android:src="@drawable/ic_launcher"

            android:gravity="center"/>

    </item>

 

</layer-list>

效果图   效果图片

总结:

1、corners定义四个弧度:

radius 设置4个角的弧度、topLeftRadius设置左上角的弧度、topRightRadius设置右上角的弧度、bottomLeftRadius设置左下角的弧度、bottomRightRadius设置右下角的弧度

2、gradient渐变色填充

angle 渐变方向,逆时针

startColor 开始渐变色

centerColor 中间渐变色

endColor 最终渐变色

type 渐变的样式【linear' 线性】【radial默认是从中心开始的环形渐变效果】

gradientRadius 渐变的半径,只有type=radial有效

centerX 渐变开始的中心店x相对坐标(0-1.0),对type=linear有效

centerY渐变开始的中心店Y相对坐标(0-1.0),对type=linear有效

3、padding定义四个位置的内边距

left|top|right|bottom

4、size 定义图形的大小

5、solid 单色填充,里面只有一个color属性

6、stroke 为图形绘制边框

width 边框线的厚度

color 边框线的颜色

dashWidth 虚线的长度

dashGap 虚线之间的距离

 

 

 

 

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值