Sliding in two - no, in four directions

On Habré, there were more than once articles about sliding screens for Android ViewPager , ViewPagerIndicator . I want to offer a four-way slide option.



Not so long ago, I needed to make the screen slide in four directions: left, right, up and down. Searches on the Internet did not give a positive result, or maybe I was looking bad. So in the end I decided to do what I needed myself.

I must say that I did not start from scratch, the basis was the implementation of the horizontal slider from here RealViewSwitcher .
So, the entire implementation is located in the same TwoDirectionsViewSwitcher class, which is inherited from the ViewGroup. To implement the necessary functionality, it is enough to override the following methods of the base class:
')
In the onMeasure method, dimensions are set for future screens:

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 

In onLayout, the screens are arranged and the actual division into lines (the number of lines is transmitted in the constructor):

 protected void onLayout(boolean changed, int l, int t, int r, int b) 

The constructor itself into which the application context is passed and the number of lines into which it is necessary to split the general list of screens:

 public TwoDirectionsViewSwitcher(Context context, int rows) 

The following, key, touch handling method for the onTouchEvent screen:

 public boolean onTouchEvent(MotionEvent ev) 

And the last, computeScroll child scroll calculation method:

 public void computeScroll() 

Now let's take a closer look at some key class methods. Method onLayout .

Everything is simple, the nested loop is implemented by the number of rows and the offsets are set for each subsequent screen.

A more complicated method is the touch handler for the onTouchEvent screen.

Here it differs little from the typical implementation, various types of actions are processed:

• MotionEvent.ACTION_DOWN - touch the screen;
• MotionEvent.ACTION_MOVE - movement on the screen after touching;
• MotionEvent.ACTION_UP - ending movement (raising a finger from the screen)

In the event handler MotionEvent.ACTION_DOW, the fact of the start of movement on the screen is determined, the current X and Y positions of the screen are set and the sign of the start of scrolling is set.

In the MotionEvent.ACTION_MOVE handler, an offset is processed by eran (the case where the offset exceeds the return value of the ViewConfiguration.get (getContext ()). GetScaledTouchSlop () method, the scroll value is calculated by X and Y and the direction of movement is determined by the absolute value of the offset along the axes:

  //   X final int deltaX = (int) (mLastMotionX - x); //   Y final int deltaY = (int) (mLastMotionY - y); mLastMotionX = x; mLastMotionY = y; //  View     final int scrollX = getScrollX(); final int scrollY = getScrollY(); //   ,     if (Math.abs(deltaX) > Math.abs(deltaY) && isMoveBegin) { isMoveBegin = false; isXMove = true; isYMove = false; } else if (Math.abs(deltaX) < Math.abs(deltaY) && isMoveBegin) { isMoveBegin = false; isXMove = false; isYMove = true; } //     if (isXMove) { if (deltaX < 0) { if (scrollX > 0) { scrollBy(Math.max(-scrollX, deltaX), 0); } } else if (deltaX > 0) { final int availableToScroll = getChildAt(getChildCount() / mRows -1).getRight() - scrollX - getWidth(); if (availableToScroll > 0) { scrollBy(Math.min(availableToScroll, deltaX), 0); } } } //     else if (isYMove) { if (deltaY < 0) { if (scrollY > 0) { scrollBy(0, Math.max(-scrollY, deltaY)); } } else if (deltaY > 0) { final int availableToScroll = getChildAt(getChildCount() - 1).getBottom() - scrollY - getHeight(); if (availableToScroll > 0) { scrollBy(0, Math.min(availableToScroll, deltaY)); } } } } break; 

In addition, three variables areXMove, isYMove, isMoveBegin introduced for orthogonal movement along the axes. The last of which is true when processing MotionEvent.ACTION_DOWN.

Next actually goes scrolling the screen using several utility methods.

The MotionEvent.ACTION_UP handler is responsible for completing the scrolling of the screen and resetting the working variables. If the screen moves by more than half, it scrolls to the next screen, otherwise the old screen returns to its initial position.

I would also like to dwell on the moment when it is necessary to move not to the first screen, but to an arbitrary one, when creating an instance of a class. For this, a constructor was created:

  public TwoDirectionsViewSwitcher(Context context, int rows, int currentScreen) { super(context); mCurrentScreen = currentScreen; mRows = rows; init(); } 

In the onMeasure method , at the first opening, the initial position specified is processed:

  if (mFirstLayout) { int row = mCurrentScreen / (getChildCount() / mRows); int cell = mCurrentScreen % (getChildCount() / mRows); scrollTo(cell * width, row * height); mFirstLayout = false; } 

Of course, this class does not claim completeness, for example, it would be worthwhile to implement the processing of changing the screen layout (it now works correctly in Landscape mode), add effects, take into account the multiplicity of the total number of screens and the number of lines, but even in this form it performs Those functions for which I actually developed it - moving in four directions.

The full code of the project with an example of use is published on github TwoDirectionsViewSwitcher .