HorizontalScrollView в ScrollView Touch Handling
У меня есть ScrollView, который окружает весь мой макет, так что весь экран можно прокручивать. Первый элемент в этом ScrollView - это блок HorizontalScrollView, в котором есть функции, которые можно прокручивать по горизонтали. Я добавил ontouchlistener в представление horizontalscroll, чтобы обрабатывать сенсорные события и заставлять представление "привязываться" к ближайшему изображению в событии ACTION_UP.
Таким образом, эффект, на который я рассчитываю, похож на стандартный рабочий стол андроида, где вы можете перемещаться от одного к другому, и он поднимается на один экран, когда вы поднимаете палец.
Все это прекрасно работает, за исключением одной проблемы: мне нужно провести пальцем слева направо почти идеально по горизонтали, чтобы ACTION_UP когда-либо регистрировался. Если я проведу по крайней мере вертикально (как я думаю, многие люди склонны делать на своих телефонах при перелистывании из стороны в сторону), я получу ACTION_CANCEL вместо ACTION_UP. Моя теория заключается в том, что это происходит потому, что представление горизонтального прокрутки находится внутри просмотра прокрутки, а представление прокрутки захватывает вертикальное касание, чтобы обеспечить вертикальную прокрутку.
Как я могу отключить сенсорные события для просмотра с прокруткой прямо из моего горизонтального просмотра с прокруткой, но при этом разрешить нормальную вертикальную прокрутку в других местах просмотра с прокруткой?
Вот пример моего кода:
public class HomeFeatureLayout extends HorizontalScrollView {
private ArrayList<ListItem> items = null;
private GestureDetector gestureDetector;
View.OnTouchListener gestureListener;
private static final int SWIPE_MIN_DISTANCE = 5;
private static final int SWIPE_THRESHOLD_VELOCITY = 300;
private int activeFeature = 0;
public HomeFeatureLayout(Context context, ArrayList<ListItem> items){
super(context);
setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
setFadingEdgeLength(0);
this.setHorizontalScrollBarEnabled(false);
this.setVerticalScrollBarEnabled(false);
LinearLayout internalWrapper = new LinearLayout(context);
internalWrapper.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
internalWrapper.setOrientation(LinearLayout.HORIZONTAL);
addView(internalWrapper);
this.items = items;
for(int i = 0; i< items.size();i++){
LinearLayout featureLayout = (LinearLayout) View.inflate(this.getContext(),R.layout.homefeature,null);
TextView header = (TextView) featureLayout.findViewById(R.id.featureheader);
ImageView image = (ImageView) featureLayout.findViewById(R.id.featureimage);
TextView title = (TextView) featureLayout.findViewById(R.id.featuretitle);
title.setTag(items.get(i).GetLinkURL());
TextView date = (TextView) featureLayout.findViewById(R.id.featuredate);
header.setText("FEATURED");
Image cachedImage = new Image(this.getContext(), items.get(i).GetImageURL());
image.setImageDrawable(cachedImage.getImage());
title.setText(items.get(i).GetTitle());
date.setText(items.get(i).GetDate());
internalWrapper.addView(featureLayout);
}
gestureDetector = new GestureDetector(new MyGestureDetector());
setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (gestureDetector.onTouchEvent(event)) {
return true;
}
else if(event.getAction() == MotionEvent.ACTION_UP || event.getAction() == MotionEvent.ACTION_CANCEL ){
int scrollX = getScrollX();
int featureWidth = getMeasuredWidth();
activeFeature = ((scrollX + (featureWidth/2))/featureWidth);
int scrollTo = activeFeature*featureWidth;
smoothScrollTo(scrollTo, 0);
return true;
}
else{
return false;
}
}
});
}
class MyGestureDetector extends SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
try {
//right to left
if(e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
activeFeature = (activeFeature < (items.size() - 1))? activeFeature + 1:items.size() -1;
smoothScrollTo(activeFeature*getMeasuredWidth(), 0);
return true;
}
//left to right
else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
activeFeature = (activeFeature > 0)? activeFeature - 1:0;
smoothScrollTo(activeFeature*getMeasuredWidth(), 0);
return true;
}
} catch (Exception e) {
// nothing
}
return false;
}
}
}
9 ответов
Обновление: я понял это. В моем ScrollView мне нужно было переопределить метод onI nterceptTouchEvent, чтобы перехватывать событие касания только в том случае, если движение Y - это> движение X. Кажется, что поведение ScrollView по умолчанию состоит в том, чтобы перехватывать событие касания всякий раз, когда есть ЛЮБОЕ Y-движение. Таким образом, с исправлением ScrollView будет перехватывать событие, только если пользователь намеренно прокручивает в направлении Y и в этом случае передает ACTION_CANCEL детям.
Вот код для моего класса Scroll View, который содержит HorizontalScrollView:
public class CustomScrollView extends ScrollView {
private GestureDetector mGestureDetector;
public CustomScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
mGestureDetector = new GestureDetector(context, new YScrollDetector());
setFadingEdgeLength(0);
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
return super.onInterceptTouchEvent(ev) && mGestureDetector.onTouchEvent(ev);
}
// Return false if we're scrolling in the x direction
class YScrollDetector extends SimpleOnGestureListener {
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
return Math.abs(distanceY) > Math.abs(distanceX);
}
}
}
Спасибо, Джоэл, за подсказку, как решить эту проблему.
Я упростил код (без необходимости в GestureDetector) для достижения того же эффекта:
public class VerticalScrollView extends ScrollView {
private float xDistance, yDistance, lastX, lastY;
public VerticalScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
xDistance = yDistance = 0f;
lastX = ev.getX();
lastY = ev.getY();
break;
case MotionEvent.ACTION_MOVE:
final float curX = ev.getX();
final float curY = ev.getY();
xDistance += Math.abs(curX - lastX);
yDistance += Math.abs(curY - lastY);
lastX = curX;
lastY = curY;
if(xDistance > yDistance)
return false;
}
return super.onInterceptTouchEvent(ev);
}
}
Я думаю, что нашел более простое решение, только при этом используется подкласс ViewPager вместо (его родительского) ScrollView.
ОБНОВЛЕНИЕ 2013-07-16: Я добавил переопределение для onTouchEvent также. Это могло бы помочь с проблемами, упомянутыми в комментариях, хотя YMMV.
public class UninterceptableViewPager extends ViewPager {
public UninterceptableViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
boolean ret = super.onInterceptTouchEvent(ev);
if (ret)
getParent().requestDisallowInterceptTouchEvent(true);
return ret;
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
boolean ret = super.onTouchEvent(ev);
if (ret)
getParent().requestDisallowInterceptTouchEvent(true);
return ret;
}
}
Это похоже на технику, используемую в android.widget.Gallery в OnScroll (). Это объясняется в презентации Google I/O 2013 " Написание пользовательских представлений для Android".
Обновление 2013-12-10: аналогичный подход также описан в сообщении Кирилла Гручникова о (тогда) приложении Android Market.
Я обнаружил, что иногда ScrollView восстанавливает фокус, а другой теряет фокус. Вы можете предотвратить это, предоставив только один фокус scrollView:
scrollView1= (ScrollView) findViewById(R.id.scrollscroll);
scrollView1.setAdapter(adapter);
scrollView1.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
scrollView1.getParent().requestDisallowInterceptTouchEvent(true);
return false;
}
});
Это не сработало для меня. Я изменил его, и теперь он работает гладко. Если кому интересно.
public class ScrollViewForNesting extends ScrollView {
private final int DIRECTION_VERTICAL = 0;
private final int DIRECTION_HORIZONTAL = 1;
private final int DIRECTION_NO_VALUE = -1;
private final int mTouchSlop;
private int mGestureDirection;
private float mDistanceX;
private float mDistanceY;
private float mLastX;
private float mLastY;
public ScrollViewForNesting(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
final ViewConfiguration configuration = ViewConfiguration.get(context);
mTouchSlop = configuration.getScaledTouchSlop();
}
public ScrollViewForNesting(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public ScrollViewForNesting(Context context) {
this(context,null);
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
mDistanceY = mDistanceX = 0f;
mLastX = ev.getX();
mLastY = ev.getY();
mGestureDirection = DIRECTION_NO_VALUE;
break;
case MotionEvent.ACTION_MOVE:
final float curX = ev.getX();
final float curY = ev.getY();
mDistanceX += Math.abs(curX - mLastX);
mDistanceY += Math.abs(curY - mLastY);
mLastX = curX;
mLastY = curY;
break;
}
return super.onInterceptTouchEvent(ev) && shouldIntercept();
}
private boolean shouldIntercept(){
if((mDistanceY > mTouchSlop || mDistanceX > mTouchSlop) && mGestureDirection == DIRECTION_NO_VALUE){
if(Math.abs(mDistanceY) > Math.abs(mDistanceX)){
mGestureDirection = DIRECTION_VERTICAL;
}
else{
mGestureDirection = DIRECTION_HORIZONTAL;
}
}
if(mGestureDirection == DIRECTION_VERTICAL){
return true;
}
else{
return false;
}
}
}
Благодаря Neevek его ответ сработал для меня, но он не блокирует вертикальную прокрутку, когда пользователь начинает прокручивать горизонтальный вид (ViewPager) в горизонтальном направлении, а затем, не поднимая прокрутку пальцем вертикально, начинает прокручивать вид базового контейнера (ScrollView), Я исправил это, внеся небольшое изменение в код Neevak:
private float xDistance, yDistance, lastX, lastY;
int lastEvent=-1;
boolean isLastEventIntercepted=false;
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
xDistance = yDistance = 0f;
lastX = ev.getX();
lastY = ev.getY();
break;
case MotionEvent.ACTION_MOVE:
final float curX = ev.getX();
final float curY = ev.getY();
xDistance += Math.abs(curX - lastX);
yDistance += Math.abs(curY - lastY);
lastX = curX;
lastY = curY;
if(isLastEventIntercepted && lastEvent== MotionEvent.ACTION_MOVE){
return false;
}
if(xDistance > yDistance )
{
isLastEventIntercepted=true;
lastEvent = MotionEvent.ACTION_MOVE;
return false;
}
}
lastEvent=ev.getAction();
isLastEventIntercepted=false;
return super.onInterceptTouchEvent(ev);
}
Это наконец стало частью библиотеки поддержки v4, NestedScrollView. Таким образом, в большинстве случаев, я думаю, больше не нужны локальные хаки.
Решение Neevek работает лучше, чем решение Joel на устройствах под управлением 3.2 и выше. В Android есть ошибка, которая приводит к тому, что java.lang.IllegalArgumentException: pointerIndex выходит за пределы диапазона, если детектор жестов используется внутри scollview. Чтобы продублировать проблему, создайте пользовательский скроллвью, как предложил Джоэл, и поместите пейджер внутри. Если вы перетащите (не поднимайте фигуру) в одном направлении (влево / вправо), а затем в противоположном направлении, вы увидите сбой. Также в решении Джоэла, если вы перетаскиваете пейджер просмотра, перемещая палец по диагонали, как только ваш палец покинет область просмотра содержимого пейджера просмотра, пейджер вернется в прежнее положение. Все эти проблемы больше связаны с внутренним дизайном Android или его отсутствием, чем с реализацией Джоэла, которая сама по себе является частью умного и лаконичного кода.
Дата: 2021 - 12 мая
Выглядит тарабарщиной .. но поверьте мне, это того стоит, если вы хотите прокрутить любой вид по горизонтали в вертикальном скроллвью, гладко !!
Работает и в компоновке реактивного ранца, создавая настраиваемый вид и расширяя вид, который вы хотите прокрутить по горизонтали; внутри представления с вертикальной прокруткой и с использованием этого настраиваемого представления в компонуемом AndroidView (прямо сейчас «Jetpack Compose находится в версии 1.0.0-beta06»
Это наиболее оптимальное решение, если вы хотите свободно прокручивать по горизонтали и по вертикали свободно, без того, чтобы вертикальная полоса прокрутки перехватывала касание ur, когда вы прокручиваете горизонтально, и позволяя только вертикальной полосе прокрутки перехватывать касание, когда вы прокручиваете вертикально через горизонтальную прокрутку:
private class HorizontallyScrollingView @JvmOverloads constructor(
context: Context, attrs: AttributeSet? = null
) : ViewThatYouWannaScrollHorizontally(context, attrs){
override fun onTouchEvent(event: MotionEvent?): Boolean {
// When the user's finger touches the webview and starts moving
if(event?.action == MotionEvent.ACTION_MOVE){
// get the velocity tracker object
val mVelocityTracker = VelocityTracker.obtain();
// connect the velocity tracker object with the event that we are emitting while we are touching the webview
mVelocityTracker.addMovement(event)
// compute the velocity in terms of pixels per 1000 millisecond(i.e 1 second)
mVelocityTracker.computeCurrentVelocity(1000);
// compute the Absolute Velocity in X axis
val xVelocityABS = abs(mVelocityTracker.getXVelocity(event?.getPointerId((event?.actionIndex))));
// compute the Absolute Velocity in Y axis
val yVelocityABS = abs(mVelocityTracker.getYVelocity(event?.getPointerId((event?.actionIndex))));
// If the velocity of x axis is greater than y axis then we'll consider that it's a horizontal scroll and tell the parent layout
// "Hey parent bro! im scrolling horizontally, this has nothing to do with ur scrollview so stop capturing my event and stay the f*** where u are "
if(xVelocityABS > yVelocityABS){
// So, we'll disallow the parent to listen to any touch events until i have moved my fingers off the screen
parent.requestDisallowInterceptTouchEvent(true)
}
} else if (event?.action == MotionEvent.ACTION_CANCEL || event?.action == MotionEvent.ACTION_UP){
// If the touch event has been cancelled or the finger is off the screen then reset it (i.e let the parent capture the touch events on webview as well)
parent.requestDisallowInterceptTouchEvent(false)
}
return super.onTouchEvent(event)
}
}
Здесь,
И после того, как пользователь завершит прокрутку по горизонтали и попытается прокрутить по вертикали через горизонтальную полосу прокрутки, которая находится внутри вертикальной полосы прокрутки, он увидит, что скорость касания по оси Y больше, чем по оси X, что показывает, что пользователь не прокручивает горизонтально и при горизонтальной прокрутке будет сказано: «Эй, ты! Родитель, ты меня слышишь?.. пользователь прокручивает меня вертикально, теперь ты можешь перехватить прикосновение и показать элементы, находящиеся подо мной, в вертикальной прокрутке».