Android Question Detecting End of WebView Scroll in B4A

[shahab5375]

Hello B4A community,

I am currently working on an application where I'm using a WebView to display content. I need assistance with detecting when the user has scrolled to the end of the content within the WebView. Specifically, I would like to trigger an event or perform an action when the user reaches the bottom of the WebView scroll.

Could someone please guide me on how to achieve this in B4A? Any pointers, code snippets, or advice on how to detect the end of a WebView scroll and handle this event would be greatly appreciated.

Thank you in advance for your help!

 

[JohnC]

ChatGPT says....

(this code may need tweaking to get it running - but it should be a good start)

Step 1: Inject JavaScript into WebView after Page Load​

We'll use the WebViewExtras library to inject JavaScript into an existing page loaded in the WebView. First, make sure you have the WebViewExtras library added to your B4A project.

Step 2: Handle the Scroll Event in B4A​

' Ensure you have the WebViewExtras library added to your project

Sub Process_Globals
    ' Declare the WebViewExtras object
    Private WebViewExtra As WebViewExtras
End Sub

Sub Globals
    Private WebView1 As WebView
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("main")
    WebView1.Initialize("WebView1")
    Activity.AddView(WebView1, 0, 0, 100%x, 100%y)
  
    ' Load your URL or HTML content into the WebView
    WebView1.LoadUrl("https://example.com")
End Sub

Sub WebView1_PageFinished (Url As String)
    ' Inject JavaScript to detect scroll event
    Dim js As String
    js = "document.addEventListener('scroll', function() { " & _
         "if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) { " & _
         "B4A.CallSub('WebViewScrolledToEnd', false); " & _
         "}});"
    WebViewExtra.ExecuteJavascript(WebView1, js)
End Sub

Sub WebViewScrolledToEnd
    Log("User has scrolled to the end of the WebView content.")
    ' Perform your desired action here
End Sub

 

[shahab5375]

Thank you JohnC. Problem Solved.

 

[jkhazraji]

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.
    Private xui As XUI
End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    Private WebView1 As WebView
    Private wex As WebViewExtras
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("Layout")
    wex.addWebChromeClient(WebView1,"wex")
    wex.addJavascriptInterface(WebView1,"b4a")
    Dim html As String=File.ReadString(File.DirAssets,"index.html")
    WebView1.Loadhtml(html)
    
End Sub
Private Sub WebView1_PageFinished (Url As String)
    
    wex.executeJavascript(WebView1,$"
     window.onscroll = function() {
            if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
                // We've reached the bottom of the page
                alert('scroll end');
                console.log("End of scrolling");
                b4a.CallSub('WebViewEndScrolling', false);
            }
        };
    "$)
    wex.executeJavascript(WebView1, $"
    window.alert = function(message) { b4a.CallSub('ShowAlertMessage', true, message); };
    console.log = function(message) { b4a.CallSub('LogMessage', true, message); };
    "$)

End Sub
Private Sub ShowAlertMessage(msg As String)
    Log($"ShowAlertMessage ${msg}"$)
End Sub
Private Sub LogMessage(msg As String)
    Log($"LogMessage ${msg}"$)
End Sub

Private Sub WebViewEndScrolling
    Log("End of Webview reached")
End Sub