Disable web view vertical drag without clipping the content

Question

I have a web view on which I load HTML content for epub books. The web view content is paginated so the user can flip through the pages horizontally while reading the e-book.

I use onFlingDo to swipe left and right and allow the user to surf the content. I have customized my webview as shown below:

public class newBTWebView extends WebView implements QuickAction.OnDismissListener, PopoverView.PopoverViewDelegate, GestureDetector.OnGestureListener {
    public newBTWebView(Context context) {
        super(context);
        this.ctx = context;
        setup(context);
        init(context);

    }

    public void init(Context context) {

         this.context = context;
         this.getSettings().setJavaScriptEnabled(true);
         addJavascriptInterface(new MyJavaScriptInterface(this.context), "HTMLOUT");

         gestureScanner = new GestureDetector(this);
         this.setVerticalScrollBarEnabled(false);
         this.setHorizontalScrollBarEnabled(false);

         this.setOnTouchListener(new View.OnTouchListener() {

             public boolean onTouch(View v, MotionEvent event) {
                 int action = event.getAction();
                 if(event.getAction() == MotionEvent.ACTION_DOWN)
                 {
                     countDown++;
                 }

                 if(event.getAction() == MotionEvent.ACTION_UP  && isLongPress)
                 {

                     lastTouchedX = (int)event.getX();
                     lastTouchedY = (int)event.getY();
                     //get selection

                 }
                 return gestureScanner.onTouchEvent(event);
             }
         });
     } 
     @Override
     public boolean onTouchEvent(MotionEvent event) {
         int[] l = new int[2];
         this.getLocationOnScreen(l);
         int X = (int)event.getX();
         int Y = (int)event.getY();
         this.displayR = new Rect(X, Y, X + 100, Y + 20);
         return super.onTouchEvent(event);

     }

     public boolean onFlingDo(float from, float to, float velocityX, float velocityY) {
         float diff = Math.abs(to - from);
         //swipe left or right depend on diff

    }
}

The web view is connected to this css file:

html {
    height:heightplaceholderpx;
    width:100%;
}

body {
    margin:0px;
    padding:0px;
    height:100%;
    width:100%;
    pointer-events: none;
}


#viewer {
    width:widthplaceholderpx;
    height:heightplaceholderpx; 
}

#book {
    width:widthplaceholderpx;
    height:heightplaceholderpx;

    margin-left:50px;
    margin-right:50px;
    margin-top:10px;

    -webkit-column-count:auto;
    -webkit-column-width:widthplaceholderpx;
    -webkit-column-gap:100px;
    text-align:justify;
}

div.container {
  height: 100%;
  width:widthplaceholderpx;
  overflow-y: hidden;
}

.h {
    margin-top:60px;
    margin-left:100px; 
    margin-right:100px;
}

img {
    max-width: 100%;
    height:auto;
}

My main purpose is to disable drag horizontally and vertically, while keeping the gestures and longClick and hyperlinks working and without clipping the HTML file horizontally so the user can surf the book horizontally.

Kindly note that overflow-y: hidden; disables the drag horizontally and vertically but also clips the content, therefore the user will only see the first page of the chapter.

Bifilar

IS the website purely used in a webview in an app or is there also a website version where you can read the book. – Spoonbill

Kindly note that this is not a website, but an html document for an ePub format e-Book and this webview is a customization of the default android webview to capture swipe gestures and longClick – Bifilar

By clipping the html do you mean that ome of your content is not visible (your pagination in this example)? – Spoonbill

@dh19 yes since the html is paginated in a horizontal format, so only the first page shows and the others are clipped. – Bifilar

If you use javascript in your page, you should be able to add the touchmove event listener and then prevent the default behaviour. – Spoonbill