android webview中的进度条

Question

我正在尝试使用 WebViewClient 在 android webview 中添加进度条。它显示进度条，文本（加载）和页面的其余部分只是一个空白页面。

我想在加载下一页时保留当前页面，并在当前页面顶部显示进度条，这样用户就不必看到空白的加载页面..

有人可以帮我解决这个问题吗？如何在顶部显示进度条的同时保持当前页面摄入量，直到下一页加载 100%。

Answer 1

这可能会有所帮助，来源：ProgressBar with WebView

您可以通过webview 类中的getProgress 方法跟踪进度状态。

初始化进度状态

private int mProgressStatus = 0;

然后是这样加载的 AsyncTask：

private class Task_News_ArticleView extends AsyncTask<Void, Void, Void> {
    private final ProgressDialog dialog = new ProgressDialog(
            your_class.this);

    // can use UI thread here
    protected void onPreExecute() {
        this.dialog.setMessage("Loading...");
        this.dialog.setCancelable(false);
        this.dialog.show();
    }

    @Override
    protected Void doInBackground(Void... params) {
        try {
            while (mProgressStatus < 100) {
                mProgressStatus = webview.getProgress();

            }
        } catch (Exception e) {

        }
        return null;

    }

    protected void onPostExecute(Void result) {
        if (this.dialog.isShowing()) {
            this.dialog.dismiss();
        }
    }
}

Answer 2

public class About extends AppCompatActivity {

    WebView myWebView;
    ProgressBar progressBar;
    FrameLayout frameLayout;

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

        Toolbar toolbar = findViewById(R.id.toolbar);
        toolbar.setTitle("About CreativeGraphy");
        setSupportActionBar(toolbar);
        if (getSupportActionBar() != null) {
            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            getSupportActionBar().setDisplayShowHomeEnabled(true);
        }

        progressBar = findViewById(R.id.progress_bar);
        frameLayout = findViewById(R.id.frame_loading);
        progressBar.setMax(100);

        myWebView = findViewById(R.id.webview);
        myWebView.loadUrl("http://www.google.co.in/");
        myWebView.setWebViewClient(new HelpClient());

        myWebView.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                frameLayout.setVisibility(View.VISIBLE);
                progressBar.setProgress(newProgress);
                setTitle("Loading....");
                if (newProgress == 100) {
                    frameLayout.setVisibility(View.GONE);
                    //setTitle(View.getTitle());
                }
                super.onProgressChanged(view, newProgress);
            }
        });
        myWebView.getSettings().setJavaScriptEnabled(true);
        myWebView.setVerticalScrollBarEnabled(false);
        progressBar.setProgress(0);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId() == android.R.id.home) {
            finish();
        }//close activity when click back button
        return super.onOptionsItemSelected(item);
    }

    public void onBackPressed() {
        if (myWebView.canGoBack()) {
            myWebView.goBack();
        } else {
            super.onBackPressed();
        }
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK)) {
            if (myWebView.canGoBack()) {
                myWebView.goBack();
                return true;
            }
        }
        return super.onKeyDown(keyCode, event);
    }

    private class HelpClient extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            frameLayout.setVisibility(View.VISIBLE);
            return true;
        }
    }
}

试试这个 它已加载

布局

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    tools:context=".About">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/AppTheme.PopupOverlay"
            app:theme="@style/ToolbarColoredBackArrow" />
    </android.support.design.widget.AppBarLayout>

    <FrameLayout
        android:id="@+id/frame_loading"
        android:layout_width="match_parent"
        android:layout_height="3dp"
        android:layout_below="@id/app_bar"
        android:background="@android:color/transparent">

        <ProgressBar
            android:id="@+id/progress_bar"
            style="?android:attr/progressBarStyleHorizontal"
            android:layout_width="match_parent"
            android:layout_height="8dp"
            android:layout_gravity="top"
            android:layout_marginTop="-3dp"
            android:background="@android:color/transparent"
            android:progress="20"
            android:progressDrawable="@drawable/progress_cyclic" />
    </FrameLayout>

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/frame_loading" />

</RelativeLayout>

如果 100% 加载可见，则尝试使用 2 个 webview