2014年1月17日金曜日

WebView loadData css反映 はまった事をメモ


htmlをwebViewで表示する際にはまったのでメモします。


 

  String data = "<html>" +
    "<head>" +
    "<style css="" text="" type="\">body img{max-width:100%;height:auto;}</style>" +
    "</head>";
  data += "<body>内容<img src="" />//★めっちゃ大きな画像</body>";
  data += "</html>";

 webview.loadData(data, "text/html; charset=utf-8", "UTF-8");


この大きな画像が表示領域からでないようにしたかったのですが
max-widthのあたりで表示がされなくなってしまいました。。

しかし100%→100pxに変えてみると…表示されました(@@?)なんで?

当初はmax-widthが使用できないのかと思いましたがそうではなかったようで
探しているとloadData関数にバグがある事を発見(@@!!!)
どうも「%,#,\,?」が消されてしまうとかっ(・_・`)エー


以下のように書き換えてあげないといけない感じでした。
# => %23
% => %25
\ => %27
? => %3f


そして変更版がこれ↓ これではみ出さずに画像がおさまってくれました。(^Θ^)
 

  String data = "<html>" +
    "<head>" +
    "<style css="" text="" type="\">body img{max-width:100%25;height:auto;}</style>" +
    "</head>";
  data += "<body>内容<img src="" />//★めっちゃ大きな画像</body>";
  data += "</html>";

 webview.loadData(data, "text/html; charset=utf-8", "UTF-8");




ここのサイトのおかげで解決できました!ありがとうございます。m(._.)m
http://tsukinihinikeni.blogspot.jp/2011/03/webviewloaddataloaddatawithbaseurl1.html

0 件のコメント:

コメントを投稿