Skip to content

Latest commit

 

History

History
188 lines (140 loc) · 5.28 KB

Drawable Resources一览.md

File metadata and controls

188 lines (140 loc) · 5.28 KB

文章的GitHub地址：Drawable Resources一览

译者注：之前某个国外开发者大会释放出来的，整理一下记录下来，看看你都会么？

#Bitmap File

bitmap

#Nine-Path File

.9 图片

#Layer List

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android....
	<item
		android:width="40dp"
		android:height="40dp"
		android:drawable="@drawable/ic_activation_01"
		android:gravity="center" />
	<item
		android:width="30dp"
		android:height="30dp"
		android:drawable="@drawable/ic_activation_02"
		android:gravity="center" />
	<item
		android:width="20dp"
		android:height="20dp"
		android:drawable="@drawable/ic_activation_03"
		android:gravity="center" />
</layer-list>

layer list

#State List

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android....
	<item
		android:drawable="@drawable/btn_ok_pressed"
		android:state_enabled="true"
		android:state_pressed="true" />
	<item
		android:drawable="@drawable/btn_ok_disable"
		android:state_enabled="false" />
	<item
		android:drawable="@drawable/btn_ok_normal" />
</selector>

state list

#Level List

要实现一个多状态显示的效果，像下面这样写？

ImageView ivScore = (ImageView)findViewById(R.id.iv_asd);
int score = ...;
if(score == 0) {
	ivScore.setImageResource(R.drawable.ic_score_bad);
} else if(score == 1) {
	ivScore.setImageResource(R.drawable.ic_score_ok);
} else if(score == 2) {
	ivScore.setImageResource(R.drawable.ic_score_good);
}

level list

No 下面才是优雅的方式

<?xml version="1.0" encoding="utf-8"?>
<level-list xmlns:android="http://schemas.android...
	<item
		android:drawable="@drawable/ic_score_bad"
		android:maxLevel="0" />
	<item
		android:drawable="@drawable/ic_score_ok"
		android:maxLevel="1" />
	<item
		android:drawable="@drawable/ic_score_good"
		android:maxLevel="2" />
</level-list>


ImageView ivScore = (ImageView)findViewById(R.id.iv_score);
int score = ...;
ivScore.setImageLevel(score);

#Transition Drawable

用来设置2个图片的渐变效果

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/...
	<item
		android:drawable="@drawable/ic_score_very_bad" />
	<item
		android:drawable="@drawable/ic_score_very_good" />
</transition>

ImageView ivScore = (ImageView) findViewById(R.id.iv_score);
TransitionDrawable drawable =(TransitionDrawable) ivScore.getDrawable();
drawable.startTransition(1000);

transition

drawable.reverseTransition(1000);

transition2

#Inset Drawable

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/...
	android:drawable="@drawable/bg_badge"
	android:insetBottom="10dp"
	android:insetLeft="10dp"
	android:insetRight="10dp"
	android:insetTop="10dp"/>

inset

#Clip Drawable

图片裁剪，可以实现很多很好玩的效果，裁剪范围0-10000，5000也就是裁剪一半

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/...
	android:clipOrientation="horizontal"
	android:drawable="@drawable/ic_rate_very_good"
	android:gravity="left" />

ImageView ivRate = (ImageView) findViewById(R.id.iv_rate);
ClipDrawable drawable = (ClipDrawable) ivRate.getDrawable();
...
drawable.setLevel(5000);

clip

#Scale Drawable

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/...
	android:drawable="@drawable/ic_code_mania"
	android:scaleGravity="center"
	android:scaleHeight="60%"
	android:scaleWidth="60%" />

scale

#Shape Drawable

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/...
	<stroke
		android:width="4dp"
		android:color="#ffffff"
		android:dashGap="10dp"
		android:dashWidth="10dp" />
	<solid
		android:color="#237793" />
	<corners
		android:radius="10dp" />
</shape>

shape

#Drawable Mixing

结合使用

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
	android:clipOrientation="horizontal"
	android:gravity="left">
	<shape>
		<solid
			android:color="#ffd200" />
		<corners
			android:radius="50dp" />
	</shape>
</clip>

mix