webViewでhtml画像を読み込む際の問題を解決する。
2022-02-06 09:36:16
いきなりxml形式のhtml文字列というパースインターフェースが現れても、慌てる必要はなく、普通にwebviewのloaddataメソッドに任せれば解決しますが、今日は画像文字列のセットについてです
<img src="//yanxuan.nosdn.127.net/75c55a13fde5eb2bc2dd6813b4c565cc.jpg">
<img src="//yanxuan.nosdn.127.net/e27e1de2b271a28a21c10213b9df7e95.jpg">
<img src="//yanxuan.nosdn.127.net/9d413d1d28f753cb19096b533d53418d.jpg">
<img src="//yanxuan.nosdn.127.net/64b0f2f350969e9818a3b6c43c217325.jpg">
<img src="//yanxuan.nosdn.127.net/a668e6ae7f1fa45565c1eac221787570.jpg">
<img src="//yanxuan.nosdn.127.net/0d4004e19728f2707f08f4be79bbc774.jpg">
<img src="//yanxuan.127.net/79ee021bbe97de7ecda691de6787241f.jpg">
指定されたURLにはhttp:// が含まれていないため、どのようにしても解決できません。データを継ぎ足し、jsoupで画面に適応させるだけである。
implementation 'org.jsoup:jsoup:1.10.2'
パース方法
public static String formatHtml(String str){
// String httpStr="";
// String divStr="<div>$content</div>";
// String ulStr="<ul style=\"line-style:none\">$ul</ul>";
String[] split = str.split(">");
StringBuffer sb = new StringBuffer();
for (int i = 0; i < split.length; i++) {
String replace = split[i].replace("<img src=\"", "<img src=\"http:");
sb.append(replace+">");
// sb.append("<li>"+ replace +">"+"</li>");
}
// ulStr=ulStr.replace("$ul", sb.toString());
// divStr=divStr.replace("$content", ulStr);
return sb.toString();
}
このhtmlスニペットを標準的なdivのネストされた順序なしリストに戻すことを考えたのですが、それでも面倒なことはせずにうまく機能することがわかりました。以下はそのコードです。
// content is the html data
String content = t1.getData().getContent();
// Do the splicing http:
String s = formatHtml(content);
//jsoup adapt to screen size
Document doc = Jsoup.parse(s);
Elements elem_img = doc.getElementsByTag("img");
// Image adapts to the screen
if (elem_img.size() ! = 0) {
for (Element el_img : elem_img) {
el_img.attr("style", "width:100%");
}
}
// Convert back to string after adaptation
String s1 = doc.toString();
// The following settings do not need to be set, and the effect is not as good as after jsoup adaptation
// WebSettings settings = webView.getSettings();
// settings.setJavaScriptEnabled(true);
// settings.setUseWideViewPort(true); // key point
// settings.setLoadWithOverviewMode(true);
// open the browser inside the webview
webView.setWebViewClient(new WebViewClient());
// settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
// settings.setDefaultTextEncodingName("utf-8") ;
// The following two methods have the same effect, use either one
webView.loadData(s1, "text/html","utf-8");
// webView.loadDataWithBaseURL(null,s1, "text/html", "utf-8", null);
Log.i("tag", "subjectPage 1Result: "+s);
以上、本記事の全内容をご紹介しましたが、皆様の学習のお役に立てれば幸いです。また、Script Houseをより一層応援していただければ幸いです。
関連
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Html5モバイルdivは、ナビゲーションバーの下部を達成するために下部に固定されているいくつかの方法
-
Html5+CSS3+EL表現問題まとめ
-
モバイルHTML5入力に関するFAQ(要約)
-
シェアボタン付きAmazeUIボトムナビゲーションバー用サンプルコード
-
Html5ナビゲーションバー天井画の原理と対照的な実装
-
localStorageの最大記憶容量を取得する方法を説明する
-
顔決済機能の実装をベースにしたHTML5+tracking.js
-
canvas.toDataURL()エラーの詳細な解決策はすべてこちら
-
html+js マークダウンエディタ効果
-
html5でBUI折りたたみメニュープラグインを書く方法