Android UIAndroid知识Android开发

安卓中的Drawable资源文件

2017-02-27  本文已影响88人  amosbake

<h1> layer-list </h1>
layer-list 是将一系列图片叠加放置来形成所需要的图片,格式形如

<layer-list>
    <item android:drawable="@mipmap/bottom" />
    <item android:drawable="@mipmap/top"/>
</layer-list>

叠放顺序是顺序叠加,即第一个item在最下方,最后一个item在最上方,
item可以设置的属性有

 <itemandroid:drawable="@[package:]drawable/drawable_resource"
        android:id="@[+][package:]id/resource_name"
        android:top="dimension"
        android:right="dimension"
        android:bottom="dimension"
        android:left="dimension" />

操作这些属性可以实现图片的错位叠加.
在实际应用中,还遇到的就是复杂边框的实现,如虚线+复制背景边框,因为虚线边框在代码中易实现,但不易做成图片,同时要实现图片的层次叠加效果,就可以写成如下形式

<layer-list>
   <item>
        <shape android:shape="rectangle">
            <padding android:bottom="4dp"
                     android:top="4dp"
                     android:left="4dp"
                     android:right="4dp"/>
            <solid android:color="@color/white"/>
            <corners android:radius="20dp"/>
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <stroke
                android:color="#cdb78c"
                android:width="1.5dp"
                android:dashGap="4dp"
                android:dashWidth="6dp"/>
            <solid android:color="#f1e3c0"/>
            <corners android:radius="10dp"/>
        </shape>
    </item>
</layer-list>

为下部的图片设置padding,就可以使上面显示的图片留有一定的内边距
如果下部的图片是引用的,则可以把上面的图片设置为Inset Drawable 可以达到同样的效果

<h2> level-list </h2>
level-list 可以很方便地根据单一参数的变化来显示不同的图片,系统控件中如电量,网络信号强度都是用此方式来实现的,如下

 <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>

view_wifi.setLevel(getWifiLevel()); 这样就省去了多分支判断的过程

<h2> transtition </h2>
Transition 可以使两张图片切换时有淡入淡出的动画效果

<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/on" />
    <item android:drawable="@drawable/off" />
</transition>

layout 文件中使用

<ImageButton
    android:id="@+id/button"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/transition" />

代码设置点击事件

  if (ibTrans.getDrawable() instanceof TransitionDrawable){
                    TransitionDrawable drawable = (TransitionDrawable) ibTrans.getDrawable();
                   // drawable.startTransition(500);// 最终不切换图片
                    drawable.reverseTransition(500);
  }

<h2> insert </h2>
把图片按一定内边距嵌入到控件中去

<inset
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/drawable_resource"
    android:insetTop="dimension"
    android:insetRight="dimension"
    android:insetBottom="dimension"
    android:insetLeft="dimension" />

<h2> clip </h2>
progressbar 中常用的,按level 裁剪drawable 以达到显示进度的效果,注意drawable不能是.9图

<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:clipOrientation="horizontal"
    android:gravity="left"
    android:drawable="@drawable/white_progress">
</clip>
 <ImageView
        android:id="@+id/progress"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/clip_progress"/>
private static final int LEVEL_MAX = 10000;
mAnimator = ObjectAnimator.ofInt(mClipDrawable, "level", target > LEVEL_MAX ? LEVEL_MAX : target);
  mAnimator.start();
上一篇下一篇

猜你喜欢

热点阅读