AutoBackgroundBackButton 在ScrollView上方自动根据返回键按钮下方内容动态改变颜色。自动变色返回键

在日常有时候有一些为了优化体验的需求。AutoBackgroundBackButton 一个可以根据按钮下方背景颜色动态的改版返回键自定义ImageView。这里只展示了黑白切换方式,你如果还有其他需求可以参考颜色校验来自己实现切换对应颜色按钮。【例如白色背景展示黑色样式,图片上方显示白色样式】

返回键效果录屏

下面展示文件 AutoBackgroundBackButton.kt

javascript 复制代码
import android.content.Context
import android.content.res.ColorStateList
import android.graphics.Bitmap
import android.graphics.Canvas
import android.graphics.Color
import android.graphics.drawable.BitmapDrawable
import android.os.Handler
import android.os.Looper
import android.util.AttributeSet
import android.view.View
import androidx.appcompat.widget.AppCompatImageView
import androidx.core.widget.NestedScrollView
import kotlin.math.abs

class AutoBackgroundBackButton @JvmOverloads constructor(
    context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : AppCompatImageView(context, attrs, defStyleAttr) {

    private var mScrollView: NestedScrollView? = null

    private val handler = Handler(Looper.getMainLooper())
    private val delayMillis = 100L // 延迟截图生成的时间,单位为毫秒
    private var isScrolling = false
    fun setScrollView(scrollView: NestedScrollView) {
        scrollView.viewTreeObserver.addOnGlobalLayoutListener {
            mScrollView = scrollView
            scrollView.setOnScrollChangeListener(NestedScrollView.OnScrollChangeListener { v, scrollX, scrollY, oldScrollX, oldScrollY ->
                isScrolling = true // 设置滚动状态为 true
                handler.removeCallbacksAndMessages(null) // 移除之前的延迟任务
                handler.postDelayed({
                    if (isScrolling) {
                        isScrolling = false // 滚动结束,将滚动状态设置为 false
                        updateImageResource()
                    }
                }, delayMillis)
            })
            updateImageResource()
        }
    }

    private fun updateImageResource() {
        val bottomAreaColor = getBottomAreaColor()
        //方式1:可以直接设置setImageResource来改变
        //setImageResource(if (isColorDark(bottomAreaColor)) R.drawable.ic_back_white else R.drawable.ic_back_black)
        
        //方式2:使用imageTintList属性来直接改版图片颜色
        val states = arrayOf(intArrayOf())
        val colors = intArrayOf(if (isColorDark(bottomAreaColor)) Color.WHITE else Color.BLACK)
        imageTintList = ColorStateList(states, colors)
    }


    private fun getBottomAreaColor(): Int {
        if (mScrollView == null || mScrollView?.width == 0 || mScrollView?.height == 0) {
            return Color.WHITE
        } else {

            val y0 = getLocationOnScreen().second
            val y1 = mScrollView!!.getLocationOnScreen().second
            val startY = abs(y0 - y1)

            val bitmap = getScreenshotOfScreenRegion(
                mScrollView!!,
                width,
                startY,
                startY + height
            )
            if (bitmap != null && !bitmap.isRecycled) {
                if (bitmap.height == 0) {
                    return Color.WHITE
                } else {
                    val color = getAverageColorFromBitmap(
                        bitmap, 0, 0, bitmap.width, bitmap.height
                    )
                    //测试预览,可以打开注解查看[打开记得注释bitmap.recycle()]
//                    setBackgroundDrawable(BitmapDrawable(resources, bitmap))
                    bitmap.recycle()
                    return color
                }
            } else {
                return Color.WHITE
            }
        }

    }

    fun View.getLocationOnScreen(): Pair<Int, Int> {
        val location = IntArray(2)
        getLocationOnScreen(location)
        return Pair(location[0], location[1])
    }

    private fun getScreenshotOfScreenRegion(
        scrollView: NestedScrollView,
        bitmapWidth: Int,
        startY: Int,
        endY: Int
    ): Bitmap? {
        // 获取屏幕的截图
        val screenBitmap = getScrollViewScreenshot(scrollView, bitmapWidth) ?: return null
        // 计算在屏幕上的起始位置和结束位置
        val startYOnScreen = startY
        val endYOnScreen = endY
        // 计算在 ScrollView 上的位置
        val startYOnScrollView = startYOnScreen + scrollView.scrollY
        // 截取屏幕上的指定区域
        var regionHeight = endYOnScreen - startYOnScreen
        try {
            return Bitmap.createBitmap(
                screenBitmap,
                0,
                startYOnScrollView,
                bitmapWidth,
                regionHeight
            )
        } catch (ex: Exception) {
            return null
        }
    }

    private fun getScrollViewScreenshot(scrollView: NestedScrollView, bitmapWidth: Int): Bitmap? {
        val height = scrollView.getChildAt(0)?.height ?: return null // 获取 ScrollView 内容的高度
        if (height == 0) return null // 如果 ScrollView 的高度为0,直接返回null

        val bitmap = Bitmap.createBitmap(bitmapWidth, height, Bitmap.Config.ARGB_8888)
        val canvas = Canvas(bitmap)
        scrollView.draw(canvas)
        return bitmap
    }

    private fun isColorDark(color: Int): Boolean {
        val darkness =
            1 - (0.299 * Color.red(color) + 0.587 * Color.green(color) + 0.114 * Color.blue(color)) / 255
        return darkness >= 0.1
    }

    private fun getAverageColorFromBitmap(
        bitmap: Bitmap, startX: Int, startY: Int, width: Int, height: Int
    ): Int {
        val pixels = IntArray(width * height)
        bitmap.getPixels(pixels, 0, width, startX, startY, width, height)

        var red: Long = 0
        var green: Long = 0
        var blue: Long = 0
        var count = 0

        for (pixel in pixels) {
            red += Color.red(pixel)
            green += Color.green(pixel)
            blue += Color.blue(pixel)
            count++
        }

        if (count == 0) {
            return Color.WHITE // 默认颜色
        }

        red /= count
        green /= count
        blue /= count

        return Color.rgb(red.toInt(), green.toInt(), blue.toInt())
    }

    override fun onDetachedFromWindow() {
        super.onDetachedFromWindow()
        handler.removeCallbacksAndMessages(null) // 移除之前的延迟任务
    }
}

xml中使用

javascript 复制代码
    <com.xxx.weight.AutoBackgroundBackButton
        android:id="@+id/backButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:src="@drawable/ic_back_black"
        android:tint="@color/white" />

代码中关联ScrollView

javascript 复制代码
backButton.setScrollView(scrollView)

这样就可以实现返回键和ScrollView的滑动关联,在滑动的时候能自动的根据下方内容而变化颜色。

相关推荐
simplepeng1 天前
我们都知道但总是忽略的5个Jetpack Compose细节
android·android jetpack
刮风那天1 天前
Android 如何提高进程优先级避免被查杀?
android
修行者对6661 天前
安卓阿里云镜像
android
刮风那天1 天前
Android AMS创建进程不用Binder而用Socket?
android·java·binder
知行合一。。。1 天前
Python--05--面向对象(继承,多态)
android·开发语言·python
张小潇2 天前
AOSP15 WMS/AMS系统开发 -窗口动画源码分析
android
程序员陆业聪2 天前
Shadow核心原理:壳子Activity与代理机制的精妙设计
android
plainGeekDev2 天前
Android 开发者再不转Kotlin,真的来不及了
android·kotlin
赏金术士2 天前
第五章:数据层—网络请求与Repository
android·kotlin·compose
初雪云2 天前
让安卓发版再简单一点,体验一键自动化发布
android·运维·自动化