English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

AndroidでWebViewを使用してウェブページとデータをロードする方法

このクラスに関するApiの紹介は、概してこれはウェブページを表示できるビューであることを示しています。

webView.loadUrl(http://www.baidu.com/);

表示結果:

さらにHTMLの文字列をロードすることもできます。

String str = "<html><body>あなたのスコアは<b>192</b> points.</body></html>";
webView.loadData(str, "text/html", null);

表示結果:

このコンポーネントを使用して、Activityでウェブページを表示したり、ブラウザにジャンプしてウェブページを表示したりできます。上の例では、スマートフォンブラウザにジャンプして百度ページを表示する例です。以下のWebViewメソッドの紹介では、WebViewメソッドを使用してウェブページを現在のActivityに表示するように制限します

以下では、step by stepでWebViewの使用をデモします。

1、ウェブページのロード

1.WebViewはウェブページを表示するために使用されます。使用する際には常にネットワーク権限を追加する必要があります

<uses-permission android:name="android.permission.INTERNET"/>

2.XMLレイアウトにWebViewタグを追加し、Activityでインスタンス化します

<WebView
android:id="@"+id/main_webview"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
webView = (WebView) findViewById(R.id.main_webview);

3.その後、WebViewのloadUrlメソッドを使用してウェブページをロードできます

webView.loadUrl(http://www.baidu.com/);

4.ただし、このようにロードされたウェブページは、スマートフォンブラウザにジャンプします。ウェブページを現在のActivityに表示するように制限するには、ブラウザモードをfalseに設定する必要があります
以下のようにコードを追加してください:

webView = (WebView) findViewById(R.id.main_webview);
// WebViewのクライアントを設定
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
return false;// falseを返します}}
}
});
webView.loadUrl("http://www.baidu.com/");

表示効果:

これで簡単にウェブページをロードしました。

WebViewは、表示するウェブページの一部の基本内容を設定するための抽象クラスWebSettingsを提供しており、インスタンス化方法はWebViewオブジェクトのgetメソッドを通じて取得します

WebSettings webSettings = webView.getSettings();

このクラスを使用して、WebViewがウェブページを表示する一連の属性を設定できます

属性が効果的に動作しているか確認するために、特にウェブビューウェブページを変更しました。会社のウェブサイトに変更しました。まず、属性を設定しない場合のウェブページのスタイルを見てみましょう。画面がスマートフォン画面に適合していないことがわかります。非常に悪いユーザーエクスペリエンスです

その後、私はWebSettingsクラスを通じて、ウェブページを表示する一連の属性を設定しました

WebSettings webSettings = webView.getSettings();
// WebViewがJavaScriptを実行できるように設定
webSettings.setJavaScriptEnabled(true);
// JavaScriptが自動的にwindowsを開けるように設定
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
// キャッシュを設定
webSettings.setAppCacheEnabled(true);
// キャッシュモードを設定、合計で4つのモードがあります
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
// キャッシュパスを設定
// webSettings.setAppCachePath("");
// ズームをサポート(現在のスクリーンに適応)
webSettings.setSupportZoom(true);
// 画像を適切なサイズに調整
webSettings.setUseWideViewPort(true);
// コンテンツの再レイアウトをサポート、合計で4つの方法があります
// デフォルトはNARROW_COLUMNSです
webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
// 表示されるスクリーンコントロールを設定
webSettings.setDisplayZoomControls(true);
// デフォルトのフォントサイズを設定
webSettings.setDefaultFontSize(12);

設定が完了したら、実行結果を見てみましょう:

すべてのコード:

リストファイル:特にネットワーク権限を追加することを忘れないでください

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android
package="com.wu.webviewdemo">
<uses-permission android:name="android.permission.INTERNET"/>
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>

レイアウトファイル

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#000"
android:gravity="center"
android:paddingBottom=""10dp"
android:paddingTop=""10dp"
android:text="使用WebView"
android:textAllCaps="false"
android:textColor="#fff" />
<WebView
android:id="@"+id/main_webview"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>

Activity

package com.wu.webviewdemo;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends AppCompatActivity {
private WebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView) findViewById(R.id.main_webview);
// WebViewのクライアントを設定
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
return false;// falseを返します}}
}
});
WebSettings webSettings = webView.getSettings();
// WebViewがJavaScriptを実行できるように設定
webSettings.setJavaScriptEnabled(true);
// JavaScriptが自動的にwindowsを開けるように設定
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
// キャッシュを設定
webSettings.setAppCacheEnabled(true);
// キャッシュモードを設定、合計で4つのモードがあります
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
// キャッシュパスを設定
// webSettings.setAppCachePath("");
// ズームをサポート(現在のスクリーンに適応)
webSettings.setSupportZoom(true);
// 画像を適切なサイズに調整
webSettings.setUseWideViewPort(true);
// コンテンツの再レイアウトをサポート、合計で4つの方法があります
// デフォルトはNARROW_COLUMNSです
webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
// 表示されるスクリーンコントロールを設定
webSettings.setDisplayZoomControls(true);
// デフォルトのフォントサイズを設定
webSettings.setDefaultFontSize(12);
webView.loadUrl("http://www.lanou3g.com/");
}
}

二、HTML文字列の読み込み

Android開発の中で、詳細ページを表示する際に、単なるテキストや単なるウェブページではなく、インターフェースを通じてHTMLで書かれたデータが提供されるというような状況がよくあります。このようなデータに直面した場合、私たちが通常采用する方法はWebViewを通じて読み込むことです。これにより、WebViewの別のメソッドが使用されます。

public void loadData(String data, String mimeType, String encoding)

1まず、HTMLのstringがどんなものか見てみましょう。説得力を高め、現実に近づけるために、自分で文字列を作りませんでした(冒頭の例のように)。代わりに、网易ニュースの内容を引用しました(老郭とその弟子のニュース、郭先生の相声は大好きです、酒を飲んで頭を熱くするんですから)

private String body = "<p>  <b>网易娱乐專稿9月7日报道</b>(文/小易)" +
"今日未明、郭徳綱の鶴字派弟子が微博で德雲社に対して忠誠を誓い、自分が以前に德雲社を離れ、 +
"因為恥ずかしさから二年間恩師郭徳綱と師母と連絡を取らなかったために、師門から追い出されるべきだったでしょうが、師父郭徳綱が離れ去らずにいました。 +
"その後、郭徳綱がそのツイートを転載し、文章を添えました「知ることができたら改善は最大のことです」。
加えて、数日前に曹雲金と何雲偉が郭徳綱を非難する内幕が表面化しました。 +
"郭徳綱と弟子たちの様々な紛争がこのまま進むと、完全には収束できないかもしれません。</p><p>  <b>韓鶴曉微博原文:" +
"</b></p><p>  2006年考入鶴字科、名前を鶴曉としました。2009年6月13日恩師郭徳綱先生は私を郭門の弟子として受け入れました。 +
"数年間は食事、宿泊、技を磨くために德雲基地で、師父と師母は一円も受け取っていませんでした。2010年結婚の際、師父と師母が私と愛人に包みと婚約指輪を贈りました。 +
"そして德雲基地で私たちに結婚の家を提供しました。2014年9月、個人的な理由で、無断で外地へ赴きました。その後京に戻り、恩師に直面するのを恥じました。 +
"二年間恩師に会わずにいました。その後上海で活動を始め、2016年6月师父上海公演中、ついに勇気を出して師父に謝罪しました。 +
"師父寛宏大量赦免してくれました。二月の間京に帰る際、特意家中に立ち寄り、師母を訪ね、赦免を求めました。鶴曉が犯した過ちで" +
"この状況は“清門”を引き起こす可能性があり、德雲家譜を再編集する際に、恩師の見捨てられぬおかげで、“一時的な観察”という形で弟子に一線を引かれました。" +
"罪人鶴晓は恩師の教えと見捨てられぬ情を感謝します。鶴晓は京師から数千の遠くにいますが、永遠に德雲を心に留めます。 +
"恩師の丁寧な指導を忘れることはありません。実直に芸術を磨き、良い人間になることを心掛けます!師匠と師母の健康を祈っています。弟子鶴晓、遠くから頭を下げて拝上!</p>";

2.デフォルトの文字コードを設定します。Androidでは一般的にUTFを使用しています。-8

WebSettings webSettings = webView.getSettings();
webSettings.setDefaultTextEncodingName("UTF-8");

3.その後、WebViewのloadDataメソッドを呼び出します

webView.loadData(body, "text/html; charset=UTF-8", null);

表示効果は以下の通りです:

以下はすべてのコードです。レイアウトは(一、ウェブページのロード)を継続して使用し、コード部分も大きな変更はありません。具体的には以下の通りです:

package com.wu.webviewdemo;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends AppCompatActivity {
private WebView webView;
private String body = "<p>  <b>网易娱乐專稿9月7日报道</b>(文/小易)" +
"今日未明、郭徳綱の鶴字派弟子が微博で德雲社に対して忠誠を誓い、自分が以前に德雲社を離れ、 +
"因為恥ずかしさから二年間恩師郭徳綱と師母と連絡を取らなかったために、師門から追い出されるべきだったでしょうが、師父郭徳綱が離れ去らずにいました。 +
"その後、郭徳綱がそのツイートを転載し、文章を添えました「知ることができたら改善は最大のことです」。
加えて、数日前に曹雲金と何雲偉が郭徳綱を非難する内幕が表面化しました。 +
"郭徳綱と弟子たちの様々な紛争がこのまま進むと、完全には収束できないかもしれません。</p><p>  <b>韓鶴曉微博原文:" +
"</b></p><p>  2006年考入鶴字科、名前を鶴曉としました。2009年6月13日恩師郭徳綱先生は私を郭門の弟子として受け入れました。 +
"数年間は食事、宿泊、技を磨くために德雲基地で、師父と師母は一円も受け取っていませんでした。2010年結婚の際、師父と師母が私と愛人に包みと婚約指輪を贈りました。 +
"そして德雲基地で私たちに結婚の家を提供しました。2014年9月、個人的な理由で、無断で外地へ赴きました。その後京に戻り、恩師に直面するのを恥じました。 +
"二年間恩師に会わずにいました。その後上海で活動を始め、2016年6月师父上海公演中、ついに勇気を出して師父に謝罪しました。 +
"師父寛宏大量赦免してくれました。二月の間京に帰る際、特意家中に立ち寄り、師母を訪ね、赦免を求めました。鶴曉が犯した過ちで" +
"この状況は“清門”を引き起こす可能性があり、德雲家譜を再編集する際に、恩師の見捨てられぬおかげで、“一時的な観察”という形で弟子に一線を引かれました。" +
"罪人鶴晓は恩師の教えと見捨てられぬ情を感謝します。鶴晓は京師から数千の遠くにいますが、永遠に德雲を心に留めます。 +
"恩師の丁寧な指導を忘れることはありません。実直に芸術を磨き、良い人間になることを心掛けます!師匠と師母の健康を祈っています。弟子鶴晓、遠くから頭を下げて拝上!</p>";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView) findViewById(R.id.main_webview);
WebSettings webSettings = webView.getSettings();
webSettings.setDefaultTextEncodingName("UTF-8");
webView.loadData(body, "text/html; charset=UTF-8", null);
}
}

上記は編集者が皆さんに紹介したAndroidでネイティブコンポーネントWebViewを使用してウェブページとデータをロードする方法です。皆さんに役立つことを願っています。何か疑問があれば、コメントを残してください。編集者はすぐに回答します。皆さんの呐喊教程サイトへのサポートに感謝します!

声明:本文の内容はインターネットから収集され、著作権者に帰属します。インターネットユーザーが自発的に貢献し、自己でアップロードしました。本サイトは所有権を持ちません。人工的な編集は行われていません。また、関連する法的責任を負いません。著作権に問題があると感じる場合は、メールを送信してください:notice#oldtoolbag.com(メールを送信する際、#を@に置き換えてください。報告を行い、関連する証拠を提供してください。一旦確認がつき、本サイトは侵害する可能性のあるコンテンツをすぐに削除します。)

基本チュートリアル
おすすめ