仿抖音/快手可向下拖动的Dialog(2020年第一篇博客)

前言

  最近使用短视频App,比如快手和抖音,发现他们的回复评论框(感觉Dialog实现的,当然也还可以用其他方式实现),可以向下拖动关闭,感觉效果还可以,体验不错,要知道一般的dialog都是点击外部关闭,效果很一般,因此我想到要优化下这个体验。

效果图

  

  1.前几帧可以看到向下拖动,拖动到一半后,松开手指则Dismiss掉Dialog.

   2.后续几帧Dialog里用的是GridView实现的计算器功能,可以点击item进行加减运算.

实现原理及步骤

 实现思路: “当检测到用户的手机是移动操作时,不向下传递事件,同时根据手指移动距离改变Dialog位置,

 当用户操作为单击事件时则向下传递事件,响应GridView的item点击事件”

 自定义Dialog代码步骤:

1.重写Dialog的dispatchTouchEvent(分发事件) ,这个地方需要深刻理解事件分发,拦截,处理机制,此处只用到了分发事件的TouchEvent,如果是移动操作,则return true,不向下分发事件,则此时的任何操作,子元素均无法响应,事件被消费处理了,不会再传递下去了。

2.判断出用户是单击事件,则注意,要return super.dispatchTouchEvent(event);继续向下传递事件,子元素可以响应事件,因为事件正常的传递下去了。

核心代码如下,里面的方法就不展示了,过于简单,计算距离和判断单击,想必大家都非常清晰了,代码撸起来就是了


    @Override
    public boolean dispatchTouchEvent(@NonNull MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                onActionDown(event);
                break;
            case MotionEvent.ACTION_MOVE:
                onActionMove(event);
                break;
            case MotionEvent.ACTION_UP:
                onActionUp(event);
                break;
        }
        return isPullDown || super.dispatchTouchEvent(event);
    }

文末彩蛋

 1.事件分发/拦截/处理建议大家学习下其他的博客,本博客也有总结,都是经过本人写样例验证的一些总结..

 2.这个场景按道理应用场景还是挺多的,比如说常见的直播的menuBar,阅读器的上下工具条,都是可以以这个思路来实现,

 当menuBar显示的时候,不向下传递事件;反之,隐藏时候,事件则可以正常的传递.

3.场景还很多,原理就是这样,大家码起来吧.

  

发布了60 篇原创文章 · 获赞 109 · 访问量 36万+

猜你喜欢

转载自blog.csdn.net/shenshibaoma/article/details/103891126