嵌入Android中的h5界面：
将此页面复制到android项目中的assets目录下边：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> div{ width: 10px; height: 20px; background-color: aquamarine; } /* 关键帧的定义*/ @-webkit-keyframes mycolor { 0%{ background-color: #D2D2D2; } 10%{ background-color: #646464; width: 10px; } 20%{ background-color: aqua; width:20px ; } 80%{ background-color: #e54d26; width: 160px; } 100%{ background-color: blueviolet; width: 200px; } } div:hover{ -webkit-animation-name: mycolor; -webkit-animation-duration: 5s; -webkit-animation-timing-function: linear; -moz-animation-iteration-count:infinite; } </style> </head> <body> <div></div> </body> </html>
android中的界面：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.sinawebpan.MainActivity" > <WebView android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/webview" /> </RelativeLayout>
MainActivity.java
public class MainActivity extends Activity { private WebView webView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //将屏幕设置为全屏 getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); webView = (WebView) findViewById(R.id.webview);
loadLocalUrl("http://www.baidu.com"); loadLocalUrl("file:///android_asset/cssanimation.html");//本地的页面要放在assets目录下 } private void loadLocalUrl(String url) { WebSettings ws = webView.getSettings();
//如果访问的页面中有javastripts,则webview必须支持javascripts. ws.setJavaScriptEnabled(true); webView.loadUrl(url); } }
知识点整理：
浏览器引擎WebKit,有很好的网页解析机制。
WebKit包中的几个重要的类：
WebSettings:设置webview的特征、属性
WebView：显示web页面的视图对象，用于网页数据的载入、显示等操作
loadUrl(String url);//url 互联网用http://www.google.com 本地用：file:///android_asset/xxx.html
loadData();
goBack();//返回上个页面
clearHistory();//清除历史记录
WebViewClient：在web视图中帮助处理各种通知、请求事件
WebChromClient：辅助webview处理js对话框、网站标题、加载进度条等