Android控件之WebView
如何在Android应用中打开Web网站呢?谷歌为我们提供了解决方案,现在就让我们一起看一下WebView控件吧。
为了方便总结,就以实现下面这个效果为主线,进行总结:
首先我们先看一下它的布局文件吧,整个界面分为上下两个部分,上部是一个类似于标题栏的效果,它是由两个Button按钮和一个TextView组成的,下部是一个WebView控件,通过AndroidManifest.xml去除系统的标题(如有不懂,请查阅我的上一遍博客:Android常用属性),已达到上图效果。为方便大家自学,下面奉上代码:
<LinearLayout 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" android:orientation="vertical" tools:context=".MainActivity"> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:weightSum="1"> <Button android:id="@+id/quit" android:layout_gravity="left" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="返回"/> <TextView android:id="@+id/web" android:layout_gravity="center" android:gravity="center" android:layout_width="222dp" android:layout_height="wrap_content" android:layout_weight="1.13" /> <Button android:id="@+id/news" android:layout_gravity="right" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="刷新"/> </LinearLayout>
<ProgressBar
android:id="@+id/progressBar"
android:layout_below="@id/shaoyishao_value"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="fill_parent"
android:layout_height="4dip"
android:indeterminateOnly="false"
android:max="100"
android:progressDrawable="@drawable/progress_bar_states" />
<WebView android:id="@+id/webView" android:layout_width="fill_parent" android:layout_height="fill_parent"/> </LinearLayout>
进度条的配置文件:progress_bar_states.xml:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@android:id/background"> <shape> <gradient android:startColor="#ff0000" android:centerColor="#ffa600" android:endColor="#ff5500" /> </shape> </item> <item android:id="@android:id/secondaryProgress"> <clip> <shape> <gradient android:startColor="#234" android:centerColor="#234" android:endColor="#a24" /> </shape> </clip> </item> <item android:id="@android:id/progress"> <clip> <shape> <gradient android:startColor="#33000001" android:centerColor="#40000000" android:endColor="#44000000" /> </shape> </clip> </item> </layer-list>
最后我们开始编写我们MainActivity.java:
public class MainActivity extends Activity { private TextView mTextView; private WebView mWebView; private Button mbreak; private Button mnews;
private ProgressBar pb; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); } public void init(){ mTextView = (TextView)findViewById(R.id.web); mWebView = (WebView)findViewById(R.id.webView); mbreak = (Button)findViewById(R.id.quit); mnews = (Button)findViewById(R.id.news);
pb = (ProgressBar) findViewById(R.id.progressBar); mbreak.setOnClickListener(new myListener()); mnews.setOnClickListener(new myListener());
mWebView.getSettings().setJavaScriptEnabled(true);//添加显示javascript声明
mWebView.loadUrl("http://www.baidu.com/");//设置打开的网址 mWebView.setWebChromeClient(new WebChromeClient(){ @Override public void onReceivedTitle(WebView view, String title) { super.onReceivedTitle(view, title);
pb.setVisibility(View.VISIBLE);
pb.setProgress(0);
mTextView.setText(title);//显示打开的网址信息 }
@Override
//显示进度条
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
pb.setProgress(newProgress);
if(newProgress==100){
pb.setVisibility(View.GONE);
}
}
}); mWebView.setWebViewClient(new WebViewClient(){ @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return super.shouldOverrideUrlLoading(view, url); } });
}
//不做任何处理,浏览网页,点击系统“Back”键,整个Browser会调用finish()而结束自身,如果希望浏览的网 页回退而不是推出浏览器,需要在当前Activity中处理并消费掉该Back事件。
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && webValue.canGoBack()) {
webValue.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
//按钮点击事件监听 class myListener implements View.OnClickListener{ @Override public void onClick(View view) { switch (view.getId()){ case R.id.quit : finish(); break; case R.id.news : mWebView.reload(); break; } } }
}
最后不要忘在AndroidManifest.xml中添加使用网络声明:<uses-permission android:name="android.permission.INTERNET"/>
大功告成,我们的WebView初步介绍到此结束。