2011-12-15 12 views
5

Intento mostrar el libro de epub en la plataforma de Android. Puedo analizar el HTML y CSS, con el fin de mostrar el contenido y el formato del libro, tal vez el libro incluye imágenes, Parece que tengo dos opciones:render el libro epub en android?

  1. uso Webview.
  2. Escriba una vista de cliente, para que pueda representar html/css --- parece una tarea muy complicada.

¿Cuál es la mejor manera? Si tengo que usar WebView, ¿qué hay de la lógica de salto de página, dado que la vista web analiza un archivo html en una página, no puedo encontrar el salto de página en la vista web.

Respuesta

4

uno de los buenos, pero en la pregunta ... :-)

No creo que cualquier lógica de salto de página para Android está disponible en vista web, Según su preocupación WebView es la buena opción para mostrar Epub archivo (Puede agregar muchas funciones como, resaltar, buscar, marcar, etc.). Y si lo encuentra, ¿qué pasa si se cambia el tamaño del dispositivo? Lo que estoy haciendo es solo mostrar WebPage en webview y desactivar scroll, luego puedo encontrar la altura máxima de la vista web y el tamaño de la pantalla del dispositivo (alto y ancho), ahora he puesto dos botones para la página siguiente y las anteriores, que solo desplazarse a la página de acuerdo con la altura del tamaño del dispositivo ..

Algo fácil .. Prueba esto si quieres ... (esta es mi opinión personal puede ser que me equivoque en esto)

+0

Sí, hay tantas funciones webview ha dado. –

+0

Simplemente no puedo encontrar cómo agregar funcionalidad como resaltar o buscar o marcar .. – rohit

+0

¿Puede dar un ejemplo de búsqueda y funcionalidad de marcador en archivo epub usando webview –

5

he desarrollado un jugador epub nativa para Android e iOS

Código he compartido aquí es parte de mi código fuente del producto, copiar y pegar no va a funcionar para usted. Considéralo como referencia.

He utilizado webview en android y uiwebview en ios haciendo vista personalizada y el análisis html/css es casi como desarrollar un nuevo motor de renderizado (es decir, navegador). Es un proceso tedioso y complejo.

Brevemente te doy los pasos que he seguido para android

  • Crear una vista web personalizada
  • dirección URL de carga y escribir devolver la llamada clientes (WebViewClient, WebChromeClient)
  • después de la carga vistaweb hacer la paginación mediante el siguiente método

Código:

private class MyWebClient extends WebViewClient 
    { 
     @Override 
     public void onPageStarted(WebView view, String url, Bitmap favicon) { 
      super.onPageStarted(view, url, favicon); 
     } 
     @Override 
     public void onPageFinished(WebView view, String url) 
     { 
      super.onPageFinished(view, url); 

      final MyWebView myWebView = (MyWebView) view; 

      String varMySheet = "var mySheet = document.styleSheets[0];"; 

       String addCSSRule = "function addCSSRule(selector, newRule) {" 
         + "ruleIndex = mySheet.cssRules.length;" 
         + "mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" 

         + "}"; 

       String insertRule1 = "addCSSRule('html', 'padding: 0px; height: " 
         + (myWebView.getMeasuredHeight()/getContext().getResources().getDisplayMetrics().density) 
         + "px; -webkit-column-gap: 0px; -webkit-column-width: " 
         + myWebView.getMeasuredWidth() + "px;')"; 

       myWebView.loadUrl("javascript:" + varMySheet); 
       myWebView.loadUrl("javascript:" + addCSSRule); 
       myWebView.loadUrl("javascript:" + insertRule1); 



     } 
    } 

private class MyWebChromeClient extends WebChromeClient 
    { 
     @Override 
     public void onProgressChanged(WebView view, int newProgress) 
     { 
      super.onProgressChanged(view, newProgress); 
      // GlobalConstants.ENABLE_WEB_VIEW_TOUCH = false; 
      if(newProgress == 100) 
      { 
       postDelayed(new Runnable() 
       { 
        @Override 
        public void run() 
        { 
         calculateNoOfPages(); 

        } 
       },300); 
      } 
     } 
    } 

private void calculateNoOfPages() 
    { 

     if(getMeasuredWidth() != 0) 
     { 
      int newPageCount = computeHorizontalScrollRange()/getMeasuredWidth(); 
     } 
    } 

Inyectar jquery.js en vista web:

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); 
    } 
  • envoltura de todas las palabras en tramos - se utiliza para resaltar el texto y navegar a una página.
  • habría 3 vistas de la web: página actual, página siguiente y página anterior. Debería establecer el desplazamiento en desplazamiento de la vista web según el recuento de páginas de ese capítulo. digamos que un archivo .html tiene contenido de 3 páginas; la vista web anterior es la primera página, la vista web actual es la segunda página, la vista web siguiente es la tercera página pero todas las vistas cargadas tienen la misma URL. Pero el desplazamiento del contenido es diferente.
  • escriba su propia página deslizando la lógica en lugar de usar viewpager. Simplemente pase la página actual al adaptador, entonces el adaptador le devolverá la página siguiente y la página anterior. Por algunos cálculos.

Código:

@Override 
    public PageView getPreviousView(PageView oldPage) 
    { 
     MyWebView oldWebView = ((PageView)oldPage).getWebView(); 

     int chapterIndex = oldWebView.getData().getIndexOfChapter(); 
     int pageIndex = oldWebView.getData().getIndexOfPage(); 
     int pageCount = oldWebView.getData().getChapterVO().getPageCount(); 
     pageIndex--; 
     if(pageIndex < 0) 
     { 
      pageIndex = 0; 
      chapterIndex--; 
      if(chapterIndex<0) 
      { 
       //return the same page 
       chapterIndex = 0; 
       return null; 
      } 
      else 
      { 
       //previous chapter last page 
       PageView pageView = new PageView(oldPage.getContext(),_mViewPager); 
       MyWebView webView= pageView.getWebView(); 

       PageVO data = new PageVO(); 
       data.setChapterVO(_chaptersColl.get(chapterIndex)); 
       data.setIndexOfChapter(chapterIndex); 
       data.setIndexOfPage(-2); 

       webView.setData(data); 
       return pageView; 
      } 
     } 
     else if(pageIndex <= pageCount-1) 
     { 
      //same chapter previous page 
      PageView pageView = new PageView(oldPage.getContext(),_mViewPager); 
      MyWebView webView= pageView.getWebView(); 

      PageVO data = new PageVO(); 
      data.setChapterVO(_chaptersColl.get(chapterIndex)); 
      data.setIndexOfChapter(chapterIndex); 
      data.setIndexOfPage(pageIndex); 

      webView.setData(data); 
      return pageView; 
     } 
     return oldPage; 
    } 

    @Override 
    public PageView getNextView(PageView oldPage) 
    { 
     MyWebView oldWebView = ((PageView)oldPage).getWebView(); 
     int chapterIndex = oldWebView.getData().getIndexOfChapter(); 
     int pageIndex = oldWebView.getData().getIndexOfPage(); 
     int pageCount = oldWebView.getData().getChapterVO().getPageCount(); 
     pageIndex++; 
     if(pageIndex>=pageCount) 
     { 
      pageIndex=0; 
      chapterIndex++; 
      if(chapterIndex>=_chaptersColl.size()) 
      { 
       //end of the chapters and pages so return the same page 
       chapterIndex--; 
       return null; 
      } 
      else 
      { 
       //next chapter first page 
       PageView pageView = new PageView(oldPage.getContext(),_mViewPager); 
       MyWebView webView= pageView.getWebView(); 

       PageVO data = new PageVO(); 
       data.setChapterVO(_chaptersColl.get(chapterIndex)); 
       data.setIndexOfChapter(chapterIndex); 
       data.setIndexOfPage(pageIndex); 

       webView.setData(data); 

       return pageView; 
      } 
     } 
     else 
     { 
      //next page in same chapter 
      PageView pageView = new PageView(oldPage.getContext(),_mViewPager); 
      MyWebView webView= pageView.getWebView(); 

      PageVO data = new PageVO(); 
      data.setChapterVO(_chaptersColl.get(chapterIndex)); 
      data.setIndexOfChapter(chapterIndex); 
      data.setIndexOfPage(pageIndex); 
      //data.setPageCount(pageCount); 

      webView.setData(data); 

      return pageView; 
     } 
    } 

No hay necesidad de utilizar cualquier librería de terceros .just necesidad de gastar una buena cantidad de tiempo para escribir cada cosa su propio.

+0

#Uday Sravan, soy nuevo en el desarrollo de epub en android y he estado probando varias opciones para Android ePub Pagination y page transition durante las últimas 3 semanas. Solo tu respuesta parece funcionar bien. ¿Puedo obtener algún código de muestra funcionando? – SBM

+0

¿Puede decirme cuándo exactamente debería llamar a addJQueryJS()? ¿Es después de cargar la página HTML a la vista web o antes de eso? – hriziya