Android shape的使用实现圆角,虚线,渐变等效果
2014-05-27 15:10
浏览(1481)
Android shape的使用实现圆角,虚线,渐变等效果,有需要的朋友可以参考下。
输入框或者是一些按钮的背景都喜欢使用圆角的效果或者是渐变的效果,你可以使用背景图片来实现,但是这样会非常耗费资源应该尽量的减少使用图片资源,这时我们就可以使用shape来实现此效果。(1)在res/drawable下定义一个xml文件用于定义shape;(2)在代码中或者在xml文件中将此shape作为背景就可以实现圆角效果。接下来我们详细的介绍一下shape。
<?xml version="1.0" encoding="UTF-8"?> <!-- android:shape 一共有四种值 rectangle:矩形, oval:椭圆形,line:线性,ring:环形 下面的属性只有在android:shape="ring时可用: android:innerRadius 尺寸,内环的半径。 android:innerRadiusRatio 浮点型,以环的宽度比率来表示内环的半径, 例如,如果android:innerRadiusRatio,表示内环半径等于环的宽度除以5,这个值是可以被覆盖的,默认为9. android:thickness 尺寸,环的厚度 android:thicknessRatio 浮点型,以环的宽度比率来表示环的厚度,例如,如果android:thicknessRatio="2", 那么环的厚度就等于环的宽度除以2。这个值是可以被android:thickness覆盖的,默认值是3. android:useLevel boolean值,如果当做是LevelListDrawable使用时值为true,否则为false. --> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <!-- 内部填充 android:color 颜色值 填充颜色 --> <solid android:color="#FFFFFF" /> <!-- 圆角 android:radius 整型 整体半径 android:topLeftRadius 整型 左上角半径 android:topRightRadius 整型 右上角半径 android:bottomLeftRadius 整型 左下角半径 android:bottomRightRadius 整型 右下角半径 --> <corners android:bottomLeftRadius="10dp" android:bottomRightRadius="10dp" android:topLeftRadius="10dp" android:topRightRadius="10dp" /> <!-- 描边 android:width 整型 描边的宽度 android:color 颜色值 描边的颜色 android:dashWidth 整型 表示描边的样式是虚线的宽度, 值为0时,表示为实线。值大于0则为虚线。 android:dashGap 整型 表示描边为虚线时,虚线之间的间隔 即“ - - - - ” 如果android:dashGap的值为0或者不设置的时候一样此时都是实线,android:dashWidth的值为 每个破折号的宽度而android:dashGap表示的是破折号间的距离。 --> <stroke android:dashGap="6dp" android:dashWidth="30dp" android:width="3dp" android:color="#ffa8abad" /> <!-- size 大小 android:width 整型 宽度 android:height 整型 高度 可以与stroke联合使用 可以设置一条实线或者虚线是with或者height设置为1dp --> <size android:width="600dp" /> <!-- 内边距,即内容与边的距离 android:left 整型 左内边距 android:top 整型 上内边距 android:right 整型 右内边距 android:bottom 整型 下内边距 --> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> <!-- 渐变色 android:startColor 颜色值 起始颜色 android:endColor 颜色值 结束颜色 android:centerColor 整型 渐变中间颜色,即开始颜色与结束颜色之间的颜色 android:angle 整型 渐变角度(PS:当angle=0时,渐变色是从左向右。 然后逆时针方向转,当angle=90时为从下往上。angle 必须为45的整数倍) android:type ["linear" | "radial" | "sweep"] 渐变类型(取值:linear、radial、sweep) linear 线性渐变,这是默认设置 radial 放射性渐变,以开始色为中心。 sweep 扫描线式的渐变。 android:useLevel ["true" | "false"] 如果要使用LevelListDrawable对象,就要设置为true。设置为true无渐变。false有渐变色 android:gradientRadius 整型 渐变色半径.当 android:type="radial" 时才使用。单独使用 android:type="radial"会报错。 android:centerX 整型 渐变中心X点坐标的相对位置 android:centerY 整型 渐变中心Y点坐标的相对位置 --> <gradient android:angle="45" android:endColor="#80FF00FF" android:startColor="#FFFF0000" /> </shape>
使用此shape直接将此设置为背景即可,若果想要每个圆角不一样设置各个方向的圆角值即可,没有圆角可以设置为0.1dp
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:test="http://schemas.android.com/apk/res/com.example.activityanimationdemo" android:layout_width="match_parent" android:layout_height="match_parent" > <Button android:id="@id/btn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:padding="@dimen/padding_medium" android:text="click me" tools:context=".MainActivity" /> <TextView android:id="@+id/text" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <com.example.activityanimationdemo.MyImageView android:id="@+id/myImageView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignRight="@id/btn" android:layout_below="@+id/text" android:layout_marginRight="73dp" android:layout_marginTop="14dp" test:borderColor="@color/green" test:borderSize="5dip" android:src="@drawable/ic_launcher" /> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/myImageView1" android:layout_below="@+id/myImageView1" android:layout_marginTop="21dp" android:background="@drawable/image_bg" android:src="@drawable/ic_launcher" /> <EditText android:id="@+id/editText1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/btn" android:layout_centerHorizontal="true" android:layout_marginTop="30dp" android:ems="10" android:background="@drawable/image_bg" android:inputType="textPostalAddress" > <requestFocus /> </EditText> </RelativeLayout>