微信发送语音自定义view中的事件分发

977 阅读2分钟

这里通过一个自定义view的例子来看事件分发在自定义view中的使用,其实大部分的Android框架下的事件分发的也都差不多的样子,抛砖引玉,我自己做一个记录,如果能帮到有需要的人那就更上一层楼。
先来看一个微信发送语音的效果图:

关于事件分发我们其实耳熟能详,可以通过一段非常有名的伪代码来大致了解:

  @Override
    public boolean dispatchTouchEvent(MotionEvent ev) {
        boolean consume = false;
        if(onInterceptTouchEvent(ev)){
            consume = onTouchEvent(ev);
        }else {
            consume = child.dispatchTouchEvent(ev);
        }
        return consume;
 
    }

事件都是从一个DOWN开始,中间经过一堆MOVE,到一个UP结束(先抛开CANCEL的情况)。
事件流向画了半天,感觉也没有人家画的好,可以参考 这里 ,很清晰,忘记了的或者细节不清楚模糊了的可以移步去复习一下。

我们的需求是点击发送按钮后显示浮层view,相当于事件先由发送按钮处理,等浮层view显示后再交由浮层view处理,这个事件的流向很清晰,那应该怎么做呢。

那最简单的view的层级结构就是发送按钮浮层view处在同一层级,那一个问题,事件能否在parent什么都不做的情况下实现事件在同级别view之间的转移呢?
肯定是不可以或者说没有必要的,最好的方式还是通过parent来做分发,由parent的决定此时到底是需要把事件交给发送按钮还是浮层view

所以层级结构上:

<?xml version="1.0" encoding="utf-8"?>
<!-- parent, 来控制事件的分发 -->
<com.yocn.af.view.widget.WeChatParentViewGroup 
    android:id="@+id/wechat_root"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:id="@+id/ll_option"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true">

         <!-- 发送按钮view -->
        <com.yocn.af.view.widget.WeChatVoiceTextView  
            android:id="@+id/tv_voice"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="按住 说话"/>
    </LinearLayout>
     <!-- 点击后需要显示的浮层view -->
    <com.yocn.af.view.widget.WeChatVoiceView 
        android:id="@+id/voice_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/half"
        android:visibility="gone" />

</com.yocn.af.view.widget.WeChatParentViewGroup>

我们梳理一下思路,需要做的就是:

  1. 什么都没做时ParentViewGrouponInterceptTouchEvent要返回false,使得事件能顺利的从ParentViewGroup传递到VoiceTextView(发送按钮)
  2. 点击到VoiceTextView(发送按钮)时,发送按钮的dispatchTouchEvent返回true,处理DOWN事件并告诉parent需要显示WeChatVoiceView(浮层view)
  3. parent接收到需要显示浮层view的命令,显示浮层view并且onInterceptTouchEvent返回true,表示事件我parent来处理,这时VoiceTextView(发送按钮)会收到一个CANCEL事件并且不会继续接受MOVE事件。
  4. parent来分发事件,在WeChatVoiceView(浮层view)显示出来之后直接将后续的MOVE事件交给WeChatVoiceView(浮层view)处理,当然浮层view的onInterceptTouchEvent需要返回true,会回调到浮层view的onTouchEvent,直接做对应的动画或者手势操作。
  5. 当然不要忘记在parent收到ACTION_UP的时候将浮层view置为不可见,因为事件是由parent分发给浮层view的,当然parent可以一直拿到事件。

至此,整个事件分发的流程就结束了。 附上代码地址WeChatSendVoice