強大的Selector框架

作者: 奔跑的佩恩 | 来源:发表于2018-03-19 11:38 被阅读1031次

前言

在开发的过程中，我们经常会遇到给view设置背景，什么圆形背景啊，圆角背景啊，点击变色背景啊之类的，这功能实现起来不难，但是一堆的xml文件啊都大同小异，令人头疼。下面给大家介绍一个selector缓存框架。

本文参考以下链接
selector官网;

今天内容涉及以下：

Selector导入与配置
Selector初始化
Selector使用注意事项
Selector框架的使用
效果图

1. Selector导入与配置

1.1 project的build.gradle中添加配置

在project的build.gradle文件中的allprojects---->repositories 添加如下依赖：

 //引入selector框架
        maven { url "https://jitpack.io"}

则build.gradle文件代码变为：

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.0.0'
        

        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        google()
        jcenter()

        //引入selector框架
        maven { url "https://jitpack.io"}
    }
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

1.2 app model的build.gradle中添加配置

在app的model中添加库依赖：

//引入selector框架
compile 'com.github.LiangLuDev:DevShapeUtils:1.0.1'

二. Selector初始化

在项目自定义的Application中初始化，如下：

public class AppContext extends Application{

    @Override
    public void onCreate() {
        super.onCreate();

        //selector框架初始化
        DevShapeUtils.init(this);
    }

}

三. Selector使用注意事项

项目中minSdkVersion设置为16，不然编译通不过。（Android4.1，现在的手机版本基本都在4.4以上）
app module的build.gradle中 compileSdkVersion 和 targetSdkVersion 版本一致，并且要在26版本及以上。

四. Selector框架的使用

样式设置：
① DevShapeUtils.xxx.into（view）--直接设置到相应的view
② DevShapeUtils.xxx.build()--返回Drawable对象
颜色设置：所有的颜色设置均可使用 R.color.xxx 或者 #FFFFFF
单位设置：项目中所有的数值单位为dp

4.1 椭圆

DevShapeUtils.shape(DevShape.OVAL).solid(R.color.colorAccent).into(mBtn1);

4.2 圆形

设置圆形的时候，需要设置按钮为固定大小，且宽高一致，xml中代码如下：

  <Button
        android:id="@+id/button2"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="圆形"
        app:layout_constraintEnd_toStartOf="@+id/button3"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/button1"
        app:layout_constraintTop_toTopOf="@+id/button1" />

设置圆形代码如下：

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).radius(999).into(mBtn2);

4.3 矩形

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).into(mBtn3);

4.4 圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).radius(10).into(mBtn4);

4.5 左上圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).tlRadius(10).into(mBtn5);

4.6 右上圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).trRadius(10).into(mBtn6);

4.7 左下圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).blRadius(10).into(mBtn7);

4.8 右下圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).brRadius(10).into(mBtn8);

4.9 上圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).tlRadius(10).trRadius(10).into(mBtn9);

4.10 下圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).blRadius(10).brRadius(10).into(mBtn10);

4.11 斜圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).tlRadius(10).brRadius(10).into(mBtn11);

4.12 斜圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).trRadius(10).blRadius(10).into(mBtn12);

4.13 半圆角

DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).radius(999).into(mBtn13);

4.14 实线圆角边框

//实线圆角边框（line 参数1：边框宽度 参数2：边框颜色）
DevShapeUtils.shape(DevShape.RECTANGLE).line(1, R.color.colorAccent).radius(10).into(mBtn14);

4.15 虚线圆角边框

//虚线圆角边框（dashLine 参数1：边框宽度 参数2：边框颜色 参数3：虚线宽度 参数4：虚线间隙宽度）
DevShapeUtils.shape(DevShape.RECTANGLE).dashLine(1, R.color.colorPrimary, 5, 5).radius(10).into(mBtn15);

4.16 渐变

//渐变（默认线性上下方向渐变）
DevShapeUtils.shape(DevShape.RECTANGLE).gradient(R.color.colorAccent, R.color.colorPrimary).into(mBtn16);

4.17 线性渐变

//线性渐变（gradientLinear 参数1：渐变方向 参数2：渐变颜色，颜色数量必须两个及以上）
DevShapeUtils.shape(DevShape.RECTANGLE).gradientLinear(DevShape.TOP_BOTTOM, R.color.colorAccent, R.color.colorPrimary).into(mBtn17);

4.18 扫描渐变

//扫描渐变（gradientSweep 参数1：渐变颜色，颜色数量必须两个及以上）
DevShapeUtils.shape(DevShape.OVAL).gradientSweep(R.color.colorAccent, R.color.colorPrimary).into(mBtn18);

4.19 辐射渐变

//辐射渐变（gradientRadial 参数1：辐射范围 参数2：渐变颜色，颜色数量必须两个及以上）
DevShapeUtils.shape(DevShape.OVAL).gradientRadial(30, R.color.colorAccent, R.color.colorPrimary).into(mBtn19);

4.20 触摸背景颜色变化

//触摸背景颜色变化(selectorBackground 参数1：触摸颜色 参数2 正常颜色)
DevShapeUtils.selectorBackground(R.color.colorAccent,R.color.colorPrimary).into(mBtn20);

4.21 触摸背景颜色和字体颜色变化

//触摸背景颜色和字体颜色变化(selectorColor 参数1：触摸颜色 参数2 正常颜色)
        DevShapeUtils.selectorBackground(R.color.colorAccent,R.color.colorPrimary)
                .selectorColor("#ffffff", "#000000")
                .into(mBtn21);

4.22 触摸圆角背景和字体颜色变化

//触摸圆角背景和字体颜色变化
Drawable pressedDrawable = DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorAccent).radius(10).build();
Drawable normalDrawable = DevShapeUtils.shape(DevShape.RECTANGLE).solid(R.color.colorPrimary).radius(10).build();
DevShapeUtils .selectorBackground(pressedDrawable,normalDrawable)
                .selectorColor("#ffffff", "#000000")
                .into(mBtn22);

五. 效果图

3.gif

ok，今天就讲到这里了，谢谢诶！