Search code examples
androidwebviewscrollviewswipegesturedetector

Scrollview (Webview) wont work with GestureDetector


I hope someone can help me. This has been driving me crazy for days.

I am designing an application using webview that allows users to swipe to next screen and back to previous screen using

public boolean onFling(MotionEvent event1, MotionEvent event2, float velocityX, float velocityY)

I also want to enable the user to scroll from top to bottom of the screen if there is more content than can fit on the screen. So, I have in the main.xml file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="800px"
    android:background="#ffffff">
<ScrollView android:id="@+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff">   
<WebView xmlns:android="http://schemas.android.com/apk/res/android"     
android:id="@+id/webview"     
android:scrollbars="vertical"
android:layout_width="fill_parent"     
android:layout_height="fill_parent"
android:background="#ffffff"/>
</ScrollView>
</LinearLayout>

Problem is scroll view is not working now. Before I had the gesturedetector, I was enabling swipe detection using javascript but the user had to be very accurate with their left-right and right-left swipe actions.

I think the issue lies with the code that allows the gestureDetector to work - thanks for the contributor who posted that:

public boolean onFling(MotionEvent event1, MotionEvent event2, float velocityX, float velocityY) {     
String url = findURL(); 
if (event1.getRawX() > event2.getRawX()) {   
if(isButtonScreen(url)==false){
//get next SCREEN to display
getNext(url);
}else{
}
} else { 
if(isButtonScreen(url)==false)
{
//get previous
getPrevious(url);
}else{
}
}   
return true;   
}

I think it says if the user swipes from right to left, then show the next page otherwise show the previous page.

What I would like is some more clarity, if user swipes from left to right within a certain degree, then show next page or if user swipes from right to left within a certain degree, then show previous page, otherwise, scroll up or scroll down.

Is this how I should do it? Or am I missing something fundamental and it should work some other obvious way?

Thanks

Sorry, posted my own response in the wrong place. So far, I have a check to see if it is a fling or a scroll as follows:

//check if it is a swipe or a scroll
            public String isSwipe(MotionEvent event1, MotionEvent event2){
                String swipeDirection = "";
                double X = event1.getRawX()-event2.getRawX();
                double Y = event1.getRawY()-event2.getRawY();
                double Z = Math.round(Math.sqrt(Math.pow(X,2)+Math.pow(Y,2))); //the distance - rounded - in pixels
                double r = Math.atan2(Y,X); //angle in radians (Cartesian system)
                double swipeAngle = Math.round(r*180/Math.PI); //angle in degrees
                if ( swipeAngle < 0 ) { swipeAngle =  360 - Math.abs(swipeAngle); }

                if ( (swipeAngle <= 45) && (swipeAngle >= 0) ) {
                    swipeDirection = "left";
                } else if ( (swipeAngle <= 360) && (swipeAngle >= 315) ) {
                    swipeDirection = "left";
                } else if ( (swipeAngle >= 135) && (swipeAngle <= 225) ) {
                    swipeDirection = "right";
                } else if ( (swipeAngle > 45) && (swipeAngle < 135) ) {
                    swipeDirection = "up";
                } else {
                    swipeDirection = "down";
                }

                return swipeDirection;
            }

Now I want to scrollDown and scrollUp smoothly. If anyone has a reliable answer, I would very much appreciate your comment.

and finally to scroll down I used:

scrollBy(0, 50);

once I was happy i was actually swiping down.

It is not as smooth as I would like so if anyone has any improvements on this I would be most happy.

public boolean onFling(MotionEvent event1, MotionEvent event2, float velocityX, float velocityY) {     
                String url = findURL(); 
                if (event1.getRawX() > event2.getRawX()) {   
                            if(isButtonScreen(url)==false){
                                //get next
                                //getNext(url);
                                show_toast("swipe left"+isSwipe(event1, event2));
                            }else{
                            }
                    } else { 
                        if(isButtonScreen(url)==false){
                            //get previous
                            //getPrevious(url);
                            String result = isSwipe(event1, event2);
                            show_toast("swipe right "+result);
                            if(result.equalsIgnoreCase("down")){
                                //screen height + 50;
                                scrollBy(0, 50);
                            }
                        }else{
                        }
                    }

                return true;   
            }

Solution

  • If you want to use gestures, you should not use a ScrollView without creating your own customer implementation.

    If you must have gestures in a ScrollView, then you should create your own custom class implementing ScrollView and override onTouchEvent from View to do what you want.

    Hope this helps!