Code Monkey home page Code Monkey logo

selectorinjection's Introduction

SelectorInjection

Platform API

SelectorInjection是一个强大的selector注入器。它可以给view注入selector状态,免去了大量的selecor文件。

  • 可以根据shape来着色产生selector状态
  • 可根据普通情况下的颜色(normalColor)来自动生成按压态的颜色
  • 支持normal、pressed、checked、disabled状态的效果
  • 支持SVG和TINT,并且二者可以配合使用
  • 可以开启水波纹(ripple)按压效果

如果你的需求很简单,不妨试试「这篇文章」提到的一张图片实现selector的方案。

引入

1.添加JitPack仓库

repositories {
    maven {
	url "https://jitpack.io"
    }
}

2.添加依赖

compile 'com.github.tianzhijiexian:SelectorInjection:1.1.6'

使用

我们可以根据需要将SelectorInjection注入到任何一个View中去,产生一个新的自定义View。

库中已经给出了ImageButton、TextView、Button等view的实现,已经提供的控件如下:

  • SelectorTextView
  • SelectorButton
  • SelectorRadioButton
  • SelectorImageButton (配合app:inSrc=true设置是否将selector效果作用于src,不设置则作用于background)

书写示例:

<kale.ui.view.SelectorTextView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"

  app:normalColor="#03a9f4"
  app:normalDrawable="@drawable/btn_oval_shape"
  app:normalStrokeColor="#ffffff"
  app:normalStrokeWidth="4dp"
  />

效果

Type Explain Attribute
Color
app:normalColor="@color/green"
app:normalDrawable="@drawable/shape_round_rectangle"
Stroke
app:normalStrokeColor="#eeeeee"
app:normalStrokeWidth="3dp"

相应控件支持normal、pressed、checked、disabled四种状态,属性格式为:

  • xxxDrawable
  • xxxColor
  • xxxStrokeColor
  • xxxStrokeWidth

高级用法

  1. 自动计算按压颜色

    提供的控件默认会在没有指定app:pressedColor的情况向下自动计算出按下后的颜色。如果你不希望开启这个功能,那么可以将app:smartColor设置为false。

  2. 支持shape

    将shape对象作为drawable后,会自动将normalColor填充到shape的背景中并自动产生按下后的效果。

  3. 支持layer-list

    normalColor、pressedColor等属性会作用于layer-list中标注有@android:id/background的item中。

     <?xml version="1.0" encoding="utf-8"?>
     <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
         <!-- other item -->
         <item android:drawable="@drawable/btn_oval_shadow_mask"/>
    
         <!-- target item -->
         <item
             android:id="@android:id/background"
             >
             <shape android:shape="oval" >
                 <solid android:color="@android:color/transparent" />
             </shape>
         </item>
    
     </layer-list>
    
  4. 支持水波纹

    在Android5.0以上支持了水波纹效果,可以通过app:ripple = "true"来开启:

    水波纹效果和其他属性不冲突,可以随意开关,但需要注意版本兼容问题。

  5. 支持SVG

    目前全版本兼容SVG图片(VectorDrawable),详细文档可以查看:SVG和Tint应如何结合

  6. 代码自动提示

    支持Android Studio的代码提示,一般通过输入normal、check、disable等关键字就可以提示代码:

目标

Selector的写法比较复杂,做业务开发的过程中我们在需求按压效果的时候必须要离开编写的ui界面转而定义selector,打断了代码的编写流程。而增加的这些selector文件其实大多都是一次性使用,但数量众多,维护麻烦。

开发时借鉴了SelectorButtonMaterialDesignLibrary的写法,最终产生了能将颜色和形状两两组合的selector注入器。它支持且不仅仅支持下列的按钮,你还可以通过layer-list和shape的组合产生更多的按钮。

image

开发者

Jack Tony: [email protected]

License

SelectorInjection is licensed under Apache License 2. View license.

selectorinjection's People

Contributors

jakewoki avatar kaleai avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

selectorinjection's Issues

No resource identifier found for attribute

作者你好:
直接依赖compile 'com.github.tianzhijiexian:SelectorInjection:1.0.4'
会提示No resource identifier found for attribute 'drawableLeftTint' in package 'kale.selectorinjection'
image
是因为attrs.xml命名为了values.xml的原因吗?
添加attrs中属性到工程的attrs中可以正常使用.

shape描边相互影响

    <kale.ui.view.SelectorTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="0000"
        android:textColor="#333333"
        android:textSize="30sp"
        app:normalColor="@android:color/darker_gray"
        app:normalDrawable="@drawable/btn_oval_shape"
        app:normalStrokeColor="#ff0000"
        app:normalStrokeWidth="2dp" />

    <kale.ui.view.SelectorButton
        android:id="@+id/sstv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_gravity="center_horizontal"
        android:gravity="center"
        android:text="Click Me"
        android:textColor="@android:color/white"
        android:textSize="20sp"
        app:normalColor="#9BD000"
        app:normalDrawable="@drawable/btn_oval_shape" />

第一个Textview的描边和颜色, 在第二个上面也会出现




自动计算按下颜色的一点建议

    protected int getPressedColor(int normalColor) {
        return darken(normalColor, 0.3f);
    }

    public static int darken(final int color, float fraction) {
        return blendColors(Color.BLACK, color, fraction);
    }

    public static int lighten(final int color, float fraction) {
        return blendColors(Color.WHITE, color, fraction);
    }
    /**
     * Blend {@code color1} and {@code color2} using the given ratio.
     *
     * @param ratio of which to blend. 1.0 will return {@code color1}, 0.5 will give an even blend,
     *              0.0 will return {@code color2}.
     */
    public static int blendColors(int color1, int color2, float ratio) {
        final float inverseRatio = 1f - ratio;
        float r = (Color.red(color1) * ratio) + (Color.red(color2) * inverseRatio);
        float g = (Color.green(color1) * ratio) + (Color.green(color2) * inverseRatio);
        float b = (Color.blue(color1) * ratio) + (Color.blue(color2) * inverseRatio);
        return Color.rgb((int) r, (int) g, (int) b);
    }

默认开启了水纹在项目中会崩溃

整合进我的项目时候,默认开启了水纹在项目中会崩溃

  • 必须手动在布局文件中将showRipple置为false,才正常使用(跑demo工程没有这个问题)。
  • 布局中设置了android:enabled="true", 也会导致程序崩溃

手机:小米note
miui版本:miui7 6.5.12
android版本:6.0.1

Caused by: android.content.res.Resources$NotFoundException: File res/drawable/item_background_material.xml from color state list resource ID #0x1080457
    at android.content.res.Resources.loadColorStateListForCookie(Resources.java:2800)
    at android.content.res.Resources.loadColorStateList(Resources.java:2749)
    at android.content.res.TypedArray.getColorStateList(TypedArray.java:487)
    at android.graphics.drawable.RippleDrawable.updateStateFromTypedArray(RippleDrawable.java:473)
    at android.graphics.drawable.RippleDrawable.applyTheme(RippleDrawable.java:517)
    at android.content.res.Resources.loadDrawable(Resources.java:2589)
    at android.content.res.MiuiResources.loadDrawable(MiuiResources.java:387)
    at android.content.res.Resources.getDrawable(Resources.java:824)
    at android.content.Context.getDrawable(Context.java:458)
    at kale.injection.SelectorInjection.setSelector(SelectorInjection.java:161)
    at kale.injection.SelectorInjection.injection(SelectorInjection.java:148)
    at kale.ui.view.SelectorTextView.<init>(SelectorTextView.java:25)
    at kale.ui.view.SelectorTextView.<init>(SelectorTextView.java:19)
    ... 30 more
Caused by: org.xmlpull.v1.XmlPullParserException: Binary XML file line #17: invalid color state list tag ripple
    at android.content.res.ColorStateList.createFromXmlInner(ColorStateList.java:217)
    at android.content.res.ColorStateList.createFromXml(ColorStateList.java:201)
    at android.content.res.Resources.loadColorStateListForCookie(Resources.java:2796)
    ... 42 more

add textcolor

按照你这个思路可以把控件文字不同状态时的颜色也加上

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.