使用xml文件装饰控件和一些特效

android:state_pressed 是否按下,如一个按钮触摸或者点击。
android:state_focused 是否取得焦点,比如用户选择了一个文本框。
android:state_hovered 光标是否悬停,通常与focused state相同,它是4.0的新特性
android:state_selected 被选中,它与focus state并不完全一样,如一个list view 被选中的时候,它里面的各个子组件可能通过方向键,被选中了。
android:state_checkable 组件是否能被check。如:RadioButton是可以被check的。
android:state_checked 被checked了,如:一个RadioButton可以被check了。
android:state_enabled  表示是否可用,激活的
android:state_activated 被激活
android:state_window_focused 应用程序是否在前台,当有通知栏被拉下来或者一个对话框弹出的时候应用程序就不在前台了

注意:如果有多个item,那么程序将自动从上到下进行匹配,最先匹配的将得到应用。(不是通过最佳匹配)

1.1按下TextView时文本显示一种颜色,没有按下时显示另一种颜色(一松手颜色就变回去了)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
  <!--位置: res/drawable/text_color.xml   非按下状态显示红色 -->
    <item android:color="#ff0000" android:state_pressed="false"></item>
    <item android:color="#00ffff" android:state_pressed="true"></item>
</selector>

使用:

<!--需要设置clickable="true"-->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:clickable="true"
        android:textColor="@drawable/text_color"
        android:text="文本" />

1.2点击TextView时显示一种颜色,没点击显示另一种,由setEnable(false)方法控制,

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- 设置文字的颜色  当设置为false后,该文本再次点击将无效果,默认为true     灰色-->
    <item android:state_enabled="false" android:color="#000000"/>
    <item android:state_enabled="true" android:color="#82858b"></item>
</selector>

使用方法:

TextView tv=new TextView(MainActivity.this);
tv.setClickable(true);//设置为可点击
 //根据enbled属性改变文本颜色
ColorStateList colorStateList = getResources().getColorStateList(R.drawable.title_color);//该文本为上面的xml文件
tv.setTextColor(colorStateList);
tv.setEnabled(false);//根据该方法来改变字体的颜色
//根据enbled属性改变文本颜色,背景颜色
textView.setBackgroundResource(R.drawable.shoping_select_color);
注意在studio中,这个xml文件需要放在res/color文件下,使用方法:R.color.select_main_text

2.ImageView,按下显示一张图片,非按下显示另一张图片,也需要设置clickable="true"

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/normal" android:state_pressed="false"></item>
    <item android:drawable="@drawable/pressed" android:state_pressed="true"></item>
</selector>
<ImageView 
        android:layout_width="200dp"
        android:layout_height="150dp"
        android:src="@drawable/statelist_drawable"
        android:clickable="true"/>

3.选择时显示一张图片,没有选中时显示另一张 由setSelected(true)方法控制

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- 选中与没选中时显示的图片,由java代码中 setSelected(true)方法决定 -->
    <item android:drawable="@drawable/normal" android:state_selected="false"></item>
    <item android:drawable="@drawable/pressed" android:state_selected="true"></item>
</selector>
<ImageView 
        android:id="@+id/img_icon"
        android:layout_width="200dp"
        android:layout_height="150dp"
        android:src="@drawable/selector_sele_drawable"
        android:clickable="true"/>

注意:也需要设置 android:clickable="true"

4.使用两张图片叠加在一起,合成一张图片给ImageView显示

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/back"></item>
   <!--这种图片在上面那张的上面-->
    <item android:drawable="@drawable/qq"
        android:left="10.0dip" 
        android:top="18.0dip" 
        android:right="25.0dip" 
        android:bottom="35.0dip" ></item>
</layer-list>

引用: 上图位置为: res/drawable/text_color.xml

 <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/text_color" />

效果:由下面两张合成为:

         -------->  

5.level-list(没有过度,直接从一张图片改为显示另一张)的使用:

<?xml version="1.0" encoding="utf-8"?>
<!-- 位置:res/drawable/levelist_drawable.xml -->
<level-list xmlns:android="http://schemas.android.com/apk/res/android" >
  <!-- 灯泡熄灭的图片 -->
   <item
        android:drawable="@drawable/lamp_off"
        android:maxLevel="0" />
   <!-- 灯泡打开的图片 -->
    <item
        android:drawable="@drawable/lamp_on"
        android:maxLevel="1" />
</level-list>

使用的布局文件:

<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:background="#ffcccc"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <ImageView
        android:id="@+id/img_lamp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:src="@drawable/levellist_drawable" />    引用上面的文件

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onON"                单击事件
        android:text="开" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onOFF"              单击事件
        android:text="关" />

</LinearLayout>

主活动:

public class LevelListActivity extends Activity{
    private ImageView imgIcon;
    private boolean isSele = false;//默认状态
    private ImageView imgLamp;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_levellist);
        imgLamp = (ImageView) findViewById(R.id.img_lamp);
        imgLamp.setImageLevel(0);
    }
    
    public void onON(View v){
        imgLamp.setImageLevel(1);//设置imageView显示maxLevel=1的图片
    }
    public void onOFF(View v){
        //设置显示那个图片
        imgLamp.setImageLevel(0);    
    }
}

效果图: 点击按钮开,就显示灯泡亮的那张图片(点击立马就显示)

  

6.transition(过度,图片渐变的从一张显示为另一张的效果)的使用

<?xml version="1.0" encoding="utf-8"?>
<!-- 位置:res/drawable/transition_drawable.xml -->
<transition  xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/lamp_off" />
     <item android:drawable="@drawable/lamp_on" />
</transition >

布局文件:

<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:background="#ffcccc"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <ImageView
        android:id="@+id/img_lamp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:src="@drawable/transition_drawable" />    引用上面的图片

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onON"
        android:text="开" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onOFF"
        android:text="关" />

</LinearLayout>

java代码:

public class TransitionActivity extends Activity{
    private ImageView imgIcon;
    
    private boolean isSele = false;

    private ImageView imgLamp;

    private TransitionDrawable drawable;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_transition);
        //获取ImageView对象
        imgLamp = (ImageView) findViewById(R.id.img_lamp);
        //TransitionDrawable drawable = (TransitionDrawable)imgLamp.getBackground();
        //如果imageview设置图片的属性是background就采用getBackground获得drawable对象
        
        //获得TransitionDrawabl对象,通过imageview对象获取设置在它上面的图片
        drawable = (TransitionDrawable) imgLamp.getDrawable();//获取布局中src属性的图片对象
        
    }
    //打开的单机事件
    public void onON(View v){
        //从灭的那张图片显示为亮的那张图片,持续时间为3秒
        drawable.startTransition(3000);
    }
    //关闭的单机事件
    public void onOFF(View v){
        //逆向渐变图片,从亮的图片渐变为灭的图片
        drawable.reverseTransition(3000);
    }
}

效果图同上,只不过有渐变效果,(就是要显示的那张图片透明度从0-225,用3秒的时间显示出来)

7.clip(修剪)的使用

<?xml version="1.0" encoding="utf-8"?>
<!--位置: res/drawable/clip_drawable.xml -->
<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/jj"
    android:clipOrientation="vertical"
    android:gravity="bottom">
</clip>
 <!--clipOrientation 裁剪的方向
     android:gravity="bottom" 代表从底部开始-->

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:background="#ffcccc"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <ImageView
        android:id="@+id/img_icon"
        android:layout_width="200dp"
        android:layout_height="150dp"
        android:background="@drawable/clip_drawable"
        android:clickable="true" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:onClick="onClip"
        android:text="开始裁剪" />

</LinearLayout>

java代码:

 

public class ClipActivity extends Activity{
    private ImageView imgIcon;
    private ClipDrawable drawable;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_clip);
        imgIcon = (ImageView) findViewById(R.id.img_icon);
        //得到xml布局文件中为ImageView设置的背景图片
        drawable = (ClipDrawable) imgIcon.getBackground();
    }
    
    //按钮单机事件
    public void onClip(View v){
        //需要点击按钮10下才能完全显示出来,每次按等份显示
        drawable.setLevel(drawable.getLevel() + 1000);//level的范围[0,10000],所以这里需要点击10次
    }
}

 

效果图:分别为 没有点击  点击一次 ....  然后完全显示

 

 

posted @ 2016-08-12 14:23  ts-android  阅读(578)  评论(0编辑  收藏  举报