`
xwangly
  • 浏览: 131906 次
  • 性别: Icon_minigender_1
  • 来自: 鄂州
社区版块
存档分类
最新评论

使用WebView加载HTML资源

 
阅读更多

最近的项目需要做一个如同微信中的腾讯新闻的功能,如下图所示:

 

直接上关键代码:

布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/contact_bg_gray"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="10dip"
        android:background="@drawable/big_corner_time"
        android:gravity="center"
        android:paddingBottom="2dip"
        android:paddingLeft="10dip"
        android:paddingRight="10dip"
        android:paddingTop="2dip"
        android:text="9:32"
        android:textColor="@android:color/white"
        android:textSize="18sp" />

    <WebView
        android:id="@+id/webView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/time"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="8dip"
        android:background="@color/contact_bg_gray"
        android:layerType="software" />

</RelativeLayout>

 颜色请自行替换。

 

        mWebView = (WebView) findViewById(R.id.webView1);
//        holder.mWebView.loadUrl("http://www.baidu.com/");
        WebSettings settings = mWebView.getSettings();
//
        settings.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS);
        settings.setAppCacheEnabled(true);
        int width = FAMobileApp.getDeviceWidth() - (int) (16 * FAMobileApp.getDensity());
        int scaleInPercent = width * 100 / 322;
        System.out.println("scaleInPercent:"+scaleInPercent);
        mWebView.setInitialScale(scaleInPercent);

    mWebView.setBackgroundColor(mContext.getResources().getColor(
                R.color.contact_bg_gray));
        mWebView.setWebViewClient(new WebViewClient() {

            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                System.out.println("shouldOverrideUrlLoading:"+url);
                //此处可作转向操作
                view.loadUrl(url);
                return true;
            }
            @Override
            public void onLoadResource(WebView view, String url) {
                System.out.println("onLoadResource:"+url);
            }
            @Override
            public WebResourceResponse shouldInterceptRequest(WebView view,
                    String url) {
                System.out.println("shouldInterceptRequest:"+url);
                //TODO Here we can replace the url
                if (url.endsWith("cj_all_picture.png")) {
//                    try {
//                        InputStream is = mContext.getResources().getAssets().open("cj_all_tab_bg.png");
//                        WebResourceResponse response = new WebResourceResponse("image/gif", "utf-8", is);
//                        return response;
//                    } catch (IOException e) {
//                        // TODO Auto-generated catch block
//                        e.printStackTrace();
//                    }
                }
                return null;
            }
        });
        load(holder.mWebView);

    private void load(WebView mWebView) {


        try {
            String basePath = "/data/data/com.xxx.xx/test";
            StringBuilder content = new StringBuilder();
            String path = basePath + "cjsd.html";
            fis = new FileInputStream(path);
            byte[] buffer = new byte[1024];
            int len = 0;
            while ((len = fis.read(buffer)) != -1) {
                content.append(new String(buffer, 0, len, "gbk"));
            }
            // System.out.println(content);
            mWebView.getSettings().setDefaultTextEncodingName("utf-8");
            String baseUrl = "file://" + basePath;
            mWebView.loadDataWithBaseURL(baseUrl, content.toString(), "text/html", "utf-8",
                    null);
        } catch (FileNotFoundException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }


    }

 

使用的cjsc.html如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>
<style>
<!--
body{text-align:center;
      margin:0 0;
	  padding:0px;
	  }
	  
	
			   
		.contentbg{margin:0 auto;
		           
				   width:322px;
				   height:382px;
				   }
			.content{
			         margin:0px auto;
					 width:291px;
					 height:369px;
					 background:#FFFFFF;
					border-radius:10px;
					border:#c6c6c6 solid 2px;
				   -moz-box-shadow:0px 2px 3px #999;             	
                   -webkit-box-shadow:0px 2px 3px #999;  	
                   box-shadow:0px 2px 4px #999; 
					 
					
					 }
				  .content_abg{
				            margin:0;
						     width:293px;
							 height:175px;
							 padding-top:11px
							 } 
						
			          .content_a{background:url(cj_all_picture.png) no-repeat;
					              width:267px;
								  height:151px;
								  
								  margin-left:13px;
								  margin-bottom:14px;

								  }

                   .content_bbg{
				            margin:0;
						     width:293px;
							 height:196px;
							 
							clear:both;
							 }
					 .content_b_line{width:291px;
					           height:1px;
							   background:#e6e6e6;
								
								
								
								}
						
                     .content_b{width:288px;
					            height:63px;
                                margin:0;
                                overflow:hidden;
								
								
								}
						 
						     .content_b1{width:200px;
					            height:63px;
								margin:0;
								float:left;
								padding-left:13px;
								padding-top:9px;
								color:#000000;
								font-size:14px;
								text-align:left;
								font-family:"微软雅黑";
								line-height:12px;
								
								
							           }		

                                 .content_b1 a:link{
								color:#000000;
								text-decoration:none;				
								}
								        .content_b1 a:visited{
								color:#000000;
								text-decoration:none;
								}		

                                 .content_b1 a:hover{
							
								color: #000000;				
								text-decoration: none;

								}
                                .content_b1_a{
								color:#4e4e4e;
								font-size:13px;
								text-align:left;
								font-family:"微软雅黑";
							
							}		
                                  
                                 .content_b1_a a:link{
								color:#4e4e4e;
								text-decoration:none;				
								}
								        .content_b1_a a:visited{
								color:#4e4e4e;
								text-decoration:none;
								}		

                                 .content_b1_a a:hover{
							
								color: #4e4e4e;				
								text-decoration: none;

								}
                                  .content_b2{float:right;
								             height:60px;
											 width:73px;
											 margin:0px;
											
											 
											 }
											 
                                     .content_b2_a{
								             height:51px;
											 width:51px;
											 margin:6px;
											 background: url(cj_all_icon_xgsg.png);
											 float:left;
											 }
                                       .content_b2_b{
								             height:51px;
											 width:51px;
											 margin:6px;
											 background: url(cj_all_icon_cjkx.png);
											 float:left;
											 }
                                       .content_b2_c{
								             height:51px;
											 width:51px;
											 margin:6px;
											 background: url(cj_all_icon_cjsd.png);
											 float:left;
											 }
											 
                                .content_ba{width:288px;
					            height:63px;
                                margin:0;
								background:#3b94d6;
								
								}
								     .content_b3{width:215px;
					            height:63px;
								margin:0;
								float:left;
								padding-left:13px;
								padding-top:12px;
								color:#000000;
								font-size:19px;
								text-align:left;
								font-family:"微软雅黑";
								line-height:12px;
								
								
							}	
                                 .content_b3 a:link{
								color:#000000;
								text-decoration:none;				
								}
								        .content_b3 a:visited{
								color:#000000;
								text-decoration:none;
								}		

                                 .content_b3 a:hover{
							
								color: #FFFFFF;				
								text-decoration: none;

								}
                                .content_b3_a{
								color:#4e4e4e;
								font-size:13px;
								text-align:left;
								font-family:"微软雅黑";
							}		
                                  
                                 .content_b3_a a:link{
								color:#4e4e4e;
								text-decoration:none;				
								}
								        .content_b3_a a:visited{
								color:#4e4e4e;
								text-decoration:none;
								}		

                                 .content_b3_a a:hover{
							
								color: #FFFFFF;				
								text-decoration: none;

								}
                             





//-->
</style>
<title>长江视点</title>
</head>
<body>



  <div class="contentbg">
   <div class="content">
     <div class="content_abg">
     <a href="#"><div class="content_a"></div></a>

	      
		  <div class="content_bbg">
	           
			   <div class="content_b_line"> </div>
				   
	            <div class="content_b">
                  <div class="content_b1"> <a href="#">长江快讯</a><br />
                      <br />
                      <span class="content_b1_a"><a href="#">A股500点上涨耗尽多方子弹</a></span> </div>
	              <div class="content_b2"> <a href="#">
                    <div class="content_b2_b"> </div>
	                </a> </div>
            </div>
			<div class="content_b_line">  </div>
	            <div class="content_b">
                  <div class="content_b1"> <a href="#">长江快讯</a><br />
                      <br />
                      <span class="content_b1_a"><a href="#">A股500点上涨耗尽多方子弹</a></span> </div>
	              <div class="content_b2"> <a href="#">
                    <div class="content_b2_a"> </div>
	                </a> </div>
            </div>
	            
	            <div class="content_b_line"></div>
	            <div class="content_b">
	              <div class="content_b1">
				  <a href="#">长江快讯</a><br><br>
                     <span class="content_b1_a"><a href="#">A股500点上涨耗尽多方子弹</a></span>
                  </div>
				   <div class="content_b2">
				    <a href="#"><div class="content_b2_c">
					</div> </a>
				   
				   
				   
				   
	            </div> 
	           </div>
			   
	     </div>
	   </div>
     </div>



</body>
</html>

 图片资源请自行替换

 

 

分享到:
评论

相关推荐

    webview加载本地资源例子

    本示例主要关注如何使用WebView加载本地的CSS和JS资源,从而实现一个混合式开发的应用。接下来,我们将深入探讨这个话题。 首先,我们需要了解`WKWebView`。在iOS 8及更高版本中,苹果引入了`WKWebView`来替代之前...

    android webView加载html 并引用本地资源(图片、字体库)

    以上就是Android中使用WebView加载HTML并引用本地资源的基本步骤。通过结合HTML、CSS和JavaScript,你可以构建出丰富的交互式应用界面,同时利用本地资源提升性能和用户体验。记得在实际项目中,还要考虑安全性和...

    使用webview加载本地html页面,并处理html页面中的javascript事件

    这篇博文“使用webview加载本地html页面,并处理html页面中的javascript事件”探讨了如何利用WebView来加载本地HTML文件,并且如何处理HTML页面中的JavaScript事件,这对于创建混合型应用或实现特定功能(如在原生...

    webview加载本地的html文件

    在WebViewLoadDemo这个示例项目中,可能包含了上述所有操作的完整代码,你可以参考该项目学习和实践如何在Android应用中有效地使用WebView加载本地HTML文件。总的来说,理解并熟练掌握WebView的使用对于Android...

    webview 加载js ,css

    Android的WebView可以通过调用`loadData()`或`loadDataWithBaseURL()`方法加载HTML字符串,或者使用`loadUrl()`方法加载网络上的HTML资源。例如: ```java webView.loadUrl("file:///android_asset/index.html")...

    android Webview加载本地图片,自适应布局大小

    总之,Android中的WebView加载本地图片并自适应布局大小,需要结合HTML、CSS、JavaScript以及Java代码进行综合运用。理解WebView的工作原理和配置选项,以及合理的图片尺寸控制和性能优化,都是实现这一功能的关键点...

    Android WebView加载网页以及本地图片缓存问题

    本文将深入探讨如何使用WebView加载网页以及本地图片,并解决缓存问题。 一、WebView的基本使用 1. 初始化WebView:首先,我们需要在布局XML文件中添加WebView组件,并在对应的Activity或Fragment中找到该组件。...

    webView加载网络播放视频

    以上就是在Android应用中使用WebView加载并播放HTML5视频的主要步骤和技术要点。理解这些知识可以帮助开发者创建更丰富的用户体验,同时保持应用的性能和安全性。在实际开发中,根据具体需求,可能还需要对视频控件...

    WebView加载本地Html文件并实现点击效果

    本文将详细讲解如何使用WebView加载本地HTML文件,并实现点击按钮后弹出对话框的效果。 首先,我们需要在项目的`res/raw`目录下存放HTML文件。在这个例子中,我们假设有一个名为`index.html`的文件,它包含了我们要...

    android用webview加载assert中的html并且可拨打页面中的电话

    这篇教程将详细介绍如何在Android应用中使用Webview加载assert目录下的HTML文件,并且使用户能够通过Webview拨打电话。 首先,我们需要了解`WebView`。`WebView`是Android SDK提供的一种控件,用于在应用程序内嵌入...

    iOS中webview加载资源使用示例

    本示例将详细介绍如何在iOS中使用WebView来加载不同类型的资源,包括HTML字符串、本地TXT文件以及本地Word文件。 首先,我们需要导入WebKit框架,它是iOS提供用于处理Web内容的库。在Swift中,添加以下语句到你的`...

    android studio使用NanoHTTPD 创建 http 服务器打开html并使用webView打开页面

    4. **使用WebView加载页面** - 在布局XML文件中添加`WebView`组件,并设置相应的属性。 - 在`Activity`或`Fragment`中初始化`WebView`,并设置`WebViewClient`,以便处理页面加载事件。例如: ```java webView =...

    安卓浏览器WebViewJSHTML5相关-androidwebview加载本地html.zip

    提供了关于如何在Android中使用WebView加载本地HTML文件的相关示例和资料。 首先,我们要理解WebView的基本用法。在Android中,WebView是`android.webkit`包下的一个类,用于显示网页内容。要使用WebView,你需要在...

    WebView加载html,javascript,url

    本教程将深入探讨如何在Android中使用WebView加载HTML、执行JavaScript以及处理URL导航。 1. **WebView的基本使用** - 创建WebView对象:首先在布局XML文件中添加WebView组件,然后在Activity中通过findViewById()...

    android使用webview加载网页

    这个"android使用webview加载网页"的主题涉及到多个知识点,以下将详细介绍这些内容。 首先,我们需要理解WebView的基本用法。在Android Studio中,我们可以通过在布局XML文件中添加`&lt;WebView&gt;`标签来创建一个...

    webview加载html,播放音视频,响应js事件

    综上所述,这个示例涵盖了WebView加载HTML内容、播放音视频以及JavaScript与Android交互的基础知识,同时也提出了在处理返回键时音频继续播放的问题,需要进一步完善。开发者在实际应用中,应根据需求进行更深入的...

    webview+html跳转activity

    - 使用`setCacheMode()`开启WebView的缓存功能,提高加载速度。 - 使用`WebSettings`设置适当的渲染模式、图片加载策略等,以优化用户体验。 8. **调试WebView** - 可以开启WebView的开发者选项,通过Chrome ...

    iOS webview Hybrid开发预加载.zip

    预加载是优化Webview性能的关键策略,尤其是在资源密集型的应用中。本篇文章将深入探讨iOS Webview与Hybrid开发中的预加载技术。 首先,我们来理解一下什么是iOS Webview。Webview是iOS SDK提供的一种组件,它能够...

    webview与html双向交互

    在Android中,我们可以使用`WebView.loadUrl()`方法加载网络或本地资源。例如,加载本地HTML文件,可以这样写: ```java WebView webView = (WebView) findViewById(R.id.webView); webView.loadUrl("file:///...

    修改html并用webView展示的demo

    在这个“修改html并用webView展示的demo”中,我们将深入探讨如何利用HTML源码的修改以及WebView的使用来构建一个简单的应用示例。 首先,HTML(HyperText Markup Language)是用于创建网页的标准标记语言。通过...

Global site tag (gtag.js) - Google Analytics