Android 사용자 정의 view 미끄럼 잠 금 해제 효과 구현

본 논문 의 사례 는 안 드 로 이 드 사용자 정의 view 가 미끄럼 잠 금 해 제 를 실현 하 는 구체 적 인 코드 를 공유 하 였 으 며,구체 적 인 내용 은 다음 과 같다.
1.수 요 는 다음 과 같다.
가 까 운 시일 내 에 화면 이 미끄러져 잠 금 을 풀 수 있 는 기능 이 필요 합 니 다.오른쪽 획 을 시작 하고 왼쪽 획 을 멈 추 십시오.
2.수요 효과 도 는 다음 과 같다.

3.효과 구현 전시

4.사용자 정의 뷰 는 다음 과 같다.

/**
 * Desc        View
 * Author ZY
 * Mail [email protected]
 * Date 2021/5/17 11:52
 */
@SuppressLint("ClickableViewAccessibility")
class SlideSwitchButton : ViewGroup {

    constructor(context: Context?) : this(context, null)
    constructor(context: Context?, attrs: AttributeSet?) : this(context, attrs, 0)
    constructor(context: Context?, attrs: AttributeSet?, defStyleAttr: Int) : this(
        context,
        attrs,
        defStyleAttr, 0
    )

    constructor(
        context: Context?,
        attrs: AttributeSet?,
        defStyleAttr: Int,
        defStyleRes: Int
    ) : super(context, attrs, defStyleAttr, defStyleRes)


    var duration = 300

    var isOpen = false

    var scrollView: ScrollView? = null

    var onSwitchListener: ((isOpen: Boolean) -> Unit)? = null

    private var itemHeight = 0
    private var itemPadding = 0
    private var parentWidth = 0

    private val stopImgView: ImageView by lazy {
        ImageView(context).apply {
            setImageResource(R.drawable.f1_svg_btn_stop)
        }
    }

    private val startImgView: ImageView by lazy {
        ImageView(context).apply {
            setImageResource(R.drawable.f1_svg_btn_start)
        }
    }

    private val hintView: TextView by lazy {
        TextView(context).apply {
            setTextSize(TypedValue.COMPLEX_UNIT_PX, resources.getDimension(R.dimen.dp_14))
            compoundDrawablePadding = resources.getDimension(R.dimen.dp_5).toInt()
            setTextColor(Color.parseColor("#727b9f"))
        }
    }

    init {
        setBackgroundResource(R.drawable.f1_sel_bg_slide_btn)
        addView(hintView)
        updateHint()

        addView(stopImgView)
        addView(startImgView)

        var x = 0
        startImgView.setOnTouchListener { v, event ->

            when (event.action) {
                MotionEvent.ACTION_DOWN -> {
                    scrollView?.requestDisallowInterceptTouchEvent(true)
                    x = event.x.toInt()
                }

                MotionEvent.ACTION_UP -> {

                    if (startImgView.x < (parentWidth - startImgView.width) / 2) {
                        play(false)
                    } else {
                        play(true)
                    }

                    scrollView?.requestDisallowInterceptTouchEvent(false)
                }
                MotionEvent.ACTION_MOVE -> {
                    val lastX = event.x - x
                    if (startImgView.x + lastX > parentWidth - itemPadding - startImgView.width) {
                        return@setOnTouchListener true
                    }

                    if (startImgView.x + lastX < itemPadding) {
                        return@setOnTouchListener true
                    }
                    startImgView.x += lastX
                }
            }

            return@setOnTouchListener true
        }
    }


    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
        setMeasuredDimension(widthMeasureSpec, resources.getDimension(R.dimen.dp_90).toInt())
        itemPadding = resources.getDimension(R.dimen.dp_5).toInt()
        itemHeight = resources.getDimension(R.dimen.dp_80).toInt()
        parentWidth = MeasureSpec.getSize(widthMeasureSpec)
    }


    override fun onLayout(changed: Boolean, l: Int, t: Int, r: Int, b: Int) {
        stopImgView.layout(
            itemPadding,
            itemPadding,
            itemPadding + itemHeight,
            itemPadding + itemHeight
        )

        startImgView.layout(
            itemPadding,
            itemPadding,
            itemPadding + itemHeight,
            itemPadding + itemHeight
        )

        val len =
            hintView.paint.measureText(hintView.text.toString()) + resources.getDimension(R.dimen.dp_24)
        val let = (r - len) / 2
        hintView.layout(
            let.toInt(),
            resources.getDimension(R.dimen.dp_35).toInt(),
            (let + len).toInt(),
            resources.getDimension(R.dimen.dp_55).toInt()
        )
    }


    /**
     * flag tue    false   
     */
    private fun play(flag: Boolean) {
        val mStart = startImgView.x
        val mEnd = if (flag) {
            parentWidth - itemPadding * 2 - startImgView.width.toFloat()
        } else {
            stopImgView.x - itemPadding
        }

        val animatorOBJ =
            ObjectAnimator.ofFloat(startImgView, "translationX", mStart, mEnd)
        animatorOBJ.duration = duration.toLong()
        animatorOBJ.addListener(object : Animator.AnimatorListener {
            override fun onAnimationRepeat(animation: Animator?) {

            }

            override fun onAnimationEnd(animation: Animator?) {
                updateHint(flag)
                if (flag != isOpen) {
                    isOpen = flag
                    onSwitchListener?.invoke(flag)
                }
            }

            override fun onAnimationCancel(animation: Animator?) {

            }

            override fun onAnimationStart(animation: Animator?) {

            }
        })
        animatorOBJ.start()
    }

    private fun updateHint(lock: Boolean = false) {
        val icon = if (lock) {
            hintView.text = "    "
            ResourcesCompat.getDrawable(resources, R.drawable.f1_svg_left_arrow, null)
        } else {
            hintView.text = "    "
            ResourcesCompat.getDrawable(resources, R.drawable.f1_svg_right_arrow, null)
        }
        icon?.setBounds(
            0,
            0,
            resources.getDimension(R.dimen.dp_14).toInt(),
            resources.getDimension(R.dimen.dp_12).toInt()
        )
        if (lock) {
            hintView.setCompoundDrawables(icon, null, null, null)
        } else {
            hintView.setCompoundDrawables(null, null, icon, null)
        }
    }


    fun stop() {
        play(false)
    }


    fun start() {
        play(true)
    }
}

주의 할 점 이 있 습 니 다.페이지 가 너무 길 면 ScrollView 와 Slide SwitchButton 이 미 끄 러 지 는 사건 이 충돌 할 수 있 으 므 로 필요 하 시 죠?scrollView 가 들 어 옵 니 다.
5.호출 방식 은 다음 과 같다.

/**
 * Desc        View
 * Author ZY
 * Mail [email protected]
 * Date 2021/5/28 17:48
 */
class SlideSwitchButtonActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.f1_act_main)

        btn_start.scrollView = scrollView

        btn_start.onSwitchListener = {
            if (it) {
                Toast.makeText(this,"    ",Toast.LENGTH_LONG).show()
                btn_start.start()
            } else {
                Toast.makeText(this,"    ",Toast.LENGTH_LONG).show()
                btn_start.stop()
            }
        }
    }

}

그 전에 ZyFrame 프레임 워 크 를 봉 인 했 습 니 다.도구 류,사용자 정의 구성 요소,네트워크 요청 프레임 워 크 를 하나 로 모 았 습 니 다.사용 하기에 두 꺼 운 것 같 습 니 다.그 다음 에 시간 을 내 서 분리 할 것 입 니 다.ZyFrame 은 네트워크 요청 기능 을 보류 하고 ZyUI 는 사용자 정의 구성 요 소 를 만 들 고 ZyTool 은 도구 류 를 만 들 것 입 니 다.아마 이 럴 것 입 니 다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.