Question

从阅读一些Q＆amp; As stackoverflow，我知道webview可能是显示epub文件的好选择。

在下面的帖子中，它提到你也可以在webview中突出显示。 render the epub book in android?

有人可以指导我们如何在网页视图中突出显示某些文字吗？大约2个月前在下面的帖子中提出了类似的问题，但还没有得到答案。 https://stackoverflow.com/questions/12948352/highlight-unhighlight-some-text-permanently-in-epub-file-in-android

请帮我弄清楚如何在android中为epub阅读器实现高亮功能。谢谢。

Answer 1

         webview.findAll(htmlTextStr);
         webview.setSelected(true);
         webview.findNext(true);

试试这个，htmlTextStr必须是你要突出显示的文本

Answer 2

I am giving this answer based on my experience into development of native epub player for android and ios.
I had achieved it in this way .

This is the way I have done text highlighting

- once your url loads into webview in onload call back inject jquery lib to webview dom like this


    private void addJQueryJS() 
        {
            String path = "file:///android_asset/JSLibraries/jquery.min.js";
            String data = "{\"MethodName\":\"onJQueryJSLoaded\",\"MethodArguments\":{}}";
            String callBackToNative  = " jsInterface.callNativeMethod('jstoobjc:"+data+"');";
            String script = "function includeJSFile()"
                                   +"{"
                                   +"function loadScript(url, callback)"
                                   +"{"
                                   +"var script = document.createElement('script');"
                                   +"script.type = 'text/javascript';"
                                   +"script.onload = function () {"
                                   +"callback();"
                                   +"};"
                                   +"script.src = url;"
                                   +"if(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0])"
                                   +"{"
                                   +"(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(script);"
                                   +"}"
                                   +"else { callback(); }"
                                   +"}"
                                   +"loadScript('"+path+"', function ()"
                                   +"{"
                                   +callBackToNative
                                   +"});"
                                   +"} ; includeJSFile();";
            loadUrl("javascript: "+script);
        }

wrap each word into a span with a unique id

then create a js file and inject same as jquery and write touch methods in it 


    function onTouchMove(e)
    {
        e.preventDefault();
        if((touchendStartStick == true || touchendEndStick == true) && currHVO != undefined)
        {
            var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
            var obj = document.elementFromPoint(touch.pageX-window.pageXOffset,touch.pageY-window.pageYOffset);

            if($(obj).is('span'))
            {
                $(obj).css('background-color','rgba(0,0,255,0.3)');
            }
        }
    };


you can get word x,y width height values also .so you can show start ,end draggable pins on native view.

you can save highlight by saving the first and last word id of an highlight into db or to some persistent storage.Next time when user opens the book get those words ids and highlight those spans .

如何突出android中的epub文本

2 个答案: