Is there any way to implement fast scroll thumb in webview?

Question

How can I implement fast scroll thumb in a webview?
I'm creating a web browser and would like to implement fast scroll thumb. My main motive is to implement it, not some other alternative.

WebViews already have a scroll speed that is based on the swipe velocity. All my devices scroll pretty fast if you swipe quick. So I am not sure I see the need for a fast scroller thumb tab. But if you are deadset on implementing one I think it might be easier to do it with javascript/html/css in your web content rather than natively when the View like you would for a ListView or something similar. — FoamyGuy, Jan 05 '13 at 05:22
I just don't want my users to keep on scrolling, I want to implement a feature by which they can reach to a point with out having to keep on scroll upwards downwards again and again. Scroll thumb lets the user move a bit fast, webviews scroll isn't that fast my mate. — Yauraw Gadav, Jan 05 '13 at 05:53

score 4 · Answer 1 · answered Apr 09 '13 at 22:18

I was trying to find a way to do this as well and when I saw the suggestion to break out the math I was inspired ;-) I extended WebView and did the following in onTouch

public boolean onTouch(View v, MotionEvent event) {
    switch (event.getAction() & MotionEvent.ACTION_MASK) { 
        case MotionEvent.ACTION_DOWN:
            if(event.getX()>this.getWidth()-50&&(this.canScrollVertically(0)||this.canScrollVertically(1))){
                scrollbarTop = (float)this.computeVerticalScrollExtent()/this.computeVerticalScrollRange()*this.computeVerticalScrollOffset();
                scrollbarBtm = (float)this.computeVerticalScrollExtent()/this.computeVerticalScrollRange()*(this.computeVerticalScrollExtent()+this.computeVerticalScrollOffset());
                if((scrollbarBtm-scrollbarTop)<50){
                    scrollbarTop = scrollbarTop-20;
                    scrollbarBtm = scrollbarBtm+20;
                }
                if(event.getY() > scrollbarTop && event.getY() < scrollbarBtm){
                scrollOffset = event.getY() - scrollbarTop;
                mode = QUICKSCROLL;
                }
                }
            break;
        case MotionEvent.ACTION_UP:
            mode = NONE; 
            break;
        case MotionEvent.ACTION_MOVE: 

            if(mode==QUICKSCROLL){  
                scrollbarTop = (float)this.computeVerticalScrollExtent()/this.computeVerticalScrollRange()*this.computeVerticalScrollOffset();
                scrollbarBtm = (float)this.computeVerticalScrollExtent()/this.computeVerticalScrollRange()*(this.computeVerticalScrollExtent()+this.computeVerticalScrollOffset());
                if((scrollbarBtm-scrollbarTop)<50){
                    scrollbarTop = scrollbarTop-20;
                    scrollbarBtm = scrollbarBtm+20;
                }
                int scrollto = Math.round((float)this.computeVerticalScrollRange()
                                          /this.computeVerticalScrollExtent()*
                                          (event.getY()-scrollOffset));
                if(scrollto>-1
                &&(scrollto+this.computeVerticalScrollExtent())<this.computeVerticalScrollRange()+1
                ){
                this.scrollTo(0,scrollto);
                }
                return true;
            }

            break; 
    } 
    return false; 
}

This will effectively thumb scroll when you drag the WebView within 50 pixels of the right edge & within the height of the scrollbar (or 50 pixels from its centre, whichever is larger)

This worked perfectly for me. Although, there could be htmls which have restricted the normal vertical scrollbar from being shown, it does not work for those cases. — Shilpi, Jun 01 '16 at 11:12

score 3 · Answer 2 · answered Jan 14 '13 at 21:37

I would start by using getContentHeight then do some simple math to find the scale factor relative to your WebView's height. Add some sort of View for the thumb tab either laid out on top of the WebView or perhaps by using addView on it (WebView derives from AbsoluteLayout, but I've never tried adding controls to it directly). Keep it hidden until you want to display it. You'll perhaps have to figure out the current scroll speed or something like that. Similarly you'll have to hide it when the scrolling stops. Then use scrollTo to scroll the WebView. You can figure out the position to scroll to based on the scale factor you calculated in your first step and the dragged position of the thumb tab. You'll also have to figure out how you want to deal with dragging the thumb tab. You could probably more easily do it by modifying another existing control (vertical slider/seek bar?).

score 0 · Answer 3 · edited May 23 '17 at 12:10

As @FoamyGuy mentioned, Web View has smooth scrolling.

Even if you want to implement fast scrolling at your own, you could use setScrollingEnabled(). The following post might help you,

Smooth Scrolling in WebView

Though the original answer is for Edit Text, you can use it for scroll View as per your requirements.

Also, you could think about improving the performance of Web View, Have a look here,

Is there any way to implement fast scroll thumb in webview?

3 Answers3