Android viewdraghelper fully resolves custom ViewGroup artifact

1、 Overview

In the custom ViewGroup, many effects include users dragging a view (eg: sideslip menu, etc.) with their fingers. It is not easy to write onintercepttouchevent and ontouchevent according to specific needs. You need to deal with them yourself: multi finger processing, acceleration detection, etc. Fortunately, the official V4 support package provides a class like viewdraghelper to help us easily write a custom ViewGroup. Take a brief look at its comments:

ViewDragHelper is a utility class for writing custom ViewGroups. It offers a number of useful operations and state tracking for allowing a user to drag and reposition views within their parent ViewGroup.

This blog will focus on the use of viewdraghelper, and finally implement a custom ViewGroup similar to drawerlayout. (PS: the official drawerlayout is implemented in this way)

2、 Getting started small example

First, let's look at its quick usage through a simple example, which is divided into the following steps:

（1） Custom ViewGroup

You can see that the code of the entire custom ViewGroup above is very concise. Follow the above three steps:

1. Create instance

Three parameters are required to create an instance. The first is the current ViewGroup and the second is sensitivity, which is mainly used to set touchslope:

It can be seen that the larger the input, the smaller the value of mtouchslop. The third parameter is callback, which will call back related methods during the user's touch, which will be described in detail later.

2. Touch correlation method

In onintercepttouchevent, we use mdragger. Shouldintercepttouchevent (event) to determine whether we should intercept the current event. Handle events through mdragger. Processtouchevent (event) in ontouchevent.

3. Implement methods related to viewdraghelper.callcack

When intercepting and processing events in viewdraghelper, you need to call back many methods in callback to determine some things, such as which child views can be moved, control the boundary of a moving view, and so on.

The above three replication methods:

How trycaptureview returns capture indicates that the view can be captured. You can decide which can be captured according to the first view parameter passed in

Clamviewpositionhorizontal and clamviewpositionvertical can control the moving boundary of the child in this method. Left and top are the positions to be moved. For example, in the case of horizontal, I want to move only inside the ViewGroup, that is, the minimum > = paddingleft and the maximum < = ViewGroup. Getwidth() - paddingright-child.getwidth. You can write the following code:

After the above three steps, we have completed a simple custom ViewGroup, which can freely drag sub views.

Take a brief look at the layout file

（2） Layout file

There are three textviews in our custom ViewGroup.

Current effect:

You can see that you can play with just a few lines of code~~~

After we have an intuitive understanding, we also need to have an in-depth understanding of the methods in viewdraghelper. Callback. First of all, we need to consider that our viewdraghelper can not only let the sub view follow our fingers, but we continue to learn other functions.

3、 Function display

Viewdraghelper can also do the following:

Then let's transform our most basic example, including the above operations.

First, let's take a look at our modified effect:

Simply add different operations for each sub view:

The first view is to demonstrate a simple move. The second view demonstrates that after moving, it will automatically return to its original position. (note that the faster you drag, the faster you return) the third view captures the view when the boundary moves.

OK, after reading the rendering, let's look at the code modification:

Modified code

We just change the text and background color of the layout file, so we don't paste it again.

The first view is basically unchanged.

In the second view, we saved the most open location information after onlayout. The most important thing is to rewrite onviewreleased in callback. In onviewreleased, we judge that if it is m autobackview, we call settecapturedviewat to return to the original location. You can see that the code that follows is invalidate(); Because mscroller. Startscroll is used internally, don't forget to invalidate () and combine it with the computescroll method.

For the third view, we actively capture it through the capturechildview in the onedgedragstarted callback method. This method can bypass the trycaptureview. Therefore, although our trycaptureview does not return true, it does not affect it. Note that if boundary detection is required, mdragger.setedgetrackingenabled (viewdraghelper. Edge_left) needs to be added;.

So far, we have introduced the callback methods commonly used in callback. Of course, some methods are not introduced. Next, we modify our layout file. We add clickable = true to all our textviews, which means that sub views can consume events. Run it again, and you will find that the view that could have been dragged does not move. (if there is a brother who takes the button test, he should have found this problem. I hope you see this instead of asking questions, ha ~).

Why? This is mainly because if the sub view does not consume events, the whole gesture (down-move * - up) directly enters the ontouchevent, and the captureview is determined when the ontouchevent is down. If the event is consumed, the onintercepttouchevent method will be used to judge whether it can be captured. In the process of judgment, the other two callback methods will be judged: getviewhorizontaldragrange and getviewverticaldragrange. Only when these two methods return a value greater than 0 can they be captured normally.

Therefore, if you test with button or add clickable = true to textview, remember to rewrite the following two methods:

The return value of the method should be the horizontal or vertical movement range of the childview. At present, if you only need to move in one direction, you can copy only one.

Here, let's list all the callback methods to see what hasn't been used:

onViewDragStateChanged

Callback when the viewdraghelper state changes (idle, dragging, setting [auto scrolling])

onViewPositionChanged

Callback when the position of captureview changes

onViewCaptured

Callback when captureview is captured

Onviewreleased used

onEdgeTouched

Callback when a boundary is touched.

onEdgeLock

If true, the current boundary will be locked; if false, it will be unlocked.

Onedgedragstarted used

getOrderedChildIndex

Change the same coordinate (x, y) to find the location of captureview. (specifically in the findtopchildunder method)

Getviewhorizontaldragrange used

Getviewverticaldragrange used

Trycaptureview used

Clapviewpositionhorizontal used

Clapviewpositionvertical used

OK, so far, all callback methods have a certain understanding.

To summarize, the approximate callback sequence of the method is as follows:

OK, the above is the general process under normal circumstances. Of course, there may be many cases where the judgment is not tenable in the whole process.

It can also be explained from the above that when we did not write the getviewhorizontaldragrange method in the previous textview (clickable = false), it can be moved. Because directly enter the down of processtouchevent, and then onviewcaptured and onviewdragstatechanged (enter the drawing state), and then move directly dragto.

When the child view consumes events, it needs to go through a series of judgments (getviewhorizontaldragrange, clapviewpositionvertical, etc.) before it can go to trycaptureview.

OK, this is the introduction to the use of viewdraghelper. In the next article, we will use viewdraghelper to implement a drawerlayout by ourselves. Those interested can also be implemented according to this article and the source code of drawerlayout~

Reference link

http://flavienlaurent.com/blog/2013/08/28/each-navigation-drawer-hides-a-viewdraghelper/ http://blog.denevell.org/android-viewdraghelper-example-tutorial.html

~~have a nice day ~~

Click to download the source code

The above is the whole content of this article. I hope it will be helpful to your study, and I hope you can support programming tips.