Wondershare UniConverter 13_000001.GIF
亮度调节条的实现
image.png
/**
* Copyright:MicoLauncher
* Author: liyang <br>
* Date:2021/8/23 2:08 下午<br>
* Desc: <br>
*/
class VerticalSeekView(
context: Context,
attributeSet: AttributeSet? = null,
defStyleAttr: Int = 0,
defStyleRes: Int = 0
) : View(context, attributeSet, defStyleAttr, defStyleRes) {
constructor(context: Context, attributeSet: AttributeSet? = null, defStyleAttr: Int = 0) : this(
context,
attributeSet,
defStyleAttr,
0
)
constructor(context: Context, attributeSet: AttributeSet?) : this(context, attributeSet, 0)
constructor(context: Context) : this(context, null)
....
....
....
companion object {
const val TAG = "VerticalSeekView:"
@JvmStatic
@BindingAdapter("data")
fun bindData(
view: VerticalSeekView,
data: DeviceInfoWrapper
) {
data.deviceInfo.apply {
when (data.modelInfo.deviceType) {
DeviceTypeDic.DT_LIGHT_LIGHT.deviceType, DeviceTypeDic.DT_LIGHT_MIRROR.deviceType, DeviceTypeDic.DT_LIGHT_NIGHT_LIGHT.deviceType -> {
view.showIcon = true
view.deviceTypeIcon = if (currentStatus) {
R.drawable.sh_ic_light_icon_on
} else {
R.drawable.sh_ic_light_icon_off
}
}
DeviceTypeDic.DT_ENV_HEATER.deviceType -> {
view.showIcon = true
view.deviceTypeIcon = if (currentStatus) {
R.drawable.sh_ic_heater_temperature_on
} else {
R.drawable.sh_ic_heater_temperature_off
}
view.foregroundColor = ContextCompat.getColor(
view.context,
if (currentStatus) R.color.sh_miot_heater_foreground_color else R.color.sh_miot_heater_foreground_color_off
)
}
}
}
}
}
....
....
....
var volume: Double = 0.0
set(value) {
if (value in 0.0..1.0 && field != value) {
field = value
volumeChangeListener?.onVolumeChanged(value)
refresh()
}
}
var volumeChangeListener: OnVolumeChangeListener? = null
private val minTouchSlop by lazy {
ViewConfiguration.get(context).scaledTouchSlop
}
init {
val typedArray = context.obtainStyledAttributes(attributeSet, R.styleable.VerticalSeekView)
radius = typedArray.getDimensionPixelOffset(R.styleable.VerticalSeekView_radius, 0).let {
var num = it
if (it < 0) {
num = 0
}
num
}
deviceTypeIcon = typedArray.getResourceId(
R.styleable.VerticalSeekView_deviceTypeIcon,
R.drawable.sh_ic_iot_lamp
)
bitmap = ContextCompat.getDrawable(context, deviceTypeIcon)?.toBitmap()
underlyingColor = typedArray.getColor(
R.styleable.VerticalSeekView_underlyingLayerColor,
context.getColor(R.color.sh_miot_seek_view_background_color)
)
foregroundColor = typedArray.getColor(
R.styleable.VerticalSeekView_foregroundLayerColor,
context.getColor(R.color.sh_miot_seek_view_foreground_color)
)
volume = (typedArray.getFloat(R.styleable.VerticalSeekView_volume, 0.0f)
.takeIf {
it >= 0.0f || it <= 100.0f
} ?: 0.0f)
.toDouble()
startColor = typedArray.getColor(R.styleable.VerticalSeekView_startColor, foregroundColor)
endColor = typedArray.getColor(R.styleable.VerticalSeekView_endColor, foregroundColor)
canDrag = typedArray.getBoolean(R.styleable.VerticalSeekView_canDrag, true)
paint.isAntiAlias = true
paint.isDither = true
typedArray.recycle()
}
@SuppressLint("ClickableViewAccessibility")
override fun onTouchEvent(event: MotionEvent?): Boolean {
if (!canDrag) return super.onTouchEvent(event)
when (event?.action) {
MotionEvent.ACTION_DOWN -> {
startX = event.x
startY = event.y
downTimestamp = System.currentTimeMillis()
L.smarthome.d("$TAG onTouchEvent ACTION_DOWN downX=$startX,downY=$startY,minTouchSlop=$minTouchSlop")
volumeChangeListener?.onVolumeChangedBegin(volume)
startVolume = volume
return true
}
MotionEvent.ACTION_MOVE -> {
currentX = event.x
currentY = event.y
val offsetX = startX - currentX
val offsetY = startY - currentY
if (abs(offsetY) > abs(offsetX)) {//纵向滑动时,请求RecyclerView不拦截事件
parent.requestDisallowInterceptTouchEvent(true)
if (abs(offsetY) > minTouchSlop) {
if (!isFistMoveAction) {
volume = (offsetY / height).plus(startVolume).let {
var newVolume = it
if (it >= 1) {
newVolume = 1.0
}
if (it <= 0) {
newVolume = 0.0
}
newVolume
}
isVolumeChange = true
L.smarthome.d("$TAG onTouchEvent ACTION_MOVE setVolume=$volume")
return true
}
isFistMoveAction = false
}
}
lastX = currentX
lastY = currentY
}
MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> {
currentX = 0f
currentY = 0f
lastY = 0f
lastX = 0f
isFistMoveAction = true
parent.requestDisallowInterceptTouchEvent(false)
L.smarthome.d("$TAG ${if (event.action == MotionEvent.ACTION_UP) "ACTION_UP" else "ACTION_CANCEL"} requestDisallowInterceptTouchEvent:false")
val isLongClick =
(System.currentTimeMillis() - downTimestamp) >= ViewConfiguration.getLongPressTimeout()
if (event.action == MotionEvent.ACTION_UP && !isVolumeChange && !isLongClick) {
performClick()
}
if (isVolumeChange) {
isVolumeChange = false
}
volumeChangeListener?.onVolumeChangedEnd(isVolumeChange, volume)
}
}
return super.onTouchEvent(event)
}
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.apply {
layerId = saveLayer(0f, 0f, width.toFloat(), height.toFloat(), null)
//画底层背景色
onDrawUnderlyingLayer(this)
//画上层填充色
onDrawForegroundLayer(this)
//画小横条
onDrawHandler(this)
//画底部的icon
onDrawIcon(this)
restoreToCount(layerId)
}
}
private fun onDrawIcon(canvas: Canvas) {
if (!showIcon)return
bitmap?.apply {
L.smarthome.d("$TAG,width=$width,height=$height")
canvas.drawBitmap(this, Rect(0, 0, width, height), destRect, null)
}
}
private fun onDrawHandler(canvas: Canvas) {
if (!canDrag) return
rectF.left = ((width - 40.toPx()) / 2).toFloat()
rectF.top = (canvas.height - canvas.height * volume + 8.toPx()).toFloat()
rectF.right = (width / 2 + 17).toFloat()
rectF.bottom = rectF.top.minus(4)
paint.color = ContextCompat.getColor(context, R.color.black_12_transparent)
canvas.drawRoundRect(rectF, 1.5f, 1.5f, paint)
}
private fun onDrawUnderlyingLayer(canvas: Canvas) {
paint.style = Paint.Style.FILL
paint.color = underlyingColor
rectF.left = 0f
rectF.top = 0f
rectF.right = canvas.width.toFloat()
rectF.bottom = canvas.height.toFloat()
canvas.drawRoundRect(rectF, radius.toFloat(), radius.toFloat(), paint)
}
private fun onDrawForegroundLayer(canvas: Canvas) {
paint.style = Paint.Style.FILL
paint.xfermode = PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP)
val top = (canvas.height - canvas.height * volume).toFloat()
val bottom = canvas.height.toFloat()
if (startColor != foregroundColor || endColor != foregroundColor) {
val gradient = LinearGradient(
(width / 2).toFloat(),
top,
(width / 2).toFloat(),
bottom,
startColor,
endColor,
Shader.TileMode.CLAMP
)
paint.shader = gradient
} else {
paint.color = foregroundColor
}
rectF.left = 0f
rectF.top = top
rectF.right = canvas.width.toFloat()
rectF.bottom = bottom
canvas.drawRect(rectF, paint)
paint.xfermode = null
paint.shader = null
}
private fun refresh() {
if (Looper.myLooper() != Looper.getMainLooper()) {
postInvalidate()
} else {
invalidate()
}
}
}
interface OnVolumeChangeListener {
fun onVolumeChangedBegin(volume: Double)
fun onVolumeChanged(volume: Double)
fun onVolumeChangedEnd(flag: Boolean, volume: Double)
}
色温调节条的实现
2022.02.14-11.49.56.png
package com.xiaomi.smarthome.ui.widgets
/**
* Copyright:MicoLauncher
* Author: liyang <br>
* Date:2021/8/23 2:08 下午<br>
* Desc: <br>
*/
class VerticalSeekView2(
context: Context,
attributeSet: AttributeSet? = null,
defStyleAttr: Int = 0,
defStyleRes: Int = 0
) : View(context, attributeSet, defStyleAttr, defStyleRes) {
constructor(context: Context, attributeSet: AttributeSet? = null, defStyleAttr: Int = 0) : this(
context,
attributeSet,
defStyleAttr,
0
)
constructor(context: Context, attributeSet: AttributeSet?) : this(context, attributeSet, 0)
constructor(context: Context) : this(context, null)
......
......
var volume: Double = 0.0
set(value) {
if (value in 0.0..1.0 && field != value) {
field = value
refresh()
volumeChangeListener?.onVolumeChanged(value)
}
}
var volumeChangeListener: OnVolumeChangeListener? = null
......
......
......
init {
val typedArray = context.obtainStyledAttributes(attributeSet, R.styleable.VerticalSeekView2)
radius = typedArray.getDimensionPixelOffset(R.styleable.VerticalSeekView2_radius, 0).let {
var num = it
if (it < 0) {
num = 0
}
num
}
startColor = typedArray.getColor(R.styleable.VerticalSeekView2_startColor, Color.WHITE)
endColor = typedArray.getColor(R.styleable.VerticalSeekView2_endColor, Color.BLUE)
volume = (typedArray.getFloat(R.styleable.VerticalSeekView2_volume, 0.0f)
.takeIf {
it >= 0.0f || it <= 100.0f
} ?: 0.0f)
.toDouble()
paint.isAntiAlias = true
paint.isDither = true
typedArray.recycle()
}
@SuppressLint("ClickableViewAccessibility")
override fun onTouchEvent(event: MotionEvent?): Boolean {
when (event?.action) {
MotionEvent.ACTION_DOWN, MotionEvent.ACTION_MOVE -> {
if (event.action == MotionEvent.ACTION_DOWN) {
parent.requestDisallowInterceptTouchEvent(true)
}
currentX = event.y
currentY = event.x
val offsetX = lastX - currentX
val offsetY = lastY - currentY
if (abs(offsetX) < abs(offsetY)) {//纵向滑动时,请求RecyclerView不拦截事件
parent.requestDisallowInterceptTouchEvent(true)
}
volume = ((height - currentX) / height).toDouble().let {
var newVolume = it
if (it >= 1) {
newVolume = 1.0
}
if (it <= 0) {
newVolume = 0.0
}
newVolume
}
lastX = currentX
lastY = currentY
L.smarthome.d("$TAG onTouchEvent currentX=$currentX,currentY=$currentY")
return true
}
MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> {
currentX = 0f
currentY = 0f
lastY = 0f
lastX = 0f
parent.requestDisallowInterceptTouchEvent(false)
L.smarthome.d("${TAG}requestDisallowInterceptTouchEvent:false")
}
}
return super.onTouchEvent(event)
}
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.apply {
layerId = saveLayer(0f, 0f, width.toFloat(), height.toFloat(), null)
onDrawUnderlyingLayer(this)
onDrawHandler(this)
restoreToCount(layerId)
}
}
private fun onDrawHandler(canvas: Canvas) {
rectF.left = 0f
rectF.top = (canvas.height - canvas.height * volume).toFloat().let {
var newVal=it
if (it>=canvas.height+48.toPx()){
newVal=(canvas.height+48.toPx()).toFloat()
}else if (it<=48.toPx()){
newVal=48.toPx().toFloat()
}
newVal
}
rectF.right = width.toFloat()
rectF.bottom = rectF.top.minus(48.toPx())
paint.color = Color.WHITE
canvas.drawRoundRect(rectF, 26f, 26f, paint)
}
private fun onDrawUnderlyingLayer(canvas: Canvas) {
paint.style = Paint.Style.FILL
val gradient = LinearGradient((width / 2).toFloat(), 0f, (width / 2).toFloat(), height.toFloat(),startColor,endColor,Shader.TileMode.REPEAT)
paint.shader=gradient
rectF.left = 0f
rectF.top = 0f
rectF.right = canvas.width.toFloat()
rectF.bottom = canvas.height.toFloat()
canvas.drawRoundRect(rectF, radius.toFloat(), radius.toFloat(), paint)
paint.shader=null
}
private fun refresh() {
if (Looper.myLooper() != Looper.getMainLooper()) {
postInvalidate()
} else {
invalidate()
}
}
}
