Android 图文混排 通过webview实现并实现点击图片
2024-08-25 16:56:33
在一个开源项目看到是用的webview 实现的
1. 这是在asset中的一个模板html
<html>
<head>
<title>News Detail</title>
<meta name="viewport" content="width=device-width, minimum-scale=0.5, initial-scale=1.2, maximum-scale=2.0, user-scalable=1" />
<link rel="stylesheet" type="text/css" href="css.css" /> </head>
<body>
<div id="header">
<h3>
#title#
</h3>
<div class="date">#time#</div>
</div>
<div id="content">
#content#
</div>
</body>
</html>
2.模板的css
body {
font-family: Helvetica, "Microsoft Yahei", Verdana, Helvetica, SimSun,
Arial, "Arial Unicode MS", MingLiu, PMingLiu, "MS Gothic", sans-serief;
margin: ;
padding: 8px;
background-color: #efeff0;
color: #;
word-wrap: break-word;
} p {
margin-top: ;
margin-bottom: 5pt;
line-height: .6em;
} #header {
text-align: center;
background: transparent url('webBgLine.png') repeat-x scroll center
bottom;
padding-top: 6pt;
margin-bottom: 5pt;
-webkit-background-size: 320px 2px;
} #header h3 {
margin-bottom: 0px;
margin-top: 5px;
font-size: 16pt;
padding: 5pt;
color: #;
line-height: .3em;
} .date {
color: #8e8e8e;
font-size: 12pt;
padding: 8pt ;
} #content {
font-size: 14pt;
line-height: 1.8;
} img {
max-width: 310px;
height: auto;
} div.bimg {
text-align: center;
padding: ;
} .photo_title {
font-weight: bold;
font-size: 16pt;
margin-top: 15px;
} .langs_cn {
color: #;
} audio {
width: %
} * {
-webkit-touch-callout: none;
/* prevent callout to copy image, etc when tap to hold */
/*-webkit-text-size-adjust: none;*/
/* prevent webkit from resizing text to fit */
-webkit-tap-highlight-color: rgba(, , , 0.15);
/* make transparent link selection, adjust last value opacity 0 to 1.0 */
/*-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */
} @media screen and (-webkit-device-pixel-ratio: ) {
#header {
background-image: transparent url('webBgLine@2x.png') repeat-x scroll
center bottom;
-webkit-background-size: 320px 1px;
}
}
3.测试的一个html文件 将来会在网络中获取
主要的代码:
package com.su.imagetextview; import java.io.IOException;
import java.io.InputStream; import android.app.Activity;
import android.content.res.AssetManager;
import android.os.Bundle;
import android.util.Log;
import android.view.GestureDetector.OnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnLongClickListener;
import android.view.View.OnTouchListener;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebView.HitTestResult;
import android.widget.Toast; public class WebViewActitivy extends Activity {
private String TAG = "WebViewActitivy";
private WebView webView; @Override
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.webview);
super.onCreate(savedInstanceState);
webView = (WebView) findViewById(R.id.news_body_webview_content);
webView.getSettings().setDefaultTextEncodingName("utf-8");// 避免中文乱码
webView.addJavascriptInterface(this, "javatojs");
webView.setScrollBarStyle();
WebSettings webSetting = webView.getSettings();
webSetting.setJavaScriptEnabled(true);
webSetting.setNeedInitialFocus(false);
webSetting.setSupportZoom(true);
webSetting.setCacheMode(WebSettings.LOAD_DEFAULT
| WebSettings.LOAD_CACHE_ELSE_NETWORK); try {
// 读取来自assets的信息 实际操作 _newsContent 来自网络
String _newsContent = getStringFromAssets("test.html");
// 这是本地的html模板
String htmlContent = getStringFromAssets("NewsDetail.html"); // 替换文本
String newsInfo = "发表时间:" + "" + " 查看:" + "";
String newsTitle = "测试Html图文混排";
String LOCAL_PATH = "file:///android_asset/";// 本地html
// 替换信息加载到html模板中
webView.loadDataWithBaseURL(
LOCAL_PATH,
htmlContent.replace("#title#", newsTitle)
.replace("#time#", newsInfo)
.replace("#content#", _newsContent), "text/html",
"utf-8", null);
webView.setOnTouchListener(touchlistener);
/**
* 长按获取图片地址可以进行放大保存等操作
*/
webView.setOnLongClickListener(new OnLongClickListener() { @Override
public boolean onLongClick(View v) {
HitTestResult hitTestResult = ((WebView) v)
.getHitTestResult();
if (hitTestResult.getType() == HitTestResult.IMAGE_TYPE
|| hitTestResult.getType() == HitTestResult.IMAGE_ANCHOR_TYPE
|| hitTestResult.getType() == HitTestResult.SRC_IMAGE_ANCHOR_TYPE) {
Log.e(TAG, "保存这个图片!"
+ hitTestResult.getExtra().toString());
}
return true;
}
}); } catch (Exception e) {
// TODO: handle exception
} } /**
* 只能通过实现这个方法来模拟点击 事件 直接点击没效果
*/ private OnTouchListener touchlistener = new OnTouchListener() { public boolean onTouch(View v, MotionEvent event) {
float x = , y = ;
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
x = (int) event.getRawX();
y = (int) event.getRawY();
break; case MotionEvent.ACTION_UP:
if (x - event.getX() < && y - event.getY() < ) {
HitTestResult hitTestResult = ((WebView) v)
.getHitTestResult();
if (hitTestResult.getType() == HitTestResult.IMAGE_TYPE
|| hitTestResult.getType() == HitTestResult.IMAGE_ANCHOR_TYPE
|| hitTestResult.getType() == HitTestResult.SRC_IMAGE_ANCHOR_TYPE) {
Log.e(TAG, "保存这个图片!"
+ hitTestResult.getExtra().toString());
Toast.makeText(
WebViewActitivy.this,
"保存这个图片!" + hitTestResult.getExtra().toString(),
).show();
}
} break;
} return false;
} }; String getStringFromAssets(String path) throws IOException {
AssetManager assetManager = getAssets();
InputStream inputStream = assetManager.open(path);
return inputStream2String(inputStream); } public static String inputStream2String(InputStream in) throws IOException {
StringBuffer out = new StringBuffer();
byte[] b = new byte[];
for (int n; (n = in.read(b)) != -;) {
out.append(new String(b, , n));
}
return out.toString();
}
}
上图
代码:这里
最新文章
- html基础大全(经典)
- 【温故Delphi】GAEA用到Win32 API目录
- linux tomcat 用/etc/init.d/tomcat start启动报错
- MyEclipse 15 集成SVN
- DM365视频处理流程/DM368 NAND Flash启动揭秘
- JAVA多线程经典问题 -- 生产者 消费者 同步队列实现方法
- 老李分享:开发python的unittest结果输出样式
- opencv 小程序170323
- Python量化投资知识总结贴
- Python 学习笔记7 条件语句 If
- Linux学习之源码包安装与脚本安装(十八)
- 【spark 深入学习 05】RDD编程之旅基础篇-01
- delphi Timage 加上滚动条方法
- @SpringBootApplication的使用
- Jmeter 接口测试间的引用
- leetcode-119-Pascal&#39;s Triangle II(生成某一行的帕斯卡三角形)
- C# 可否对内存进行直接的操作?
- BZOJ 3809 Gty的二逼妹子序列 莫队算法+分块
- 前端防御XSS
- MySQL-based databases CVE -2016-6663 本地提权