大家先先简单的了解下 HTML5
HTML5是万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改
HTML5的设计目的是为了在移动设备上支持多媒体。
优势:HTML5可以提供:
1.提高可用性和改进用户的友好体验;
2.有几个新的标签,这将有助开发人员定义重要的内容;
3.可以给站点带来更多的多媒体元素(视频和音频);
4.可以很好的替代FLASH和Silverlight;
5.当涉及到网站的抓取和索引的时候,对于
SEO很友好;
6.将被大量应用于移动应用程序和游戏。
接下来说下我们安卓开发中h5交互过程,并附上一个h5可复用的帮助类
首先,我们在xml布局中声明一个webview
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:clipToPadding="true"
android:fitsSystemWindows="true"
android:orientation="vertical">
<TextView
android:text="加载失败请点击重试!"
android:gravity="center"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:visibility="gone"
android:id="@+id/tv_load_error" />
<WebView
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</WebView>
</RelativeLayout>
在实现过程中我们直接给webview设置一个url链接,就可以正常展示了
mWebView.loadUrl(url);
这里分享下我们项目中的一个帮助类
public class H5LoadActivity extends BaseActivity {
private WebView mWebView;
private TextView tv_load_error;
private String url = "";
public static H5LoadActivity instance = null;
private static final String TAG = H5LoadActivity.class.getSimpleName();
private static final String APP_CACAHE_DIRNAME = "/webcache";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_h5_load);
initView();
}
protected void initView() {
instance = this;
tv_load_error = (TextView) findViewById(R.id.tv_load_error);
mWebView = (WebView) findViewById(R.id.webview);
WebSettings mWebSettings = mWebView.getSettings();
mWebSettings.setDomStorageEnabled(true);//持久化本地存储 让前端自己做页面缓存 否则他们拿不到storage里的数据会报错
mWebSettings.setJavaScriptEnabled(true);
url = getIntent().getExtras().getString("url");
LLog.e("url == " + url);
mWebView.loadUrl(url);
mWebView.setWebChromeClient(new MyWebChromeClient());
mWebView.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// 重写此方法表明点击网页里面的链接还是在当前的webview里跳转,不跳到浏览器那边
view.loadUrl(url);
return true;
}
@Override
public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
tv_load_error.setVisibility(View.VISIBLE);
view.setVisibility(View.GONE);
}
});
mWebView.addJavascriptInterface(new JsAndroidImpl() {//增加接口方法,让html页面调用
@JavascriptInterface //别漏了这个注解
public void finish() {
H5LoadActivity.this.finish();
}
@JavascriptInterface //别漏了这个注解
public void getShopsInfo(String shopInfo) {
LLog.e("--------------" + shopInfo);
Intent intent = new Intent(H5LoadActivity.this, ConfirmationActivity.class);
intent.putExtra("shopInfo", shopInfo);
intent.putExtra("TYPE", 3);
startActivity(intent);
}
}, "android");
tv_load_error.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
mWebView.loadUrl(url);
}
});
mWebView.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_UP:
if (!v.hasFocus()) {
v.requestFocus();
}
break;
}
return false;
}
});
}
@Override
protected void onDestroy() {
super.onDestroy();
clearWebViewCache();
}
@Override
//设置回退
//覆盖Activity类的onKeyDown(int keyCoder,KeyEvent event)方法
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {
mWebView.goBack(); //goBack()表示返回WebView的上一页面
return true;
}
finish();//结束退出程序
return false;
}
/**
* 清除WebView缓存
*/
public void clearWebViewCache() {
//清理Webview缓存数据库
try {
deleteDatabase("webview.db");
deleteDatabase("webviewCache.db");
} catch (Exception e) {
e.printStackTrace();
}
//WebView 缓存文件
File appCacheDir = new File(getFilesDir().getAbsolutePath() + APP_CACAHE_DIRNAME);
Log.e(TAG, "appCacheDir path=" + appCacheDir.getAbsolutePath());
File webviewCacheDir = new File(getCacheDir().getAbsolutePath() + "/webviewCache");
Log.e(TAG, "webviewCacheDir path=" + webviewCacheDir.getAbsolutePath());
//删除webview 缓存目录
if (webviewCacheDir.exists()) {
deleteFile(webviewCacheDir);
}
//删除webview 缓存 缓存目录
if (appCacheDir.exists()) {
deleteFile(appCacheDir);
}
}
/**
* 递归删除 文件/文件夹
*
* @param file
*/
public void deleteFile(File file) {
Log.i(TAG, "delete file path=" + file.getAbsolutePath());
if (file.exists()) {
if (file.isFile()) {
file.delete();
} else if (file.isDirectory()) {
File files[] = file.listFiles();
for (int i = 0; i < files.length; i++) {
deleteFile(files[i]);
}
}
file.delete();
} else {
Log.e(TAG, "delete file no exists " + file.getAbsolutePath());
}
}
}
当我们想跳转到h5界面时:
Bundle bundle = new Bundle();
bundle.putString("url", "http://118.186.18.36:6867/shangcheng/Examination_Analysis.html");
startIntent(H5LoadActivity.class, bundle);
public void startIntent(Class aClass, Bundle bundle) {
Intent intent = new Intent(context, aClass);
if (null != bundle)
intent.putExtras(bundle);
startActivity(intent);
}