android实现可拖动的浮动view

本文实例为大家分享了android实现可拖动的浮动view,供大家参考,具体内容如下

业务来源

页面最小化后,需要出现一个浮动 view 告知用户,防止遮挡视线,需要对 view 做可滑动处理

已知会遇到的问题

1.view 的依赖的布局类型未知【为了后续方便扩展】

外界传递 ViewGroup 自己本身继承 LinearLayout【或者其他 ViewGroup 】

class FloatChannelView(var mContext: Context?, var viewGroup: ViewGroup) : LinearLayout(mContext){
    private var mIcon: ImageView = ImageView(context)
    private var mName: TextView = TextView(context)
    private var mClose: ImageView = ImageView(context)
    private var iconWH = dip2Px(38)
    private var groupPadding = dip2Px(3)
    private var mViewGroupH = dip2Px(44)
    private var mViewGroupW = dip2Px(152)
    private var mBoundaryLeft: Float
    private var mBoundaryTop: Float
    private var mBoundaryRight: Float
    private var mBoundaryBottom: Float
    private var mScreenWidth = getScreenWidth() // 获取屏幕宽高
    private var mScreenHeight = getScreenHeight()
 
    private var mDownEventX: Float = 0f  // 相对控件的x
    private var mDownEventY: Float = 0f
    private var mDownX: Float = 0f  // 相对屏幕所在的 x
    private var mDownY: Float = 0f
 
    private var mListener: OnClickListener? = null
    private var mIsStartAnimation: Boolean = false
 
    private val mDefaultMargin = dip2Px(12)
    private var mMarginLeft = mDefaultMargin
    private var mMarginTop = mDefaultMargin
    private var mMarginRight = mDefaultMargin
    private var mMarginBottom = mDefaultMargin
 
    init {
        layoutParams = LayoutParams(mViewGroupW, mViewGroupH)
        setPadding(groupPadding, groupPadding, groupPadding, groupPadding)
        setBackgroundResource(R.drawable.backage) // 建议加一些透明
        orientation = HORIZONTAL
        gravity = Gravity.CENTER_VERTICAL
        mBoundaryLeft = mMarginLeft.toFloat()
        mBoundaryTop = mMarginTop.toFloat()
        mBoundaryRight = mScreenWidth - mMarginRight.toFloat()
        mBoundaryBottom = (mScreenHeight - mMarginBottom - dip2Px(85)).toFloat()
        setView()
    }
}

2.拖动事件影响点击,事件分发处理。

override fun onTouchEvent(event: MotionEvent?): Boolean {
        if (mIsStartAnimation) {  // 动画正在进行无需处理 onTouch
            return true
        }
        if (event == null) {
            return super.onTouchEvent(event)
        }
        mIsOnTouch = true
        //悬浮区域左上角坐标
        val x = x
        val y = y
        //悬浮区域宽高
        val width = mViewGroupW
        val height = mViewGroupH
        when (event.actionMasked) {
            ACTION_DOWN -> {
                //点击位置坐标
                mDownEventX = event.x
                mDownEventY = event.y
                mDownX = x
                mDownY = y
            }
            ACTION_UP -> {
                mUpTime = System.currentTimeMillis()
            
                if (mIsMove && abs(mDownX - x) <= 8f && abs(mDownY - y) <= 8f) {
                    mListener?.onClick(this)
                }
                mIsMove = false
                // 抬起后处理边界溢出问题
                resilienceAnimation(x, y, x + mViewGroupW, y + mViewGroupH)
            }
            ACTION_MOVE -> {
                val changeX = event.x.toInt() - mDownEventX
                val changeY = event.y.toInt() - mDownEventY
                mIsMove = true
                if (changeX == 0f && changeY == 0f) {
                    return super.onTouchEvent(event)
                }
                val left = (x + changeX).toInt()
                val top = (y + changeY).toInt()
                val right = left + mViewGroupW
                val bottom = top + mViewGroupH
                layout(left, top, right, bottom)
            }
        }
        return true
    }

3.拖到边界问题。

拖出边界后做了回弹处理

/**
     *  超出边界回弹
     *  @param left 当前 x 方向位置
     *  @param right 当前 y 方向位置
*/
    private fun resilienceAnimation(left: Float, top: Float, right: Float, bottom: Float) {
       
        var startX = 0f
        var resilienceX = 0f
        if (mBoundaryLeft <= left && right <= mBoundaryRight) {  // x 方向在范围内
            // 不处理
        } else if (mBoundaryLeft > left) {  // left 溢出
            startX = 0f
            resilienceX = mBoundaryLeft - left
        } else {   // right 方向底部溢出
            startX = 0f
            resilienceX = mBoundaryRight - right
        }
        var startY = 0f
        var resilienceY = 0f
        if (mBoundaryTop <= top && bottom <= mBoundaryBottom) {  // y 方向在范围内
            // 不处理
        } else if (mBoundaryTop > top) {  // top 溢出
            startY = 0f
            resilienceY = mBoundaryTop - top
        } else {  // bottom 溢出
            startY = 0f
            resilienceY = mBoundaryBottom - bottom
        }
        if (resilienceX == 0f && resilienceY == 0f) {  // 在范围内无需回弹
            return
        }
 
        // 超出边界回弹
        val phaseFirstDuration: Long = 400
        var oAnimPhaseFirstTUpX: ObjectAnimator? = null
        if (resilienceX != 0f) {
            oAnimPhaseFirstTUpX = ObjectAnimator.ofFloat(this, "translationX", startX, resilienceX)
                    .setDuration(phaseFirstDuration)
        }
        var oAnimPhaseFirstTUpY: ObjectAnimator? = null
        if (resilienceY != 0f) {
            oAnimPhaseFirstTUpY = ObjectAnimator.ofFloat(this, "translationY", startY, resilienceY)
                    .setDuration(phaseFirstDuration)
        }
        val animatorSet = AnimatorSet()
        if (oAnimPhaseFirstTUpX != null && oAnimPhaseFirstTUpY != null) {
            animatorSet.play(oAnimPhaseFirstTUpX).with(oAnimPhaseFirstTUpY)
        } else if (oAnimPhaseFirstTUpX != null) {
            animatorSet.play(oAnimPhaseFirstTUpX)
        } else {
            animatorSet.play(oAnimPhaseFirstTUpY)
        }
        animatorSet.childAnimations[animatorSet.childAnimations.size - 1].addListener(object : Animator.AnimatorListener {
 
            override fun onAnimationStart(animation: Animator?) {
                mIsStartAnimation = true
            }
 
            override fun onAnimationEnd(animation: Animator?) {
                var l = left
                var t = top
                var r = right
                var b = bottom
                when {
                    mBoundaryLeft > left -> {  // x左边溢出
                        l = mBoundaryLeft
                        r = mBoundaryLeft + mViewGroupW
                    }
                    mBoundaryRight < right -> {  // x右边溢出
                        l = mBoundaryRight - mViewGroupW
                        r = mBoundaryRight
                    }
                    else -> {  // x方向未溢出
                    }
                }
 
                when {
                    mBoundaryTop > top -> {  // y 顶部溢出
                        t = mBoundaryTop
                        b = mBoundaryTop + mViewGroupH
                    }
                    mBoundaryBottom < bottom -> {  // y 底部溢出
                        t = mBoundaryBottom - mViewGroupH
                        b = mBoundaryBottom
                    }
                    else -> {  // y方向未溢出
                    }
                }
                // 只进行偏移,实际位置未变化,需要重置偏移量,并重绘
                this@FloatChannelView.translationX = 0f
                this@FloatChannelView.translationY = 0f
                layout(l.toInt(), t.toInt(), r.toInt(), b.toInt())
                mMarginLeft = l.toInt()
                mMarginTop = t.toInt()
                mIsStartAnimation = false
            }
 
            override fun onAnimationCancel(animation: Animator?) {}
 
            override fun onAnimationRepeat(animation: Animator?) {}
 
        })
        animatorSet.start()

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android实现跟随手指拖动并自动贴边的View样式(实例demo)

    效果图 代码 /** * 根据手指拖动的当前位置,自动贴边的View */ public class DragView extends ImageView implements View.OnTouchListener{ private int screenWidth; private int screenHeight; private Context mContext; private int lastX, lastY; private int left ,top; private ViewG

  • Android自定义View实现拖动选择按钮

    本文为大家分享了Android实现拖动选择按钮的具体代码,供大家参考,具体内容如下 效果图 View代码 第一步:自定义属性 <declare-styleable name="DragView"> <attr name="icon_drag" format="reference"/> <attr name="color_circle" format="color"/> &

  • Android开发实现可拖动排序的ListView功能【附源码下载】

    本文实例讲述了Android开发实现可拖动排序的ListView功能.分享给大家供大家参考,具体如下: 一.上图 二.简述 1.需要实现的效果是长按右侧可拖动部分布局实现列表项的拖动排序 2.当点击列表项前面的单选按钮时,在该条目右侧显示删除图标,点击该图标删除当前条目. 三.实现思路 借助github上的开源代码drag-sort-listview-master加以改造. 四.主要源码展示 1.Activity代码 package com.gengducun.dslvdemo; import

  • Android实现单页面浮层可拖动view的一种方法

    上一篇讲到通过通过goolge官方的ViewDragHelper工具实现拖动的方法(上一篇见http://www.jb51.net/article/125481.htm),那么有一个问题就是在DragframeLayout中的onTouchEvent一直接收不到触摸消息,而且在onInterceptTouchEvent的时候,并没有触发ViewDragHelper.tryCaptureView方法,因此诞生了另一种比较原始的方法:通过自定义可拖动view来实现 主要方法: initEdge:设置

  • Android通过自定义ImageView控件实现图片的缩放和拖动的实现代码

    概述:通过自定义ImageView控件,在xml布局里面调用自定的组件实现图片的缩放. /** * 自定义的ImageView控制,可对图片进行多点触控缩放和拖动 * * @author qiuwanyong */ public class MyImageView extends ImageView { /** * 初始化状态常量 */ public static final int STATUS_INIT = 1; /** * 图片放大状态常量 */ public static final i

  • Android ViewDragHelper仿淘宝拖动加载效果

    拖动加载是我在淘宝的商品详情界面发现的,感觉很实用.于是就分析它的实现方式,感觉用ViewDragHelper可以很方便的实现这种效果.下面大致把我的思路分步骤写一下.先上图吧. 首先建工程什么的我就不多说了.咱从ViewDragHelper的实现开始说吧,ViewDragHelper一般用在一个自定义ViewGroup的内部,可以对其子View进行移动操作. 创建自定义ViewGroup: package com.maxi.viewdraghelpertest.widget; import a

  • Android DragImageView实现下拉拖动图片放大效果

    DragImageView下拉拖动图片放大,先上图: 主要的类:继承了RelativeLayout,再在RelativeLayout里面添加ImageView,通过Touch事件来改变ImageView的缩放,缩放时计算scale,使其在手指移动到屏幕底部时,图片底部也刚好到达屏幕底部,手指松开时,图片逐步回弹. package com.example.dragimagescale; import android.annotation.SuppressLint; import android.a

  • Android自定义View圆形和拖动圆、跟随手指拖动效果

    单纯的自定义一个圆非常简单 只需要几步就完成 拖动圆添加实现触摸事件即可 我在第一次自定义View圆遇到的几个Bug: 1.拖动圆的话在xml里面设置的自定义圆的宽和高是它能活动的空间的大小 不是圆控件的大小 如果你定义了100dp 拖动它的时候超过100dp这个距离这个圆就会看不见 就像下面这样 如果想活动于整个屏幕直接给宽和高match_parent属性就好了 2.我在定义充满属性match_parent的时候运行会报错,什么方法都用了就是不行,耐心等待过一会就好了-有可能是studio没来

  • Android实现ImageView图片缩放和拖动

    今天我们来编写一个缩放效果的ImageView ,网上有很多人都讲了这些.但有许多人都直接使用了库文件, 那么我们今天做的是直接上代码编写一个拖动和缩放的ImageView,具体看效果图 那么简单了分析一下.在手机上缩放图片和拖动要用到什么?手指对不对 那么控件上什么事件和手机有关.View.OnTouchListener 对不对. ok,那么先新建一个Class ··· public class BaseDragZoomImageView extends ImageView implement

  • Android RecyclerView滑动删除和拖动排序

    本篇是接着上面三篇之后的一个对RecyclerView的介绍,这里多说两句,如果你还在使用ListView的话,可以放弃掉ListView了.RecyclerView自动帮我们缓存Item视图(ViewHolder),允许我们自定义各种动作的动画和分割线,允许我们对Item进行一些手势操作.另外,因为Design库的推出大大方便我们编写带有Material风格的App,而ListView是不兼容这个库的,比如滑动的相互协调,只有RecyclerView能做到. 先看本篇内容的效果图: 效果内容主

随机推荐