How to show HTML text in Android while detecting clicks on specific phrases and scrolling position?

Question

I'm getting a wall of plain HTML text from the server and need to render it in my application, but that's not all.

I also need to detect clicks on specific phrases within the text. The phrases are defined by two numbers: word count where the phrase starts and word count where it ends (e.g. from word 10 to word 15).

My intuition says that I could probably instrument the HTML with links or some JavaScript according to phrases spec and then listen for clicks on these links. However, I'm not sure how to achieve this kind of functionality in Android.

In addition, I also need to be able to programmatically observe and manipulate the scrolling position within the shown HTML text. For instance, I'll need to understand when a specific phrase is scrolled off the screen.

I guess I have three closely related questions:

1. Which View should I use to achieve the above functionality (TextView, WebView, other)?
2. How can I listen for clicks on specific parts of HTML?
3. How can I observe and manipulate the scrolling position?

Thanks

Answer 1

1. WebView is a quick way to do this.
2. You can map a java/kotlin function to the javascript function on the webpage to track clicks.
3. Again using simple jquery , you can achieve it.

Refer to : slymax web view

Answer 2

I think you can do this by using this method : 1.) You need to get all links from the html text you have. So to do this use this method :

 public static ArrayList<String> extractUrls(String text) {
    ArrayList<String> containedUrls = new ArrayList<>();
    String urlRegex = "((https?|ftp|gopher|telnet|file):((//)|(\\\\))+[\\w\\d:#@%/;$()~_?\\+-=\\\\\\.&]*)";
    Pattern pattern = Pattern.compile(urlRegex, Pattern.CASE_INSENSITIVE);
    Matcher urlMatcher = pattern.matcher(text);

    while (urlMatcher.find()) {
        containedUrls.add(text.substring(urlMatcher.start(0),
                urlMatcher.end(0)));
    }
    return containedUrls;
}

It will return an ArrayList of URLs, Now you need to convert the HTML data into human readable text : To do this use :

public void HtmlToString(final String data) {
    Thread thread = new Thread(new Runnable() {
        @Override
        public void run() {
            final String s = String.valueOf(Html.fromHtml(data));
            runOnUiThread(new Runnable() {
                @Override
                public void run() {
                    processData(s);
                }
            });
        }
    });
    thread.start();
}
void processData(String s){
// Do whatever you want to do
}

We are doing this work on another thread. Now, You have text as well as links, do whatever you want with this. Now if you want to do more work on it you may do this by replacing all the links you get in array list with a special code that you can use as a placeholder like :

for(int i = 0; i < urlArray.size();i++){
    yourData.replace(urlArray.get(i),"<<<YOURSPECIALCODE>>>");       
}

Now you can break your data using your Special code to get the breaks at the place of URLs. To do that :

ArrayList<String> dataArray = new ArrayList<>(yourData.split("<<<YOURSPECIALCODE>>>"));

Now you can use these two arrays to show according to your requirements

As now You can assign different text views to different data and setOnClick Listeners to them very easily.

Hope it may help!

Thank you