Android青铜篇-XMLDrawable

Android

Drawable:可直接使用.png、.jpg、.gif、9.png等图片作为资源,也可使用多种XML文件作为资源。就是这些资源都能生成Drawable对象,并对XML文件作出相关处理。



StateListDrawable

作用:StateListDrawable对象所显示的Drawable对象会随着目标组件状态的改变而改变

组成:

1
根元素<selector/>,子元素<item/>

子元素的属性:android:color或android:drawable
android:state_xxx:状态

  • 示例
    1
    2
    3
    4
    5
    6
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false"
    android:drawable="@mipmap/start"/>
    <item android:state_pressed="true"
    android:drawable="@mipmap/start_down"/>
    </selector>

LayerDrawable

作用:可包含一个Drawable数组,系统会按照Drawable对象的数组顺序绘制,索引越大越被绘制在上层

组成:

1
根元素:<layer-list>,子元素:<item/>

子元素的属性:android:drawable 作为LayerDrawable的Drawable对象
android:id 为Drawable对象指定标识符
android:buttom|top…等 指定Drawable的绘制位置

  • 示例一

    1
    2
    3
    4
    5
    6
    7
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--调用android自带的id修改,利用@android:id 修改父style的background-->
    <item android:drawable="@mipmap/p_1"
    android:id="@android:id/background"/>
    <item android:drawable="@mipmap/p_2"
    android:id="@android:id/progress"/>
    </layer-list>
  • 示例二

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--可以在item里面创建各种各样的XMLDrawable-->
    <item>
    <bitmap android:src="@mipmap/p_3"
    android:gravity="center"/>
    </item>
    <item>
    <bitmap android:src="@mipmap/p_4"
    android:gravity="center"/>
    </item>
    </layer-list>

ShapeDrawable

作用:设置一个基本的几何图形(矩形、圆形、线条灯)

根元素:<shape/>
根元素的属性:android:shape=[“rectangle”|”oval”|”line”|”ring”]

子元素:

1
2
3
4
5
6
<corners/>:设置整体或者四个边角的弧度
<gradient/>:渐变(可选择渐变的角度但必须是45的倍数,默认为0,渐变的中心点,渐变的类型,渐变的半径和开始和终止的颜色)
<padding/>:内边距 (可以控制四周的边距)
<size/>:形状的大小 (设置形状的宽高)
<solid/>:单种颜色填充
<stroke/>:绘制边框 (可设置画笔的颜色和粗细 并 设置每画一条线的长度和间距且必须两者都设置才有效)

  • 示例
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="3dp"/>
    <padding android:left="7dp"
    android:right="7dp"
    android:bottom="7dp"
    android:top="7dp"/>
    <gradient android:angle="45"
    android:startColor="#0000"
    android:endColor="#ffff"/>
    </shape>

ClipDrawable

作用:从Drawable上截取一个“图片片段”

根元素:<clip>,不使用子元素。
根元素属性: android:drawable: 选定Drawable对象
android:clipOrientation:指定截取方向
android:gravity:从什么地方开始截取

总结:选定图片并选择方向与位置截取图片

使用:从java中获取ClipDrawable并用setLevel()改变截取大小 //setLevel()只能从0~10000

  • 示例

    • Drawbale

      1
      2
      3
      4
      5
      6
      <!--res/drawable/test_clip.xml-->
      <clip xmlns:android="http://schemas.android.com/apk/res/android"
      android:drawable="@mipmap/start"
      android:clipOrientation="horizontal"
      android:gravity="center">
      </clip>
    • Layout

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      <!--res/layout/activity_main.xml-->
      <LinearLayout
      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:orientation="vertical"
      tools:context="com.chen.android.test.MainActivity">
      <ImageView
      android:id="@+id/imageView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:src="@drawable/test_clip"/>
      </LinearLayout>
    • Activity

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      33
      34
      35
      36
      37
      /*实现图片渐渐展开的效果*/
      public class MainActivity extends AppCompatActivity {
      int data = 0;
      int what = 0X11;
      @Override
      protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      ImageView img = (ImageView)findViewById(R.id.imageView);
      //ImageView.getDrawable()获取的是当前控件里的图片,返回的是Drawable类型,还有说明Drawable对象可随意变成子对象并调用子对象的方法
      final ClipDrawable clipDrawable = (ClipDrawable)img.getDrawable();
      //创建Handler等待计时器传送的信息,使图片扩展
      final Handler mHandler = new Handler(){
      @Override
      public void handleMessage(Message msg) {
      super.handleMessage(msg);
      if (msg.what == what){
      clipDrawable.setLevel(data);//扩大截取的图片面积
      data += 200;
      }
      }
      };
      //创建计时器
      final Timer timer = new Timer();
      timer.schedule(new TimerTask() {
      @Override
      public void run() {
      if (data >= 10000){
      timer.cancel();
      }
      mHandler.obtainMessage(what).sendToTarget();
      }
      },0,300);
      }
      }

AnimationDrawable

简介:放在res/anim下,支持逐帧动画和补间动画

根元素:<set>
根元素属性:android:interpolator=”参数”
参数:@android:anim/ 为开头 选择 linear_interpolator:匀速变换 | accelerate_interpolar:加速变换 | decelerate_interpolator:减速变换
android:shareInterpolator= “true|false” :是否让资源的interpolator与根元素相同
android:duration=”时间”:定义持续时间

子元素(同样可以设置duration):

1
2
3
4
<alpha>:设置开始和结束的透明度
<scale>:设置缩放的中心、开始的X,Y的尺寸和结束时X,Y的尺寸
<translate>:设置图片的开始位置和结束位置进行位移
<rotate>:设置旋转的中心、开始的角度和结束时候的角度

注意:利用android:fillAfter=”true|false”:设置保留后的状态(哪个状态想保留就用这个,如果都像就放在中)

使用:利用AnimationUtils的静态方法loadAninmation(Context context,int resId)

  • 示例

    • Drawbale

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      <!--在res/anim/test_animtaion中-->
      <set xmlns:android="http://schemas.android.com/apk/res/android"
      android:interpolator="@android:anim/linear_interpolator"
      android:shareInterpolator="true"
      android:fillAfter="true">
      <alpha android:fromAlpha="50.0"
      android:toAlpha="100.0"
      />
      <scale android:pivotX="50%"
      android:pivotY="50%"
      android:fromXScale="1.0"
      android:fromYScale="1.0"
      android:toXScale="1.5"
      android:toYScale="1.5"
      android:duration="3000"
      />
      <translate android:fromXDelta="30"
      android:toXDelta="300"
      android:fromYDelta="40"
      android:toYDelta="90"
      android:duration="3000"/>
      </set>
    • Activity

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      /*实现动画*/
      public class MainActivity extends AppCompatActivity {
      @Override
      protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      ImageView img = (ImageView)findViewById(R.id.imageView);
      /*利用工具类获取对象*/
      Animation animation= AnimationUtils.loadAnimation(this,R.anim.test_animation);
      /*将动画附加在图片上*/
      img.startAnimation(animation);
      }
      }
谢谢老板,请尽情用红包来蹂躏我吧!!!
0%