Android 开发之快速实现一个简单Web浏览器

2025-04-08 06:54:25

当我们使用Android手机自带或第三方浏览器浏览网页时,总会看到下图页面的样子,上面是一个地址栏,地址栏下面显示加载进度,加载完成后进入页面内容,带颜色的进度条总是少不了的,那样子看起来也舒服,如何实现自定义手机浏览器功能呢?

Android 开发之快速实现一个简单Web浏览器

工具/原料

Android开发工具:Android Studio或Eclipse

虚拟机或测试手机

一、设计简单浏览器的布局

1、仔细观察百度浏览的效果,地址栏上输入网址,点击“前往”按钮开始加载网址,最后在WebView显示加载的网页内容,使用一个线性布局,布局代码如下:<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="fill_parent"android:orientation="vertical" ><include android:id="@+id/head_views_main" layout="@layout/head_re" /><com.sinolvc.zspg.view.ProgressWebView android:id="@+id/baseweb_webview" android:layout_width="fill_parent" android:layout_height="fill_parent" android:fadeScrollbars="true" android:scrollbarStyle="insideOverlay" /></LinearLayout>

Android 开发之快速实现一个简单Web浏览器

2、自定义WebView,命名ProgressWebView,该ProgressWebView的一个特点,加载网敌颉缪莽页地址的时候,动态显示加载进度,和普通浏览器差不多,代码如下:public ProgressWebView(Context context, AttributeSet attrs) { super(context, attrs); progressbar = new ProgressBar(context, null,android.R.attr.progressBarStyleHorizontal); progressbar.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,10, 0, 0)); Drawable drawable = context.getResources().getDrawable(R.drawable.progress_bar_states); progressbar.setProgressDrawable(drawable); addView(progressbar); setWebViewClient(new WebViewClient(){}); setWebChromeClient(new WebChromeClient()); //是否支持缩放 getSettings().setSupportZoom(true); getSettings().setBuiltInZoomControls(true);}

Android 开发之快速实现一个简单Web浏览器

3、在这个构造方法里面,自定义进度条属性,设置为水平进度条,进度条的高度,同时定义进度刳噪受刃条状态颜色,写在progress_bar_stat髫潋啜缅es.xml文件中,代码如下:<layer-list xmlns:android="http://schemas.android.com/apk/res/android" ><item android:id="@android:id/background"> <shape> <corners android:radius="2dp" /> <gradient android:angle="270" android:centerColor="#E3E3E3" android:endColor="#E6E6E6" android:startColor="#C8C8C8" /> </shape></item><item android:id="@android:id/progress"> <clip> <shape> <corners android:radius="2dp" /> <gradient android:centerColor="#4AEA2F" android:endColor="#31CE15" android:startColor="#5FEC46" /> </shape> </clip></item></layer-list>

Android 开发之快速实现一个简单Web浏览器

4、在这个xml文件中,可以按照自己喜好设置加载颜色,然后把进度条视图添加到WebView视图中,在使用ProgressWebView加载HTML网页,可以像360浏览器一样显示加载进度。setWebChromeClient(new WebChromeClient())用于加载请求的网页,支持进度条、js等效果,这里定义一个内部类WebChromeClient,代码如下:public class WebChromeClient extends android.webkit.WebChromeClient {@Overridepublic void onProgressChanged(WebView view, int newProgress) { super.onProgressChanged(view, newProgress); if (newProgress == 100) { progressbar.setVisibility(GONE); } else { if (progressbar.getVisibility() == GONE) progressbar.setVisibility(VISIBLE); progressbar.setProgress(newProgress); } }}

Android 开发之快速实现一个简单Web浏览器

二、创建ProgressWebActivity类文件

1、创建ProgressWebActivity.java类文件,获取布局文件的EditText、Button、WebView控件Id,控件初始化@Overrideprotected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_baseweb); initView(); initData();}private void initView(){ initTitleView(getWindow().getDecorView(),R.string.load_news_detail_info,ProgressWebActivity .this); mWebView = (ProgressWebView) findViewById(R.id.baseweb_webview); mWebView.getSettings().setJavaScriptEnabled(true);}

Android 开发之快速实现一个简单Web浏览器

2、获取EditText控件输入的网页地址,并判断是否输入正确是http或https开头;给Button设置监听器,onClick()方法中调用WebView的loadUrl方法加载网页protected void initData() { Intent intent = getIntent(); Bundle bundle = intent.getExtras(); String url = bundle.getString("url"); if(!TextUtils.isEmpty(url)&&!TextUtils.isEmpty(title)){ mWebView.loadUrl(url); }}@Overrideprotected void onDestroy() { super.onDestroy(); mWebView = null; }}

Android 开发之快速实现一个简单Web浏览器

3、打开虚拟机或测试手机,运行Android简单Web浏览器项目,initData方法获取上一个Activity传递过来的Intent数据,取出网页URL,判断连接是否为空,如果不为空,则使用自定义的ProgressWebView的loadUrl()方法加载,这个时候我们将会在APP端看到如下效果:

Android 开发之快速实现一个简单Web浏览器
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢