WebView Text Zoom Issue dans Android

J'ai un projet de lecteur de document dans Android. L'activité principale comprend un WebView. Les textes sont en lecture de html. Dans le menu Options supérieures, vous trouverez un bouton pour augmenter dynamiquement le format de texte (le texte est en train d'enrouler). Jusqu'à présent, si clair, mais lorsque le bouton est pressé, la taille du texte augmente, mais tout le texte se déplace vers le bas dans l'écran et deux fois, en appuyant sur le bouton, la taille du texte augmente et tout le texte diminue un peu plus. Cette situation est vraiment frustrante pour les lecteurs. Le lecteur doit revenir à l'endroit où il s'est arrêté après avoir appuyé sur le bouton afin que le lecteur ne perde pas l'emplacement de lecture. Comment résoudre ce problème?

Le problème:

  • Réécrire le code Java dans JS - créer un audio à partir d'octets?
  • Android - Envoyer le message Telegram à un numéro spécifique
  • Comment faire de l'application Facebook sur un nouveau menu sur Android?
  • Comment analyser la date de GMT TimeZone à IST TimeZone et Vice Versa dans Android
  • Osx maven exécutant des tests Exception: java.lang.OutOfMemoryError jeté de UncaughtExceptionHandler en thread "main"
  • Envoyer un MMS depuis mon application sur Android
  • Le problème:

    Lorsqu'il a résolu le problème:

    Lorsqu'il a résolu le problème:

    Contenu Html de mon WebView:

    <!DOCTYPE html> <head> <style type="text/css"> p{} p.x1{} p.x2{} p.x3{} p.x4{} h2.x1{} h2.x2{} h2.x3{} h2.x4{} </style> </head> <body> //paragraph-1 <p class="x1">Title-1</p> <p class="x2">Title-2</p> <p class="x3">Title-3</p> <p class="x4">Title-4</p> <p>Text content.</p> //paragraph-2 <h class="x1">Title-1</p> <h class="x2">Title-2</p> <p>Text content.</p> //paragraph-3 <h class="x3">Title-1</p> <h class="x4">Title-2</p> <p class="x3">Title-3</p> <p>Text content.</p> //paragraph-4 <h class="x2">Title-1</p> <p class="x3">Title-2</p> <p>Text content.</p> //... </body> </html> 

    3 Solutions collect form web for “WebView Text Zoom Issue dans Android”

    Je propose d'utiliser la position de défilement relative avant et après l'augmentation de la taille de la police pour calculer l'emplacement de l'utilisateur. Cela peut se faire en quelques étapes:

    1. Avant de modifier la taille de la police, conservez la hauteur de défilement et la position de défilement de la vue de texte. Déterminer le rapport entre la hauteur de défilement et la position de défilement (entre 0 et 1)
    2. Modifier la taille de la police
    3. Après le rendu, mesurez la nouvelle hauteur de défilement
    4. Réglez la nouvelle position de défilement comme un nouveau rapport de hauteur de défilement.

    L'extrait pertinent:

     function setSize() { var heightBefore = textContainer.scrollHeight; var scrollBefore = textContainer.scrollTop; var percBefore = scrollBefore / heightBefore; textContainer.style.fontSize = fontSize + "px"; var heightAfter = textContainer.scrollHeight; var scrollAfter = textContainer.scrollTop; var correctedScrollAfter = Math.floor(heightAfter * percBefore); textContainer.scrollTop = correctedScrollAfter; } 

    Vous pouvez consulter un exemple ici: https://jsfiddle.net/Ln43xxv5/

    Je dois avouer que je ne peux pas tester sur Android maintenant, mais je crois que l'orientation générale devrait fonctionner.

    Mon idée de garder le texte à l'écran est de stocker une référence à n'importe quel "élément" (p, div, img, etc.) est sur l'écran à un certain point x,y , en changeant la taille de la police, puis en défilant cet élément sur l'écran.

    J'ai créé un exemple de code de travail qui fonctionne dans Android Webview:

     //Route your onclick handler to our new function function fontBtnClk() { //Store whatever paragraph container is in the middle of the screen var currentParagraph = document.elementFromPoint(window.innerWidth/3, window.innerHeight/3); //If the above "paragraph selector" selected the whitespace in-between two paragraphs, and stored the parent element instead: if(currentParagraph.tagName.toLowerCase()=="body") { //Divide by a different number to select the winning paragraph currentParagraph = document.elementFromPoint(window.innerWidth/3, window.innerHeight/2); } //Call your existing font size handler increaseFontSize(); //Move the previous paragraph back onto the screen: currentParagraph.scrollIntoView(); } 

    J'espère que cela corrige votre problème!

    Essaye ça :

     settings.setDefaultFontSize(50); //Larger number == larger font size 
    Interesting Posts
    coAndroid est un fan Android de Google, tout sur les téléphones Android, Android Wear, Android Dev et Android Games Apps.