Drawable详解

Drawable分为两种:一种是我们普通的图片资源,在Android Studio中我们一般放到res/mipmap目录下,和以前的Eclipse不一样哦!另外我们如果把工程切换成Android项目模式,我们直接往mipmap目录下丢图片即可,AS会自动分hdpi,xhdpi...!另一种是我们编写的XML形式的Drawable资源,我们一般把他们放到res/drawable目录下,比如最常见的按钮点击背景切换的Selctor!

  • 在XML我们直接通过@mipmap或者@drawable设置Drawable即可比如: android:background = "@mipmap/iv_icon_zhu" / "@drawable/btn_back_selctor"而在Java代码中我们可以通过Resource的getDrawable(R.mipmap.xxx)可以获得drawable资源如果是为某个控件设置背景,比如ImageView,我们可以直接调用控件.getDrawale()同样可以获得drawable对象!
  • Android中drawable中的资源名称有约束,必须是:[a-z0-9_.](即:只能是字母数字及和.),而且不能以数字开头,否则编译会报错: Invalid file name: must contain only [a-z0-9.]!小写啊!!!!小写!!!小写!——重要事情说三遍~

1:ColorDrawable

        当我们将ColorDrawable绘制到Canvas(画布)上的时候,会使用一种固定的颜色来填充

1).Java中定义ColorDrawable:

ColorDrawable drawable = new ColorDrawable(0xffff2200);  
txtShow.setBackground(drawable);  

2).在xml中定义ColorDrawable:

<?xml version="1.0" encoding="utf-8"?>  
<color  
    xmlns:android="http://schemas.android.com/apk/res/android"  
    android:color="#FF0000"/>  

3).建立一个color.xml文件

比如:

<?xml version="1.0" encoding="utf-8"?>  
<resources>  
    <color name="material_grey_100">#fff5f5f5</color>
    <color name="material_grey_300">#ffe0e0e0</color>
    <color name="material_grey_50">#fffafafa</color>
    <color name="material_grey_600">#ff757575</color>
    <color name="material_grey_800">#ff424242</color>
    <color name="material_grey_850">#ff303030</color>
    <color name="material_grey_900">#ff212121</color>
</resources>

然后如果是在xml文件中话我们可以通过@color/xxx获得对应的color值如果是在Java中:

int mycolor = getResources().getColor(R.color.mycolor);    
btn.setBackgroundColor(mycolor);  

ps:另外有一点要注意,如果我们在Java中直接定义颜色值的话,要加上0x,而且不能把透明度漏掉:

int mycolor = 0xff123456;    
btn.setBackgroundColor(mycolor); 

4).使用系统定义好的color:

比如:BLACK(黑色),BLUE(蓝色),CYAN(青色),GRAY(灰色),GREEN(绿色),RED(红色),WRITE(白色),YELLOW(黄色)!用法: btn.setBackgroundColor(Color.BLUE);也可以获得系统颜色再设置:

int getcolor = Resources.getSystem().getColor(android.R.color.holo_green_light);  
btn.setBackgroundColor(getcolor);  

xml中使用:android:background="@android:color/black"


注意:资源获取  R.color.BLACK  这个是获取的是应用自身的资源文件id

获取系统的资源文件id  需要使用android.R.color.


2:LevelListDrawable   不同的状态显示不同的图片  手机电量显示图标



A resource that manages a number of alternate Drawables  
each assigned a maximum numerical value.
Setting the level value of the object with {@link #setLevel(int)} will load the image with the next
greater or equal value assigned to its max attribute.

It can be defined in an XML file with the <level-list> element. Each Drawable level is defined in a nested <item>. For example:

 <level-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:maxLevel="0" android:drawable="@drawable/ic_wifi_signal_1" />
  <item android:maxLevel="1" android:drawable="@drawable/ic_wifi_signal_2" />
  <item android:maxLevel="2" android:drawable="@drawable/ic_wifi_signal_3" />
  <item android:maxLevel="3" android:drawable="@drawable/ic_wifi_signal_4" />
 </level-list>

java代码创建

LevelListDrawable levelListDrawable=new LevelListDrawable();
levelListDrawable.addLevel(0,1,getResources().getDrawable(R.mipmap.abc));

3GradientDrawable 就是我们创建shape资源文件

java代码示例:

GradientDrawable shape = new GradientDrawable();
shape.setColor(0xa6ffffff);
int radiusone = 6;
radiusone = PxToDpUtils.getNumber(radiusone, iv_progress.getContext(), PxToDpUtils.width);
padding = PxToDpUtils.getNumber(padding, iv_progress.getContext(), PxToDpUtils.width);
float[] a = {radiusone, radiusone, radiusone, radiusone, radiusone, radiusone, radiusone, radiusone};
shape.setCornerRadii(a);
//设置图形是圆 方 的等等形状
gradientDrawable.setShape(GradientDrawable.RECTANGLE);


GradientDrawable gd = new GradientDrawable();//创建drawable
gd.setColor(fillColor);
gd.setCornerRadius(roundRadius);
gd.setStroke(strokeWidth, strokeColor);
gd.setGradientType(GradientDrawable.RECTANGLE);
view.setBackgroundDrawable(gd);
        
// 创建渐变的shape drawable
int colors[] = { 0xff255779 , 0xff3e7492, 0xffa6c0cd };//分别为开始颜色,中间夜色,结束颜色
GradientDrawable gradientDrawable = new GradientDrawable(GradientDrawable.Orientation.TOP_BOTTOM, colors);
view.setBackgroundDrawable(gd);
注意setCorner这个api当四个角的弧度一样的时候 直接一个 float参数即可 不一样的时候 就需要一个float数组



 
 

4:BitmapDrawable

bitmap
    |- src="@drawable/res_id"
    |- antialias="[true | false]"
    |- dither="[true | false]"
    |- filter="[true | false]"
    |- tileMode="[disabled | clamp | repeat | mirror]"
    |- gravity="[top | bottom | left | right | center_vertical |
    |            fill_vertical | center_horizontal | fill_horizontal |
    |            center | fill | clip_vertical | clip_horizontal]"
    |
  • src:表示该 BitmapDrawable 引用的位图,该图片为 png、jpg 或者 gif;
  • antialias:表示是否开启抗锯齿
  • dither:表示当位图和屏幕的像素配置不同时,是否允许抖动。比如一张位图的像素为 ARGB_8888 32 位色,而屏幕像素为 RGB_565;
  • filter:是否允许为位图进行滤波以获取平滑的缩放效果;
  • gravity:定义位图的 gravity,当位图小于容器时,该属性指定了位图在容器中的停靠位置绘制方式
  • tileMode:表示当位图小于容器时,执行“平铺”模式,并且指定铺砖的方法。该属性覆盖 gravity 属性——当指定了该属性后,gravity 属性即使设置了,也将不起作用



<bitmap
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/car"
    android:tileMode="repeat"/>

Resources res = getResources();
Bitmap bmp = BitmapFactory.decodeResource(res, R.drawable.adt_48);
BitmapDrawable bitmapDrawable = new BitmapDrawable(res, bmp);
bitmapDrawable.setTileModeX(TileMode.MIRROR);
bitmapDrawable.setGravity(Gravity.CENTER_HORIZONTAL | Gravity.BOTTOM);
4:stateListDrawable 就是

    经常使用的selector

StateListDrawable stalistDrawable = new StateListDrawable();
//获取对应的属性值 Android框架自带的属性 attr
int pressed = android.R.attr.state_pressed;
int focused = android.R.attr.state_focused;

stalistDrawable.addState(new int []{-pressed}, getResources().getDrawable(R.drawable.title_button_back));
stalistDrawable.addState(new int []{pressed}, getResources().getDrawable(R.drawable.title_button_back_h);
stalistDrawable.addState(new int []{-focused }, getResources().getDrawable(R.drawable.title_button_back);
//没有任何状态时显示的图片,我们给它设置我空集合
stalistDrawable.addState(new int []{}, getResources().getDrawable(R.drawable.title_button_back);
注意上面在设置获得焦点 失去焦点的状态时 采用的是负值



5ClipDrawable
clipDrawable=new ClipDrawable(getResources().getDrawable(R.mipmap.abc), Gravity.LEFT,ClipDrawable.HORIZONTAL);
currentLevel=1000;
clipDrawable.setLevel(currentLevel);
one.setBackground(clipDrawable);
注意这个 只能用在view的background上才有效果

1、android:drawable;表示该ClipDrawable引用的drawable资源(这个属性必须有)。
2、android:clipOrientation;表示裁剪的方向。horizontal:水平方向,vertical:垂直方向。
3、android:gravity;指定从哪个地方裁剪。必须是下面一个或多个值(多个值之间用“|”分隔)

  • top 将这个对象放在容器的顶部,不改变其大小,当clipOrientation 是”vertical”,从底部(bottom)开始裁剪。
  • bottom 将这个对象放在容器的底部,不改变其大小。当clipOrientation 是 “vertical”,从顶部(top)开始裁剪。

这个就可以实现进度变化 不停的刷新level实现进度的展示



<clip
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/normal_btn"
    android:clipOrientation="vertical"
    android:gravity="top" />


6LayerDrawable 实现图片重叠效果的Drawable

layer-list
    |- item
    |    |- drawable="@drawable/drawable_id"
    |    |- id="@+id/xxx_id"
    |    |- top="dimension"
    |    |- left="dimension"
    |    |- right="dimension"
    |    |- bottom="dimension"

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/red_color"
        android:bottom="10dp"
        android:left="10dp"
        android:right="10dp"
        android:top="10dp"/>
    <item
        android:drawable="@drawable/green_color"
        android:bottom="20dp"
        android:left="20dp"
        android:right="20dp"
        android:top="20dp"/>
    <item
        android:drawable="@drawable/blue_color"
        android:bottom="30dp"
        android:left="30dp"
        android:right="30dp"
        android:top="30dp"/>
</layer-list>

LayerDrawable layerDrawable=new LayerDrawable(new Drawable[]{
        getResources().getDrawable(android.R.color.holo_red_dark),
        getResources().getDrawable(android.R.color.holo_blue_bright),
        getResources().getDrawable(android.R.color.darker_gray)

});
layerDrawable.setLayerInset(0,0,0,0,0);
layerDrawable.setLayerInset(1,20,20,20,20);
layerDrawable.setLayerInset(2,40,40,40,40);
one.setBackgroundDrawable(layerDrawable);

其实进度条 seekbar就是laylistdrawable和clipdrawable两者的结合体


7:AnimationDrawable 就是帧动画


8ShapeDrawable和上面的GradientDrawable一样














shape资源api详解:

1:shape形状
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape=["rectangle" | "oval" | "line" | "ring"] >

shape资源的形状  直线  矩形  圆  椭圆


2:ring需要几个特殊的标签:

android:innerRadius     圆内的内半径
android:thickness     厚度, 圆环的厚度 = 外半径 - 内半径
innerRadiusRatio     内半径在占整个Drawable宽度的比例
android:thicknessRatio     厚度占整个Drawable的宽度的比例
android:useLevel     一般都应该使用false
demo:ring

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:useLevel="false"
    android:innerRadius="100dp"
     android:thickness="0dp"
    >
    <solid
        android:color="#fe8b00"

        ></solid>
    <stroke
        android:width="5dp"
        android:color="#fab"
        ></stroke>
</shape>


3:solid:填充
android:color指定填充的颜色

注意:<gradient> 渐变效果 (与solid互斥,纯色或者渐变只能要一个)

4:gradient:渐变
android:startColor和android:endColor分别为起始和结束颜色,
android:angle是渐变角度,必须为45的整数倍。
另外渐变默认的模式为android:type="linear",即线性渐变,
可以指定渐变为径向渐变,android:type="radial",径向渐变需要指定半径android:gradientRadius="50"。
angle值对应的位置如图:

    <gradient   
        android:type=["linear" | "radial" | "sweep"]    //共有3中渐变类型,线性渐变(默认)/放射渐变/扫描式渐变    
        android:angle="integer"     //渐变角度,必须为45的倍数,0为从左到右,90为从上到下    
        android:centerX="float"     //渐变中心X的相当位置,范围为0~1    
        android:centerY="float"     //渐变中心Y的相当位置,范围为0~1    
        android:startColor="color"   //渐变开始点的颜色    
        android:centerColor="color"  //渐变中间点的颜色,在开始与结束点之间    
        android:endColor="color"    //渐变结束点的颜色    
        android:gradientRadius="float"  //渐变的半径,只有当渐变类型为radial时才能使用    
        android:useLevel=["true" | "false"] />  //使用LevelListDrawable时就要设置为true。设为false时才有渐变效果    


android:type=["linear" | "radial" | "sweep"]  
android:startColor="color"   //渐变开始点的颜色    
android:centerColor="color"  //渐变中间点的颜色,在开始与结束点之间    
android:endColor="color"    //渐变结束点的颜色    
android:gradientRadius="float"  //渐变的半径,只有当渐变类型为radial时才能使用


5:stroke:描边
android:width="2dp" 描边的宽度,android:color 描边的颜色。
我们还可以把描边弄成虚线的形式,设置方式为:
android:dashWidth="5dp"
android:dashGap="3dp"
其中android:dashWidth表示'-'这样一个横线的宽度,android:dashGap表示之间隔开的距离
dashWidth  dashGap  就是将边缘线条切割开  


6:corners:圆角
android:radius为角的弧度,值越大角越圆。
我们还可以把四个角设定成不同的角度,
同时设置五个属性,则Radius属性无效
android:Radius="20dp"                           设置四个角的半径
android:topLeftRadius="20dp"              设置左上角的半径
android:topRightRadius="20dp"           设置右上角的半径
android:bottomLeftRadius="20dp"      设置右下角的半径
android:bottomRightRadius="20dp"    设置左下角的半径


7:padding:间隔
可以设置上下左右四个方向的间隔

基本属性(corners、gradient、padding、size、solid、stroke)

8:<size    
        android:width="dimension"    
        android:height="dimension" /> 


9:demo:

1:例子:设置矩形

     设置一张图片  矩形图片  图片的radius就是四个角的圆角半径值
     stroke  就是设置我们的矩形图片边缘的宽度与颜色值

<?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="#FF8C69" />

    <stroke
        android:width="5dp"
        android:color="#000000" />

</shape>


2:例子:设置圆圈  圆


个参数讲解:
 
oval表示是圆的意思
solid中的color就是这个圆的填充颜色
stroke标示的就是我们的圆环的颜色值
size表示的就是我们的圆的大小
注意这两个size随后在显示的时候是根据相对比例实现展示的


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

<shape

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

    android:shape= "oval"

    android:useLevel= "false" >

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

    <stroke

        android:width= "1dp"

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

    <size android:width= "20dp"

          android:height= "20dp" />

</shape>



3:椭圆外加边缘线切割效果的demo:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval" >


    <stroke
        android:width="12dp"
        android:color="#fe8b00"
        android:dashWidth="5dp"
        android:dashGap="5dp"
        ></stroke>

    <gradient
        android:startColor="#111111"
        android:centerColor="#666666"
        android:endColor="#cccccc"
        android:type="sweep"
        ></gradient>

    <padding

        android:left="30dp"
        android:right="30dp"
        android:top="10dp"
        android:bottom="10dp"
        ></padding>
    
</shape>



4:直线的demo:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line"
    >
    

<stroke
    android:width="2dp"
   android:color="#fe8b00"
    ></stroke>


</shape>


   Rect其实就是一个矩形区域, 我们可以得到Drawable的矩形区域,

Drawable drawable=getResources().getDrawable(R.mipmap.abc);
//获取图片的宽度高度
Log.e(TAG, "width==" +drawable.getIntrinsicWidth());
Log.e(TAG, "height==" +drawable.getIntrinsicHeight());
Rect rect=drawable.getBounds();//一般针对.9图片使用,获取内容显示区域
drawable.getPadding(rect);








  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值