畢業設計之android混合模式開發第一天--具有下拉重新整理和頁面載入等待的WebView搭建
阿新 • • 發佈:2019-01-30
第一次真正接觸android的混合模式開發,之前瞭解過如何進行混合模式的開發,常見的是通過WebView元件載入url,使用HTML5和CSS3構建手機端響應式佈局。
今天主要是搭建出一個可載入url,具有下拉重新整理和頁面等待的WebView。
2.頁面等待的實現主要是通過自定義一個LinearLayout,裡面新增載入圖片(旋轉動畫),附加一些載入說明文字。
自定義LinearLayout程式碼如下:
佈局檔案如下:public class LoadLayout extends LinearLayout { private ImageView loadImage = null; private TextView tipTextView = null; public LoadLayout(Context context) { super(context); } public LoadLayout(Context context, AttributeSet attrs) { super(context, attrs); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { if(loadImage == null && tipTextView == null) { LinearLayout.LayoutParams params = new LinearLayout.LayoutParams( LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT); LinearLayout.LayoutParams childparams = new LinearLayout.LayoutParams( LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); this.setBackgroundColor(Color.TRANSPARENT); this.setOrientation(LinearLayout.VERTICAL); this.setLayoutParams(params); this.setGravity(Gravity.CENTER);// 位置居中 loadImage = new ImageView(getContext()); loadImage.setImageResource(com.handmark.pulltorefresh.library.R.drawable.default_ptr_rotate); // 載入動畫 Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation( getContext(), R.anim.loading_animation); // 使用ImageView顯示動畫 loadImage.startAnimation(hyperspaceJumpAnimation); tipTextView = new TextView(getContext()); tipTextView.setText("頁面載入中...");// 設定載入資訊 this.addView(loadImage,childparams); this.addView(tipTextView,childparams); } super.onMeasure(widthMeasureSpec, heightMeasureSpec); } }
<?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" android:background="#ffffff" > <com.handmark.pulltorefresh.library.PullToRefreshWebView xmlns:ptr="http://schemas.android.com/apk/res-auto" android:id="@+id/home_webview" android:layout_height="fill_parent" android:layout_width="fill_parent" ptr:ptrMode="both" /> <com.redwine.view.LoadLayout android:id="@+id/load_layout" android:layout_height="fill_parent" android:layout_width="fill_parent" android:orientation="vertical" android:visibility="invisible" android:background="#ffffff" /> </LinearLayout>
Activity程式碼如下:
import com.handmark.pulltorefresh.library.PullToRefreshBase; import com.handmark.pulltorefresh.library.PullToRefreshBase.OnRefreshListener; import com.handmark.pulltorefresh.library.PullToRefreshWebView; import com.redwine.R; import com.redwine.view.LoadLayout; import android.annotation.SuppressLint; import android.graphics.Bitmap; import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.webkit.WebView; import android.webkit.WebViewClient; @SuppressLint("SetJavaScriptEnabled") public class HomeFragment extends Fragment { private PullToRefreshWebView mPullRefreshWebView; private WebView mWebView; private LoadLayout loadLayout; private boolean reload = false; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { reload = false; View view = inflater.inflate(R.layout.home_fragment, container, false); mPullRefreshWebView = (PullToRefreshWebView) view.findViewById(R.id.home_webview); mPullRefreshWebView.setOnRefreshListener(new OnRefreshListener<WebView>() { @Override public void onRefresh(PullToRefreshBase<WebView> refreshView) { refreshView.getRefreshableView().reload(); reload = true; } }); loadLayout = (LoadLayout) view.findViewById(R.id.load_layout); mWebView = mPullRefreshWebView.getRefreshableView(); mWebView.getSettings().setJavaScriptEnabled(true); mWebView.setWebViewClient(new SampleWebViewClient()); mWebView.loadUrl("http://www.gxnu.edu.cn"); return view; } class SampleWebViewClient extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { if(!reload) { mPullRefreshWebView.setVisibility(View.GONE); loadLayout.setVisibility(View.VISIBLE); } super.onPageStarted(view, url, favicon); } @Override public void onPageFinished(WebView view, String url) { if(!reload) { loadLayout.setVisibility(View.GONE); mPullRefreshWebView.setVisibility(View.VISIBLE); } super.onPageFinished(view, url); } } }
效果基本上可以實現,但有一些問題有待解決:
1.如何傳入自定義的訊息到頁面等待中
2.點選原生按鈕時出現等待頁面,會有閃爍出現
上述兩個問題,如果大家有解決方案,希望告知本人。