最近的项目需要做一个如同微信中的腾讯新闻的功能,如下图所示:
直接上关键代码:
布局:
<?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>
图片资源请自行替换
相关推荐
android webView加载html 并引用本地资源(图片、字体库)
iOS中webView加载html字符串,加载本地txt文件和加载本地word文件的使用示例
页面缓存:加载一个网页时的html、JS、CSS等页面或者资源数据,这些缓存资源是由于浏览器 的行为而产生,开发者只能通过配置HTTP响应头影响浏览器的行为才能间接地影响到这些缓存数据。 而缓存的索引放在:/data/...
实现了WKWebView网络请求拦截,并下载静态资源文件,加载时优先通过本地资源文件进行加载
本文实例讲述了Android编程实现使用webView打开本地html文件的方法。分享给大家供大家参考,具体如下: 在布局的配置文件里: <WebView android:layout_width=wrap_content android:layout_height=wrap_content ...
主要介绍了解决WebView通过URL加载H5界面出现空白的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
主要介绍了Android webview加载https链接错误或无响应的解决,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
当我们对页面进行销毁的时候,其中webview持有的HTML页面还会继续存在,加入我们在HTML页面中做了一些监听手机晃动、声音…… 以及使用了js定时任务的情况下。 单纯的销毁我们的native页面并不能达到让页面中这些...
远程下载html资源zip,解压web view打开,最新代码在https://github.com/nullyang/NSURLSessionTest
WebKit是Mac OS X v10.3及以上版本所包含的软件框架(对v10.2.7及以上版本也可通过软件更新获取)。 同时,WebKit也是Mac OS X的Safari网页浏览器的基础。WebKit是一个开源项目...这里分享一个一键设置WebView添加控件
Flutter InAppWebView插件 Flutter插件,可让您添加嵌入式Web视图,使用无头Web视图以及打开应用内浏览器窗口。文章/资源要求Dart SDK:“> = 2.12.0-0 <3> = 1.22.0” Android: minSdkVersion 17并添加了对android...
使用cocosCreator制作试玩广告playableAd,打包发布web-mobile后合并为一个html的脚本
1. WebView加载网页方法 //加载本地资源 loadUrl(file:///android_asset/example.html); //加载网络资源 loadUrl(http://baidu.com); 2. 带进度的Drawable文件view_progress_webview <?xml version=1.0 ...
google-analytics-with-ludei-cocconjs-canvas ==================================== 通过使用 WebView,将 analytics.js(GA Universal Analytics)与 Ludei 的 CocoonJS Canvas+ 应用程序结合使用不再需要外部...
安卓上用于加载的Webview视图窗口只是作为类浏览器而存在,在安卓上更是只能同时运行一个Webview。(2)跨域数据交互问题。不同的Webview之间无法共享数据。(3)页面自适应问题。页面难以兼容适应不同分辨率的设备...
因为默认优先从远程引用资源,这就导致有的时候无法加载js文件,图表显示不出来 解决办法: 下载所需js文件到本地,修改资源引用地址 看网站的介绍,pyecharts 提供了更改全局 HOST 的快捷方式 官方下载 pyecharts-...
13.4.2 使用WebView加载HTML 代码 507 13.5 使用Web Service进行 网络编程 508 13.5.1 Web Service简介 509 13.5.2 Web Service平台概述 510 13.5.3 使用Android应用调用 Web Service 512 13.6 本...
13.4.2 使用WebView加载HTML 代码 507 13.5 使用Web Service进行网络 编程 508 13.5.1 Web Service简介 509 13.5.2 Web Service平台概述 510 13.5.3 使用Android应用调用 Web Service 512 13.6 本章小结 524 第14章 ...