AndroidでのWebViewテキストズームの問題

私はアンドロイドにドキュメントリーダープロジェクトを持っています。メインアクティビティにはWebViewが含まれます。テキストはhtmlから読んでいます。上のオプションメニューには、テキストサイズを動的に増加させるためのボタンが含まれています（テキストは折り返しています）。これまでのところはっきりしていますが、ボタンが押されると、テキストサイズはいくらか増加しますが、すべてのテキストが画面内で下に移動し、ボタンを2回押すと、テキストサイズが増加し、すべてのテキストがもう少し下に移動します。読者にとっては、このような状況は本当に不満です。読者はボタンを押した後に中断した場所に戻り、読者が読書場所を失うことがないようにしなければならない。この問題を解決するには？ AndroidでのWebViewテキストズームの問題

問題：

のHTML C：問題を解決し

私のWebViewのontent：

<!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>

出典

2016-03-26 ATES

-1

はこれを試してみてください：

settings.setDefaultFontSize(50); //Larger number == larger font size

出典

2016-04-11 20:52:02 Istiyak

画面上のテキストを維持する私の考えは何でも "要素"（P、DIV、IMGなどへの参照を格納することです）がある特定のx,yポイントで画面に表示され、フォントサイズが変更された場合は、の要素を画面にスクロールします。

私は、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(); 
}

・ホープこれはあなたの問題を解決します！

出典

2016-04-12 07:42:00

編集された質問、もっと詳しく見ることができました。私は「___親要素ID ___」を理解していませんか？ – ATES

@ATES大丈夫、私はあなたのHTMLで完璧な実行のための自分のコードを微調整！ –

あなたのスクリプトは安定していません（http://jsbin.com/tuyaru/edit?output） – ATES

ユーザがどこにあるべきかを計算するために、フォントサイズの増加前後のスクロールを使用することを提案します。これは、いくつかの手順で行うことができますフォントサイズを変更する前に

、テキストビューのスクロールの高さとスクロール位置を格納します。スクロールの高さとの比率を決定し、位置の変更
（0と1の間）
した後、新たなスクロールの高さの倍の古い率などの新しいスクロール位置を設定し、新たなスクロール高さ
を測定し、レンダリングをスクロールします。

関連するスニペット：

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; 
}

あなたはここに例をチェックアウトすることができます：https://jsfiddle.net/Ln43xxv5/

を私は今アンドロイドにテストすることはできませんを認めなければならないが、私はは、一般的な方向性を信じてやるうまくいくはずです。

出典

2016-04-13 14:23:32 user3297291

私はあなたのスクリプトをjsfiddleとandroid appで試しましたが、安定しませんでした。パラグラフは画面上部に置かれていないので、フォントを上げると上下に動いています。 – ATES

このコードは、数学ベースのソリューションに対して非常に正確に実行されます。私はそれが好きです！しかし、コンテナに異なるサイズのフォントとイメージが含まれているとどうなりますか？私は高さの比率がそれらの不一致を説明するとは思わない。 –

それについては考えなかった。有効なポイントを変える！私は、このソリューションは電子書籍のようなコンテンツのチャンスを立てるだろうと思う...あなたのコメントいただきありがとうございます。 – user3297291

AndroidでのWebViewテキストズームの問題

答えて

関連する問題