【Kotlin/Android Studio】WebViewではPDFは表示できない？jpgやpngなど画像ファイル

【Kotlin/Android Studio】WebViewではPDFは表示できない？jpgやpngなど画像ファイル

この記事からわかること

  • Kotlin/Android StudioでWebViewの使い方
  • PDFファイルは表示できない？
  • 他の画像ファイル(jpg/png)は？

＼ アプリをリリースしました ／

みんなの誕生日

友達や家族の誕生日をメモ！通知も届く-みんなの誕生日-

posted withアプリーチ

環境

AndroidのWebViewではPDFは表示できない

タイトル通りですがAndroidのWebViewでは通常のWebページは表示できるもののWeb上にあるPDFを表示することはできないようです。

通常のWebページならOK

val webView: WebView = findViewById(R.id.web_view)
webView.loadUrl("https://appdev-room.com/")
【Kotlin/Android Studio】WebViewの実装方法！WebサイトやHTMLを表示する

Web上のPDFは表示できない

val webView: WebView = findViewById(R.id.web_view)
webView.loadUrl("https://www.soumu.metro.tokyo.lg.jp/03jinji/uploads/00_kikouzu.pdf")

※https://www.soumu.metro.tokyo.lg.jp/03jinji/uploads/00_kikouzu.pdfは東京都組織図です。

【Kotlin/Android Studio】WebViewではPDFは表示できない？jpgやpngなど画像ファイル

画像(jpg/png)ファイル自体が表示できない

PDFが表示できないので他の画像ファイル(jpg/png)も試してみたところやはり結果は同じで表示できないようです。

val webView: WebView = findViewById(R.id.web_view)
webView.loadUrl("https://appdev-room.com/image/android.png")
【Kotlin/Android Studio】WebViewではPDFは表示できない？jpgやpngなど画像ファイル

原因は？

AndroidのWebViewはWebで表示されるページをそのまま表示させているわけではなく、HTMLを読み込んで表示させているようなのでHTMLではない画像などは表示できないようです。

なので逆にHTMLを渡すことで表示させることもできるようです。

val unencodedHtml = "<html><body>'%23' is the percent code for ‘#‘ </body></html>"
val encodedHtml = Base64.encodeToString(unencodedHtml.toByteArray(), Base64.NO_PADDING)
webView.loadData(encodedHtml, "text/html", "base64")

なのでどうしてもPDFなどを表示させたい場合はWebViewを使わずにブラウザアプリを起動させて開く方法をお勧めします。

おすすめ記事：【Kotlin/Android Studio】ブラウザを起動してWebページを開く方法！

iOSは問題なし

同じようなWebViewの実装でもiOS側では問題なくPDFを表示することができました。OSによって挙動が違うようなので実装の際には注意したほうが良いかもしれません。

おすすめ記事：【Swift UI】WKWebViewクラスでWebページを表示！WKNavigationDelegateの実装

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。

Web制作Android
Web制作phpjavascriptWordPressSwiftLaravelVue.jsgit/GitHubAWSLinuxAndroid

Search Box

Sponsor

ProFile

ame

趣味：読書,プログラミング学習,サイト制作,ブログ

IT嫌いを克服するためにITパスを取得しようと勉強してからサイト制作が趣味に変わりました笑今はCMSを使わずこのサイトを完全自作でサイト運営中〜

個人開発 アプリ

＼ アプリをリリースしました ／

みんなの誕生日

みんなの誕生日

友達や家族の誕生日を登録しておくと当日に通知が届きお知らせしてくれるiOSアプリです。

貸し借り管理アプリ

貸し借り管理アプリ

お金の貸し借りを管理するためのアプリです。貸借の色が分かれているので識別しやすく、使いやすさを求めてできるだけシンプルなUIにしています。一番人気のアプリです。

カシホン

カシホン

人に貸すことが多く、誰に貸したか忘れがちな本の貸し借りを記録できるアプリです。

GitHubにてアプリのソースコードを公開中！

GitHub-みんなの誕生日
GitHub-貸し借り管理アプリ
GitHub-カシホン

New Article