【Android Kotlin】[WebView] 네이티브 앱 안에 인앱 브라우저를 포함(내부 브라우저 기동으로 상세 페이지 표시)

13751 단어 webViewKotlin
환경 메모
⭐️Mac Book Pro(macOS Catalina)
⭐️Android Studio 4.1(Kotlin)

실제로 움직인 동영상↓↓↓↓


구현한 내용



인앱 브라우저의 링크를 탭하면 인앱 브라우저에서 상세 페이지를 표시합니다.


베이스는 아래와 같은 외부 브라우저를 인앱 브라우저로 기동하도록 변경했습니다.

【Android Kotlin】[WebView] 네이티브 앱 안에 인앱 브라우저를 삽입(외부 브라우저 기동으로 상세 페이지 표시)
htps : // 코 m / 논카 피바라 / ms / f095488 에 f59b7f3

구성 설명



・앱내 브라우저내의 링크를 Tap하면, 앱내 브라우저로 상세 페이지를 기동.
이 때 스크롤을 맨 위에 설정

포인트



· shouldOverrideUrlLoading 메서드에서 return false를 반환하면 WebView 안에 표시됩니다.
· 인앱 브라우저에서 상세 페이지를 시작할 때 스크롤을 맨 위에 설정

출처



소스는 아래를 참조

【Android Kotlin】[WebView] 네이티브 앱 안에 인앱 브라우저를 삽입(외부 브라우저 기동으로 상세 페이지 표시)
htps : // 코 m / 논카 피바라 / ms / f095488 에 f59b7f3

위와 다른 것은 MainActivity.ktshouldOverrideUrlLoading 메소드 부분

MainActivity.kt
package com.example.webviewsample

import android.content.Intent
import android.graphics.Bitmap
import android.net.Uri
import android.os.Bundle
import android.view.View
import android.webkit.WebResourceRequest
import android.webkit.WebView
import android.webkit.WebViewClient
import android.widget.Button
import android.widget.ProgressBar
import android.widget.ScrollView
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity(), View.OnClickListener {

    private lateinit var nextButton: Button
    private lateinit var testWebView: WebView
    private lateinit var testProgress: ProgressBar
    private lateinit var testScroll: ScrollView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // 「Page2」のボタン
        nextButton = findViewById(R.id.next_button)
        // 「Page2」リスナー
        nextButton.setOnClickListener(this)
        // スクロール
        testScroll = findViewById<View>(R.id.testScroll) as ScrollView
        // WebView
        testWebView = findViewById<View>(R.id.testWebView) as WebView
        // プログレスバー
        testProgress = findViewById<View>(R.id.test_progress) as ProgressBar
        // webViewのローディングイベント設定
        settingWebViewClient()

        // Java Scriptを有効にする
        testWebView.getSettings().setJavaScriptEnabled(true);
        // WebView内に表示するURL 検索キーワード「熱気球」
        testWebView.loadUrl("https://pixabay.com/ja/photos/search/%E7%86%B1%E6%B0%97%E7%90%83/")

        // webViewにフォーカスセットする
        testWebView.requestFocus();
    }

    /**
     * settingWebViewClient
     * webViewのローディングイベント設定
     */
    fun settingWebViewClient() {

        testWebView.webViewClient = object: WebViewClient() {
            /**
             * onPageStarted
             * ローディング開始時に呼ばれる
             */
            override fun onPageStarted(view: WebView?, url: String?, favicon: Bitmap?) {
                super.onPageStarted(view, url, favicon)
                // プログレスバー表示
                testProgress.setVisibility(View.VISIBLE);
                // webView非表示
                testWebView.setVisibility(View.GONE);
            }

            /**
             * onPageFinished
             * ローディング終了時に呼ばれる
             * @param view
             * @param url
             */
            override fun onPageFinished(view: WebView?, url: String?) {
                super.onPageFinished(view, url)
                // プログレスバー非表示
                testProgress.setVisibility(View.GONE);
                // webView表示
                testWebView.setVisibility(View.VISIBLE);
            }

            /**
             * shouldOverrideUrlLoading
             * WebViewにロードされようとしているときに呼ばれる
             * @param view
             * @param request
             * @return trueは外部ブラウザ起動 or falseはWebView内に表示する
             */
            override fun shouldOverrideUrlLoading(view: WebView?,request: WebResourceRequest): Boolean {
                // falseを返すとWebView内に表示する
                if (request.url != null) {
                    // スクロールを一番上に設定する
                    testScroll.fullScroll(ScrollView.FOCUS_UP);
                }
                return false

            }
        }
    }

    /**
     * onClick
     * @param view
     */
    override fun onClick(view: View) {
        when (view.getId()) {
            R.id.next_button -> {
                val intent = Intent(this, Page2Activity::class.java)
                startActivity(intent)
            }
            else -> {
                println("else")
            }
        }
    }
}


좋은 웹페이지 즐겨찾기