前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Android Kotlin/Java 动态设置 shape/drawable 等状态效果

Android Kotlin/Java 动态设置 shape/drawable 等状态效果

作者头像
阿策小和尚
发布2019-08-12 16:08:38
1.8K0
发布2019-08-12 16:08:38
举报
文章被收录于专栏:阿策小和尚阿策小和尚

和尚我最近遇到一个小需求,程序里面有个别页面,需要动态的调整某个页面的样式,包括一键变灰等效果。 以前页面是用 shape 和 drawable 之类实现的效果。现在需要用 Kotlin/Java 代码实现动态修改。由于和尚我技术浅浅,仅整理一下遇到一些坑。


日常应用的样式:

1. 圆角边框

默认 shape.xml 方式:

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:width="0.5dp"
        android:color="@color/colorAccent" />
    <corners android:radius="15dp" />
</shape>

现 Kotlin/Java 方式动态修改边框颜色:

代码语言:javascript
复制
var myGrad = tv2!!.getBackground() as GradientDrawable
myGrad.setStroke(1, resources.getColor(R.color.colorPrimary))

Tips: GradientDrawable 对象可设置 shape 边框属性(矩形/椭圆等)、stroke 边框宽度和颜色、cornerRadius 圆角角度、color 填充背景色。

2. 圆角边框填充颜色

默认 shape.xml 方式:

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorAccent" />
    <stroke
        android:width="0.5dp"
        android:color="@color/colorAccent" />
    <corners android:radius="15dp" />
</shape>

现 Kotlin/Java 方式动态修改边框颜色及填充背景色:

代码语言:javascript
复制
var myGrad = tv3!!.getBackground() as GradientDrawable
myGrad.setStroke(1, resources.getColor(R.color.colorPrimary))
myGrad.setColor(resources.getColor(R.color.colorPrimary))
3. 圆角边框填充颜色,点击变更背景色

默认 shape.xml 方式:

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/drawable_test1" android:state_pressed="true" />
    <item android:drawable="@drawable/drawable_test2" android:state_focused="false" android:state_pressed="false" />
    <item android:drawable="@drawable/drawable_test1" android:state_focused="true" />
    <item android:drawable="@drawable/drawable_test2" android:state_focused="false" />
</selector>

现 Kotlin/Java 方式动态修改边框颜色填充背景色,点击变更背景色:

代码语言:javascript
复制
var myGrad1 = GradientDrawable()
myGrad1.setStroke(1, resources.getColor(R.color.colorPrimary))
myGrad1.cornerRadius = 80.0f
myGrad1.setColor(resources.getColor(R.color.colorPrimary))
var myGrad2 = GradientDrawable()
myGrad2.setStroke(1, resources.getColor(R.color.colorPrimary))
myGrad2.cornerRadius = 80.0f
myGrad2.setColor(resources.getColor(R.color.white))
代码语言:javascript
复制
tv4!!.background = BitmapUtil.addStateDrawable1(context, myGrad3, myGrad4, myGrad4, myGrad4)
代码语言:javascript
复制
public static StateListDrawable addStateDrawable1(Context context, Drawable idNormal, Drawable idPressed, Drawable idFocused, Drawable idUnable) {
    StateListDrawable bg = new StateListDrawable();
    Drawable normal = idNormal;
    Drawable pressed = idPressed;
    Drawable focused = idFocused;
    Drawable unable = idUnable;
    // View.PRESSED_ENABLED_STATE_SET
    bg.addState(new int[] { android.R.attr.state_pressed, android.R.attr.state_enabled }, pressed);
    // View.ENABLED_FOCUSED_STATE_SET
    bg.addState(new int[] { android.R.attr.state_enabled, android.R.attr.state_focused }, focused);
    // View.ENABLED_STATE_SET
    bg.addState(new int[] { android.R.attr.state_enabled }, normal);
    // View.FOCUSED_STATE_SET
    bg.addState(new int[] { android.R.attr.state_focused }, focused);
    // View.WINDOW_FOCUSED_STATE_SET
    bg.addState(new int[] { android.R.attr.state_window_focused }, unable);
    // View.EMPTY_STATE_SET
    bg.addState(new int[] {}, normal);
    return bg;
}

Tips: StateListDrawable 设置 View 绘制不同状态背景图片,和尚我测试中,发现需要设置点击事件或者 Pressed/Focused 状态,和尚我认为如果只是设置 StateListDrawable 默认是 normal 样式,不会有点击效果。

4. 圆角边框填充颜色,点击变更背景色及文字颜色

默认 color.xml 方式:

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/colorAccent" android:state_selected="true" />
    <item android:color="@color/colorAccent" android:state_focused="true" />
    <item android:color="@color/colorAccent" android:state_pressed="true" />
    <item android:color="@color/white" />
</selector>

现 Kotlin/Java 方式动态修改边框颜色填充背景色,点击变更背景色及文字颜色:

代码语言:javascript
复制
tv5!!.setTextColor(BitmapUtil.createColorStateList(getResources().getColor(R.color.white), getResources().getColor(R.color.colorPrimary),
                getResources().getColor(R.color.colorPrimary), getResources().getColor(R.color.colorPrimary)));
代码语言:javascript
复制
public static ColorStateList createColorStateList(int normal, int pressed, int focused, int unable) {
    int[] colors = new int[] { pressed, focused, normal, focused, unable, normal };
    int[][] states = new int[6][];
    states[0] = new int[] { android.R.attr.state_pressed, android.R.attr.state_enabled };
    states[1] = new int[] { android.R.attr.state_enabled, android.R.attr.state_focused };
    states[2] = new int[] { android.R.attr.state_enabled };
    states[3] = new int[] { android.R.attr.state_focused };
    states[4] = new int[] { android.R.attr.state_window_focused };
    states[5] = new int[] {};
    ColorStateList colorList = new ColorStateList(states, colors);
    return colorList;
}

Tips: 和尚我建议在编辑 color.xml 时,新建在 color 资源文件夹下。ColorStateList 对象设置文字点击时不同状态等文字效果。

5. 部分圆角边框填充颜色

默认 shape.xml 方式:

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorAccent" />
    <stroke
        android:width="0.5dp"
        android:color="@color/colorAccent" />
    <corners
        android:bottomLeftRadius="15dp"
        android:topLeftRadius="15dp" />
</shape>

现 Kotlin/Java 方式动态修改部分圆角边框:

代码语言:javascript
复制
var myGrad = GradientDrawable()
var farr = floatArrayOf(80.0f, 80.0f, 0.0f, 0.0f, 0.0f, 0.0f, 80.0f, 80.0f)
myGrad.cornerRadii = farr
myGrad.setStroke(1, resources.getColor(R.color.colorPrimary))
myGrad.setColor(resources.getColor(R.color.colorPrimary))
tv6!!.background = myGrad

Tips: GradientDrawable 对象中,若设置四个圆角一致时,可设置 cornerRadius 属性;若设置部分圆角时,可设置 cornerRadii 属性,该属性包括 8 个 float 参数 (左上[X_Radius,Y_Radius],右上[X_Radius,Y_Radius],右下[X_Radius,Y_Radius],左下[X_Radius,Y_Radius]) 且只有设置 [X_Radius,Y_Radius] 两个参数时起作用。

6. 图标绘色

默认设置 tint 属性:

代码语言:javascript
复制
<ImageView
    android:id="@+id/drawable_iv3"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_marginTop="20dp"
    android:src="@mipmap/icon_zan"
    android:tint="@color/colorAccent" />

现 Kotlin/Java 方式对图标绘色:

代码语言:javascript
复制
var plabit = BitmapUtil.drawableToBitmap3(resources.getDrawable(R.mipmap.icon_zan))
plabit = BitmapUtil.tintBitmap(plabit, resources.getColor(R.color.inactive_bottom_navigation))
iv2!!.setImageDrawable(BitmapDrawable(plabit))
代码语言:javascript
复制
public static Bitmap drawableToBitmap3(Drawable drawable) {
    Bitmap bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(),
                drawable.getIntrinsicHeight(),
                drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888
                        : Bitmap.Config.RGB_565);
    Canvas canvas = new Canvas(bitmap);
    drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
    drawable.draw(canvas);
    return bitmap;
}

Tips: 用该方法绘制颜色时,建议不要设置图片的 tint 属性。

7. 图片灰度

设置 ColorMatrix 对象的 Saturation 属性:

代码语言:javascript
复制
val matrixpic = ColorMatrix()
matrixpic.setSaturation(0f)//饱和度 0灰色 100过度彩色,50正常
val filter = ColorMatrixColorFilter(matrixpic)
iv1!!.setColorFilter(filter)

xml 布局效果

Kotlin 代码效果

一键灰度

GitHub 实例


本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2018-05-05,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 阿策小和尚 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. 圆角边框
  • 2. 圆角边框填充颜色
  • 3. 圆角边框填充颜色,点击变更背景色
  • 4. 圆角边框填充颜色,点击变更背景色及文字颜色
  • 5. 部分圆角边框填充颜色
  • 6. 图标绘色
  • 7. 图片灰度
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档