如何在 WebView 中的每个页面加载时添加旋转加载动画。

huangapple 未分类评论57阅读模式
英文:

How to add spinner loading for every pags loading in webview

问题

以下是您提供的代码的翻译:

package com.mystore.mominbaba;

import android.app.Activity;
import android.content.ActivityNotFoundException;
import android.content.Intent;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.ValueCallback;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ImageView;

public class MainActivity extends Activity {

    private WebView mWebView;
    private ImageView mSplashView;

    private ValueCallback<Uri> mUploadMessage;
    public ValueCallback<Uri[]> uploadMessage;
    public static final int REQUEST_SELECT_FILE = 100;
    private final static int FILECHOOSER_RESULTCODE = 1;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mWebView = (WebView) findViewById(R.id.webview);
        mSplashView = (ImageView) findViewById(R.id.splash);
        mWebView.getSettings().setJavaScriptEnabled(true);
        mWebView.getSettings().setLoadWithOverviewMode(true);
        mWebView.getSettings().setUseWideViewPort(true);
        mWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
        mWebView.getSettings().setAllowFileAccess(true);
        mWebView.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                mSplashView.setVisibility(View.GONE);
                mWebView.setVisibility(View.VISIBLE);
            }
        });

        mWebView.loadUrl("https://www.mominbaba.com");
        mWebView.setVisibility(View.GONE);
        mSplashView.setVisibility(View.VISIBLE);

        mWebView.setWebChromeClient(new WebChromeClient() {
            protected void openFileChooser(ValueCallback uploadMsg, String acceptType) {
                mUploadMessage = uploadMsg;
                Intent i = new Intent(Intent.ACTION_GET_CONTENT);
                i.addCategory(Intent.CATEGORY_OPENABLE);
                i.setType("image/*");
                startActivityForResult(Intent.createChooser(i, "File Browser"), FILECHOOSER_RESULTCODE);
            }

            public boolean onShowFileChooser(WebView mWebView, ValueCallback<Uri[]> filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) {
                if (uploadMessage != null) {
                    uploadMessage.onReceiveValue(null);
                    uploadMessage = null;
                }

                uploadMessage = filePathCallback;

                Intent intent = null;
                if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {
                    intent = fileChooserParams.createIntent();
                }
                try {
                    startActivityForResult(intent, REQUEST_SELECT_FILE);
                } catch (ActivityNotFoundException e) {
                    uploadMessage = null;
                    return false;
                }
                return true;
            }

            protected void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) {
                mUploadMessage = uploadMsg;
                Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
                intent.addCategory(Intent.CATEGORY_OPENABLE);
                intent.setType("image/*");
                startActivityForResult(Intent.createChooser(intent, "File Browser"), FILECHOOSER_RESULTCODE);
            }

            protected void openFileChooser(ValueCallback<Uri> uploadMsg) {
                mUploadMessage = uploadMsg;
                Intent i = new Intent(Intent.ACTION_GET_CONTENT);
                i.addCategory(Intent.CATEGORY_OPENABLE);
                i.setType("image/*");
                startActivityForResult(Intent.createChooser(i, "File Chooser"), FILECHOOSER_RESULTCODE);
            }
        });
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent intent) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            if (requestCode == REQUEST_SELECT_FILE) {
                if (uploadMessage == null)
                    return;
                uploadMessage.onReceiveValue(WebChromeClient.FileChooserParams.parseResult(resultCode, intent));
                uploadMessage = null;
            }
        } else if (requestCode == FILECHOOSER_RESULTCODE) {
            if (null == mUploadMessage)
                return;
            Uri result = intent == null || resultCode != MainActivity.RESULT_OK ? null : intent.getData();
            mUploadMessage.onReceiveValue(result);
            mUploadMessage = null;
        }
    }

    private class xWebViewClient extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()) {
            mWebView.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/splash"
        android:scaleType="fitXY"
        android:layout_height="fill_parent"
        android:layout_width="fill_parent"
        android:visibility="gone"
        android:src="@drawable/image_1"/>

    <WebView
        android:id="@+id/webview"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="visible"/>

</RelativeLayout>

注意:由于您要求只返回翻译的内容,代码中的注释部分已经被省略。如果您需要原始的英文注释,可以在原始代码中查看。

英文:

I am a beginner and building webview app with splash screen in AIED.

I want to add spinner loading for every page loading in webview. I mean when this webview loads after the splash screen, I can see home page of website when I open any other page. While loading that page I want to show spinner in the center of screen. When the page load the spinner should disappear.

I not know where to add the specific code.

Here is mainactivity.java

package com.mystore.mominbaba;

import android.app.Activity;
import android.content.ActivityNotFoundException;
import android.content.Intent;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.ValueCallback;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ImageView;

public class MainActivity extends Activity {

    //private WebView webView = null;
    private WebView mWebView;
    private ImageView mSplashView;

    private ValueCallback &lt;Uri&gt; mUploadMessage;
    public ValueCallback &lt;Uri[]&gt; uploadMessage;
    public static final int REQUEST_SELECT_FILE = 100;
    private final static int FILECHOOSER_RESULTCODE = 1;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mWebView = (WebView) findViewById(R.id.webview);
        mSplashView = (ImageView) findViewById(R.id.splash);
        mWebView.getSettings().setJavaScriptEnabled(true); // enable javascript
        mWebView.getSettings().setLoadWithOverviewMode(true); //sets Overview to true
        mWebView.getSettings().setUseWideViewPort(true); //sets wideviewport deleting whitespsce
        mWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
        mWebView.getSettings().setAllowFileAccess(true);
        mWebView.setWebViewClient(new WebViewClient() {


            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                mSplashView.setVisibility(View.GONE);
                mWebView.setVisibility(View.VISIBLE);

            }
        });

        mWebView.loadUrl(&quot;https://www.mominbaba.com&quot;);
        mWebView.setVisibility(View.GONE);
        mSplashView.setVisibility(View.VISIBLE);


        mWebView.setWebChromeClient(new WebChromeClient() {
            // For 3.0+ Devices (Start)
            // onActivityResult attached before constructor
            protected void openFileChooser(ValueCallback uploadMsg, String acceptType) {
                mUploadMessage = uploadMsg;
                Intent i = new Intent(Intent.ACTION_GET_CONTENT);
                i.addCategory(Intent.CATEGORY_OPENABLE);
                i.setType(&quot;image/*&quot;);
                startActivityForResult(Intent.createChooser(i, &quot;File Browser&quot;), FILECHOOSER_RESULTCODE);
            }


            // For Lollipop 5.0+ Devices
            public boolean onShowFileChooser(WebView mWebView, ValueCallback &lt;Uri[]&gt; filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) {
                if (uploadMessage != null) {
                    uploadMessage.onReceiveValue(null);
                    uploadMessage = null;
                }

                uploadMessage = filePathCallback;

                Intent intent = null;
                if (android.os.Build.VERSION.SDK_INT &gt;= android.os.Build.VERSION_CODES.LOLLIPOP) {
                    intent = fileChooserParams.createIntent();
                }
                try {
                    startActivityForResult(intent, REQUEST_SELECT_FILE);
                } catch (ActivityNotFoundException e) {
                    uploadMessage = null;
                    return false;
                }
                return true;
            }

            //For Android 4.1 only
            protected void openFileChooser(ValueCallback &lt;Uri&gt; uploadMsg, String acceptType, String capture) {
                mUploadMessage = uploadMsg;
                Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
                intent.addCategory(Intent.CATEGORY_OPENABLE);
                intent.setType(&quot;image/*&quot;);
                startActivityForResult(Intent.createChooser(intent, &quot;File Browser&quot;), FILECHOOSER_RESULTCODE);
            }

            protected void openFileChooser(ValueCallback &lt;Uri&gt; uploadMsg) {
                mUploadMessage = uploadMsg;
                Intent i = new Intent(Intent.ACTION_GET_CONTENT);
                i.addCategory(Intent.CATEGORY_OPENABLE);
                i.setType(&quot;image/*&quot;);
                startActivityForResult(Intent.createChooser(i, &quot;File Chooser&quot;), FILECHOOSER_RESULTCODE);
            }
        });
    }

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent intent) {
        if (Build.VERSION.SDK_INT &gt;= Build.VERSION_CODES.LOLLIPOP) {
            if (requestCode == REQUEST_SELECT_FILE) {
                if (uploadMessage == null)
                    return;
                uploadMessage.onReceiveValue(WebChromeClient.FileChooserParams.parseResult(resultCode, intent));
                uploadMessage = null;
            }
        } else if (requestCode == FILECHOOSER_RESULTCODE) {
            if (null == mUploadMessage)
                return;
            // Use MainActivity.RESULT_OK if you&#39;re implementing WebView inside Fragment
            // Use RESULT_OK only if you&#39;re implementing WebView inside an Activity
            Uri result = intent == null || resultCode != MainActivity.RESULT_OK ? null : intent.getData();
            mUploadMessage.onReceiveValue(result);
            mUploadMessage = null;
        }
    }


    private class xWebViewClient extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    }


    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {

        if (keyCode == KeyEvent.KEYCODE_BACK &amp;&amp; mWebView.canGoBack()) {
            mWebView.goBack();
            return true;
        }

        return super.
        `onKeyDown` (keyCode, event);
    }
}

Here is activity main.xml

&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;RelativeLayout
	xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
	xmlns:tools=&quot;http://schemas.android.com/tools&quot;
	android:layout_width=&quot;match_parent&quot;
	android:layout_height=&quot;match_parent&quot;
	tools:context=&quot;.MainActivity&quot;&gt;

	&lt;ImageView
		android:id=&quot;@+id/splash&quot;
		android:scaleType=&quot;fitXY&quot;
		android:layout_height=&quot;fill_parent&quot;
		android:layout_width=&quot;fill_parent&quot;
		android:visibility=&quot;gone&quot;
		android:src=&quot;@drawable/image_1&quot;/&gt;

	&lt;WebView
		android:id=&quot;@+id/webview&quot;
		android:layout_alignParentTop=&quot;true&quot;
		android:layout_alignParentLeft=&quot;true&quot;
		android:layout_width=&quot;match_parent&quot;
		android:layout_height=&quot;match_parent&quot;
		android:visibility=&quot;visible&quot;/&gt;

&lt;/RelativeLayout&gt;

答案1

得分: 0

Big Caveat: 这个解决方案无法完全隐藏那些需要下载和加载 .js 文件(尤其是大文件)的网站上的白屏(加载界面)。

首先,你正在错误地使用 onPageFinishedonPageFinished 总会在每次页面加载完成后被调用。这意味着如果你在你的网站上导航,它将在你导航到一个 URL 并且 WebView 完成加载之后每次都会调用 onPageFinished

下面是一个实现思路:

首先创建一个 HTML 页面并设计出你想要的加载动画的样式。将 HTML 模板保存为字符串 HTMLSpinner

然后创建第二个 WebView 并将 HTML 模板字符串加载到其中:

public WebView spinner;
spinner.loadData(HTMLSpinner, "text/html", "UTF-8");

然后修改你的主要 mWebView.setWebViewClient 如下:

        mWebView.setWebViewClient(new WebViewClient(){
            @Override
            public void onPageStarted(WebView view, final String url, Bitmap favicon) {
                mWebView.setVisibility(View.GONE);
                spinner.setVisibility(View.VISIBLE);

                // YOUR LANDING PAGE
                if(url.equals("https://www.mominbaba.com")){
                    mWebView.setVisibility(View.GONE);
                    mSplashView.setVisibility(View.VISIBLE);
                }

            }

            @Override
            public void onPageFinished(WebView view, String url) {

                mWebView.setVisibility(View.VISIBLE);
                spinner.setVisibility(View.GONE);

                // YOUR LANDING PAGE
                if(url.equals("https://www.mominbaba.com")){
                    mWebView.setVisibility(View.GONE);
                    mSplashView.setVisibility(View.VISIBLE);
                } 

            }

        });

这将在加载器和主要 WebView 之间进行切换。我选择使用第二个 WebView,因为提供的资源是一个动画 SVG。

英文:

Big Caveat: This solution won't completely hide the white screen(loading) on websites that has to download and load .js files especially if they are big.

First, you are using onPageFinished incorrectly. onPageFinished is always going to be called after every page load has finished. This means if you are navigating on your website, it will call onPageFinished every after you navigate a URL and the webview has finished loading it.

Here's an idea on how to do this:

First create an HTML page and design on how you want your spinner would look like. Save the HTML template as a string HTMLSpinner.

Then create a second webview and load the HTML template string to it

public WebView spinner;
spinner.loadData(HTMLSpinner, &quot;text/html&quot;, &quot;UTF-8&quot;);

Then modify your main mWebView.setWebViewClient like this

        mWebView.setWebViewClient(new WebViewClient(){
            @Override
            public void onPageStarted(WebView view, final String url, Bitmap favicon) {
                mWebView.setVisibility(View.GONE);
                spinner.setVisibility(View.VISIBLE);

                // YOUR LANDING PAGE
                if(url.equals(&quot;https://www.mominbaba.com&quot;)){
                    mWebView.setVisibility(View.GONE);
                    mSplashView.setVisibility(View.VISIBLE);

                }

            }

            @Override
            public void onPageFinished(WebView view, String url) {

                mWebView.setVisibility(View.VISIBLE);
                spinner.setVisibility(View.GONE);

                // YOUR LANDING PAGE
                if(url.equals(&quot;https://www.mominbaba.com&quot;)){

                    mWebView.setVisibility(View.GONE);
                    mSplashView.setVisibility(View.VISIBLE);


                } 

            }

        });

That should swap the current webview that you see from the main webview to the loader. I have chosen to use a second webview because the asset that was given to was an animated SVG.

huangapple
  • 本文由 发表于 2020年7月27日 18:07:10
  • 转载请务必保留本文链接:https://java.coder-hub.com/63113064.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定