用webview写界面，加载本地js,js,html文件

转自：http://www.tuicool.com/articles/3mE7BzR
以jquery mobile为例

1.在android界面拖入一个webview，然后添加一个internet权限

<uses-sdk android:minSdkVersion="8" android:targetSdkVersion="18" />  
<uses-permission android:name="android.permission.INTERNET"/>  
  
<application .............................

View Code

2. 在assets目录里面放入js,css,html资源文件

3.在写本地html的时候引入assert里的对应路径

<!DOCTYPE html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<meta name="viewport" content="width=device-width, initial-scale=1">   
<title> 标题 </title>  
<link rel="stylesheet" type="text/css" href="file:///android_asset/css/jquery.mobile-1.4.2.min.css">  
<script src="file:///android_asset/js/jquery-1.7.1.min.js"></script>  
<script src="file:///android_asset/js/jquery.mobile-1.4.2.min.js"></script>  
</head>  
<body>  
  
  
　<div data-role="page">  
  　<div data-role="header">  
  　　<h1>My Title</h1>  
  　</div>  
     
  　<div data-role="content">  
    <ul data-role="listview" data-inset="true" >  
      <li><a href="#">Acura</a></li>  
      <li><a href="#">Audi</a></li>  
      <li><a href="#">BMW</a></li>  
      <li><a href="#">Cadillac</a></li>  
      <li><a href="#">Ferrari</a></li>  
    </ul>   
  　</div>  
　</div><!-- /page -->  
  
</body>  
</html>

View Code

4.在代码里访问页面

package com.example.asd_webview;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.webkit.WebSettings;
import android.webkit.WebSettings.RenderPriority;
import android.webkit.WebView;

public class MainActivity extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  
  WebView webview = (WebView)findViewById(R.id.webView1);
  WebSettings wv_setttig = webview.getSettings();
  wv_setttig.setJavaScriptEnabled(true);
  //wv_setttig.setRenderPriority(RenderPriority.HIGH);
  
  String url = "file:///android_asset/index.html";
  webview.loadUrl(url);
  
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.main, menu);
  return true;
 }

}

View Code

5.最后效果如下:

用webview写界面，加载本地js,js,html文件

用webview写界面，加载本地js,js,html文件

你可能感兴趣的:(用webview写界面，加载本地js,js,html文件)