Android美工坊--selector选择器的使用

转载 2012年03月27日 14:49:53
selector选择器可以让你切换自定义的背景风格,比如button、ListView、或者布局点击时候的背景切换等,都需要用到它

背景可以是自定义到颜色,或者图片资源

首先需要在你的res目录下创建drawable文件夹,然后在里面创建一个selector文件,如myselector.xml

注:不知为什么,selector里面有关focus的东西在真机上没什么效果,反而会影响使用,比如android:state_focus="true",加上它就没有效果,去掉它就可以正常使用了

默认情况下直接用下面的布局即可实现点击后即可切换背景,其实只需要两个item标签即可,当然,item标签内部可以用shape标签自定义不同的风格

例子1:button点击效果

res/drawable/myselector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item 
        android:state_pressed="true"
        android:drawable="@drawable/button_pressed"
        ></item>
    <item 
        android:drawable="@drawable/button_normal"
        ></item>
</selector>

复制代码

res/layout/main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/test"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/myselectr"
        android:text="Go Home"
        />

</LinearLayout>

复制代码

运行效果:

这是正常情况

这是点击后的效果

当然,针对button的selector还有很多其他的配置,但是对于一般程序来说上面的配置就够了

例子2:TextView点击效果

这个例子是网上找的,演示的是一个用TextView来定义的一个Button,实现类似TabWidget风格的选项卡。

自定义按钮,这里没有通过Button类或者子类去做派生,而是通过TextView派生出来的。

在这里三个按钮是三个TextView派生类实例,中间的白线,是1px宽的白色矩形,这样就可以做出类似上面的效果。先看图

点击后

转自:http://marshal.easymorse.com/archives/3059

/res/drawable/background_color.xml  用shape标签自定义一个渐变背景

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <gradient 
        android:startColor="#FFFFFFFF"
        android:endColor="#FFFFFFFF"
        android:angle="270.0"
        android:centerY="0.3"
        android:centerColor="#FFBDBDBD"
        />
</shape>

复制代码

/res/drawable/button_color.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <gradient 
        android:startColor="#FF7F7F7F"
        android:endColor="#FF000000"
        android:angle="270.0"
        />
</shape>

复制代码

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" 
    android:constantSize="true">
    <!-- 获得焦点时的背景图片 -->
    <item android:state_focused="true">
        <shape>
            <gradient 
                android:startColor="#FFE5CF33"
                android:endColor="#FFF1E7A2"
                android:angle="90.0"
                />
        </shape>
    </item>
    <!-- 设置相应所有事件 -->
    <item android:state_enabled="true" android:state_pressed="false">
        <shape>
            <gradient 
                android:startColor="#FF1B1B1B"
                android:endColor="#FF969696"
                android:angle="90.0"
                />
        </shape>
    </item>
    <!-- 按钮点击时的背景 -->
    <item android:state_enabled="true" android:state_pressed="true">
        <shape>
            <gradient 
                android:startColor="#FF000000"
                android:endColor="#FF474747"
                android:angle="90.0"
                />
        </shape>
    </item>
    <item android:state_enabled="false" android:state_pressed="true">
        <shape>
            <gradient 
                android:startColor="#FF000000"
                android:endColor="#FF474747"
                android:angle="90.0"
                />
        </shape>
    </item>
    <!-- 默认情况下的背景 -->
    <item>
        <shape>
            <gradient 
                android:startColor="#FF000000"
                android:endColor="#FF474747"
                android:angle="90.0"
                />
        </shape>
    </item>
</selector>

复制代码

res/drawable/button_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" 
    android:constantSize="true">
    <!-- 获得焦点时的背景图片 -->
    <item android:state_focused="true">
        <shape>
            <gradient 
                android:startColor="#FFE5CF33"
                android:endColor="#FFF1E7A2"
                android:angle="90.0"
                />
        </shape>
    </item>
    <!-- 设置相应所有事件 -->
    <item android:state_enabled="true" android:state_pressed="false">
        <shape>
            <gradient 
                android:startColor="#FF1B1B1B"
                android:endColor="#FF969696"
                android:angle="90.0"
                />
        </shape>
    </item>
    <!-- 按钮点击时的背景 -->
    <item android:state_enabled="true" android:state_pressed="true">
        <shape>
            <gradient 
                android:startColor="#FF000000"
                android:endColor="#FF474747"
                android:angle="90.0"
                />
        </shape>
    </item>
    <item android:state_enabled="false" android:state_pressed="true">
        <shape>
            <gradient 
                android:startColor="#FF000000"
                android:endColor="#FF474747"
                android:angle="90.0"
                />
        </shape>
    </item>
    <!-- 默认情况下的背景 -->
    <item>
        <shape>
            <gradient 
                android:startColor="#FF000000"
                android:endColor="#FF474747"
                android:angle="90.0"
                />
        </shape>
    </item>
</selector>

复制代码

res/layout/main.xml,这个是主布局,由自定义的Button和1px的白色矩形组成

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/background_color"
    android:orientation="vertical" >

    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="10dip"
        />
    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="40dip"
        >
        <com.loulijun.demo02.TextButton
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="饮食"
            android:gravity="center"
            android:background="@drawable/button_selector"
            android:focusable="true"
            android:clickable="true"
            />
        <View android:layout_width="2px" android:layout_height="fill_parent"
            android:background="#FFFFFFFF"/>
        <com.loulijun.demo02.TextButton
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="旅行"
            android:gravity="center"
            android:background="@drawable/button_selector"
            android:focusable="true"
            android:clickable="true"
            />
        <View android:layout_width="2px" android:layout_height="fill_parent"
            android:background="#FFFFFFFF"/>
        <com.loulijun.demo02.TextButton
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="体育"
            android:gravity="center"
            android:background="@drawable/button_selector"
            android:focusable="true"
            android:clickable="true"
            />
    </LinearLayout>

</LinearLayout>

复制代码

继承自TextView的自定义Button
View Code

package com.loulijun.demo02;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

public class TextButton extends TextView {
    public TextButton(Context context)
    {
        super(context);
    }
    public TextButton(Context context, AttributeSet attrs, int defStyle)
    {
        super(context,attrs,defStyle);
    }
    public TextButton(final Context context, AttributeSet attrs)
    {
        this(context,attrs,0);
        this.setOnTouchListener(new OnTouchListener()
        {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if(event.getAction()==MotionEvent.ACTION_CANCEL
                        ||event.getAction()==MotionEvent.ACTION_UP
                        ||event.getAction()==MotionEvent.ACTION_OUTSIDE)
                {
                    Toast.makeText(context, "hello", Toast.LENGTH_SHORT).show();
                }
                return false;
            }
            
        });
    }
}

复制代码

主程序

package com.loulijun.demo02;

import android.app.Activity;
import android.os.Bundle;

public class Demo02Activity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }
}


探索Android中selector和shape的结合使用

Android中的Selector(背景选择器)主要是用来改变一个按钮控件的背景,在Android UI设计中经常会遇到,比如我们在点击Button时需要有些效果的变化,这时候就要用到和。和对美化控件...
  • qq_20785431
  • qq_20785431
  • 2015年12月06日 21:10
  • 9022

如何动态生成Selector状态选择器

前几天在项目有优化的时候,突然想动态生成selector  所以就写了一个工具类   /** * 动态设置 点击事件 selector 的工具类 可以从本地添加 也可以从网络添加 * C...
  • suwenlai
  • suwenlai
  • 2017年01月23日 14:07
  • 823

selector背景选择器文字选择器

一:常规的使用按下和正常生活图片的更改1,在res/drawble下创建selector的xml
  • tongzhengtong
  • tongzhengtong
  • 2016年08月13日 11:15
  • 1306

选择器selector中drawable和color的区别

夜深了!想想还是写篇博客再睡觉! 最近在项目中使用PagerSlidingTabStrip时,想变化选中字体颜色的变化,就想到了使用选择器。 注意!注意!注意!此为错误代码: ...
  • willba
  • willba
  • 2017年04月23日 23:06
  • 880

使用代码动态创建Selector

代码如下第一步:创建:/** * Created by developer on 16/10/13. 动态创建Selector */public class CommonUtils { /*...
  • north1989
  • north1989
  • 2016年10月13日 13:18
  • 555

【安卓开发】JAVA代码设置selector不同状态下的背景颜色

【安卓开发】JAVA代码设置selector不同状态下的背景颜色本文转自http://www.cnblogs.com/albert-ly/p/Android.html 代码实现Shape 代码实现S...
  • ZaoAnDiQiu
  • ZaoAnDiQiu
  • 2016年08月09日 11:44
  • 1721

Android-使用tint一张图制作selector

Android 有时候制作按下的效果挺麻烦的,得放色值不同的两张图,这个就比较尴尬了,明明是相同的资源。现在Android Material Design 中提供了一个东西:Tint,一张矢量图是能适...
  • Blizzard_liu
  • Blizzard_liu
  • 2016年09月28日 13:26
  • 470

Android中的选择器selector的写法解析及不起作用原因

selector能为我们快速定义各种状态下控件的字体或背景颜色,非常方便快捷,可是有时候我们写对了状态定义却不起效果,比如 ...
  • XieYupeng520
  • XieYupeng520
  • 2015年06月11日 09:33
  • 5850

Android中背景选择器

相关属性 android:state_selected     选中未选中状态 android:state_pressed      点击未点击 android:state_focused   ...
  • qixiqinghe
  • qixiqinghe
  • 2015年07月09日 17:36
  • 845

代码设置selector和color

selector相关===StateListDrawable color相关====ColorStateList 代码: package com.example.checked; import ...
  • y444400
  • y444400
  • 2015年09月09日 17:59
  • 639
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android美工坊--selector选择器的使用
举报原因:
原因补充:

(最多只允许输入30个字)