实现Android拖拽按钮接听电话效果:
- 向中心拖拽左右两侧的控件,实现对应的功能;
- 添加动画效果;
1、SlideSwitchView.kt
import android.content.Context
import android.graphics.*
import android.os.Handler
import android.util.AttributeSet
import android.view.MotionEvent
import android.view.View
import androidx.core.content.ContextCompat
class SlideSwitchView(
context: Context?,
attrs: AttributeSet?,
defStyleAttr: Int,
defStyleRes: Int
) : View(context, attrs, defStyleAttr, defStyleRes) {
constructor(context: Context?, attrs: AttributeSet?, defStyleAttr: Int) : this(
context,
attrs,
defStyleAttr,
0
)
constructor(context: Context?, attrs: AttributeSet?) : this(context, attrs, 0)
constructor(context: Context?) : this(context, null)
//画中心扩散圆相关
private val centerCirPaint = Paint()//画中间大圆的画笔
private val offSetTopAndBottom = 1f / 2//中心圆的边距布局顶部所占总高的比例
private val centerCirWidthList = ArrayList<Float>()//中心圆的扩散的宽度
private val centerCirAlphaList = ArrayList<Int>()//中心圆的扩散的透明度
private val centerSpeed = 0.3f//中心圆的扩散速度
private var centerSpeedAdd = 0f//中心圆增加的的扩散速度
private val mDiffuseWidth = 20//扩散圆宽度(扩散圆与原始圆的半径的差值)
private var offSetTopOrBottom: Float = 0f//中心圆的顶部到控件顶部的距离(底部到控件底部的距离)
private var centerCirRadius: Float = 0f//中心圆的半径
private var centerRatio = 1f//中心圆的倍率大小
private val zoomRatio = 0.3f//中心圆变大时半径最多增加几倍
private var centerCirColor = R.color.color_D5E7FF//中心圆和扩散圆的颜色
private var CENTER_CIR_COLOR_ORIGINAL = R.color.color_D5E7FF//中心圆和扩散圆的默认颜色
private var CENTER_CIR_COLOR_LEFT_START = R.color.color_589EFF
private var CENTER_CIR_COLOR_RIGHT_START = R.color.color_FCA56B
private var CENTER_CIR_COLOR_LEFT_END =
R.color.color_FF8432//左侧小球移动到中心圆圆心时的中心圆和扩散圆的颜色 也做左侧小圆的颜色及左侧点的颜色
private var CENTER_CIR_COLOR_RIGHT_END =
R.color.color_1677FF//右侧小球移动到中心圆圆心时的中心圆和扩散圆的颜色 也做右侧小圆的颜色及右侧点的颜色
private var AUTO_RESTORE = false//左右侧小圆是否自动恢复
//画左右小圆相关
private val smallCirPaint = Paint()//画左右两个小圆的画笔
private var leftCirX = 0f//左边圆的圆心的X坐标
private var leftCirY = 0f//左边圆的圆心的Y坐标
private var rightCirX = 0f//右边圆的圆心的X坐标
private var rightCirY = 0f //右边圆的圆心的Y坐标
private val smallCirPaddingBound = 10f//左边圆距左边控件的边距 右边圆距控件右边的边距
private val smallCirShadowRadius = 10f//小圆的阴影半径
private var smallCirRadius = 0f//小圆的半径
private val smallRestoreOffset = 20//小圆恢复到原位置的速度
var alphaLeft = 255//左边小圆及点的透明度
var alphaRight = 255//右边小圆及点的透明度
var actionIsLeft = false//执行操作的是哪一边
//画点相关
private val pointPaint = Paint()//画点的画笔
private val leftPointList = ArrayList<Int>()//左边的点的透明度
private val rightPointList = ArrayList<Int>()//右边的点的透明度
private val pointCount = 4//点的个数
private val pointRadius = context?.dp2px(2)?.toFloat()!!//点的半径
//绘制文字相关
var leftText = "备勤"
var rightText = "上班"
private val textPaint = Paint()
val textMarginTop = context?.dp2px(4)!!//文字和图片的间距
//绘制图片相关
var leftImg = BitmapFactory.decodeResource(resources, R.drawable.img_change_prepare)
var rightImg = BitmapFactory.decodeResource(resources, R.drawable.img_change_work)
val imgHeight = context?.dp2px(26)!!
val imgWidth = context?.dp2px(26)!!
private var changedOffset = 10//状态改变的偏移量
var leftChangedListener: View.OnClickListener? = null//左侧拖拽完成触发事件
var rightChangedListener: View.OnClickListener? = null//右侧拖拽完成触发事件
init {
context?.let {
//中心扩散圆相关初始化
centerCirPaint.isAntiAlias = true
centerCirWidthList.add(0f)
centerCirAlphaList.add(200)
//左右小圆的相关初始化
smallCirPaint.color = ContextCompat.getColor(it, R.color.color_1677FF)
smallCirPaint.isAntiAlias = true
smallCirPaint.setShadowLayer(