嵌入Android中的h5界面:

将此页面复制到android项目中的assets目录下边:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <style>
  7. div{
  8. width: 10px;
  9. height: 20px;
  10. background-color: aquamarine;
  11. }
  12. /* 关键帧的定义*/
  13. @-webkit-keyframes mycolor {
  14. 0%{
  15. background-color: #D2D2D2;
  16. }
  17. 10%{
  18. background-color: #646464;
  19. width: 10px;
  20. }
  21. 20%{
  22. background-color: aqua;
  23. width:20px ;
  24. }
  25. 80%{
  26. background-color: #e54d26;
  27. width: 160px;
  28. }
  29. 100%{
  30. background-color: blueviolet;
  31. width: 200px;
  32. }
  33. }
  34.  
  35. div:hover{
  36. -webkit-animation-name: mycolor;
  37. -webkit-animation-duration: 5s;
  38. -webkit-animation-timing-function: linear;
  39. -moz-animation-iteration-count:infinite;
  40. }
  41. </style>
  42. </head>
  43. <body>
  44. <div></div>
  45. </body>
  46. </html>

android中的界面:

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:paddingBottom="@dimen/activity_vertical_margin"
  6. android:paddingLeft="@dimen/activity_horizontal_margin"
  7. android:paddingRight="@dimen/activity_horizontal_margin"
  8. android:paddingTop="@dimen/activity_vertical_margin"
  9. tools:context="com.example.sinawebpan.MainActivity" >
  10.  
  11. <WebView
  12. android:layout_width="fill_parent"
  13. android:layout_height="fill_parent"
  14. android:id="@+id/webview"
  15. />
  16.  
  17. </RelativeLayout>

MainActivity.java

  1. public class MainActivity extends Activity {
  2.  
  3. private WebView webView;
  4.  
  5. @Override
  6. protected void onCreate(Bundle savedInstanceState) {
  7. super.onCreate(savedInstanceState);
  8. setContentView(R.layout.activity_main);
  9. //将屏幕设置为全屏
  10. getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
  11.  
  12. webView = (WebView) findViewById(R.id.webview);
    loadLocalUrl("http://www.baidu.com");
  13. loadLocalUrl("file:///android_asset/cssanimation.html");//本地的页面要放在assets目录下
  14. }
  15.  
  16. private void loadLocalUrl(String url) {
  17. WebSettings ws = webView.getSettings();
    //如果访问的页面中有javastripts,则webview必须支持javascripts.
  18. ws.setJavaScriptEnabled(true);
  19. webView.loadUrl(url);
  20.  
  21. }
  22. }

知识点整理:

浏览器引擎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对话框、网站标题、加载进度条等

h5学习-h5嵌入android中的更多相关文章

  1. Android开发学习之路-Android中使用RxJava

    RxJava的核心内容很简单,就是进行异步操作.类似于Handler和AsyncTask的功能,但是在代码结构上不同. RxJava使用了观察者模式和建造者模式中的链式调用(类似于C#的LINQ). ...

  2. Android学习四、Android中的Adapter

    一.Adapter的介绍 An Adapter object acts as a bridge between an AdapterView and the underlying data for t ...

  3. 【Android学习入门】Android中activity的启动模式

    启动模式简单地说就是Activity启动时的策略,在Androidmanifest.xml文件中的标签android:launchMode属性设置,在Android中Activity共有四种启动模式分 ...

  4. Android中Native和H5交互

    1.概述 时至今日,H5的跨平台性越发凸显优势,一套代码适配android.ios,既能减少开发成本,又便于更新与维护.但是native的性能体验也确实更佳,尤其体现在复杂界面和频繁变化的界面上.事实 ...

  5. H5移动端IOS/Android兼容性总结,持续更新中…

    H5移动端IOS/Android兼容性总结,持续更新中… 1. IOS不识别日期 new Date("2018-07-01 08:00:00")在Android下正常显示可以直接进 ...

  6. Android中H5和Native交互的两种方式

    Android中H5和Native交互的两种方式:http://www.jianshu.com/p/bcb5d8582d92 注意事项: 1.android给h5页面注入一个对象(WZApp),这个对 ...

  7. H5学习笔记1

    H5学习笔记 1.创建超链接: target=”_blank”:链接的目标网页会在新的窗口中打开. target=”_parent”:链接的目标会在当前窗口中打开,如果在框架网页中,则会在上一层框架打 ...

  8. 学习H5一周随笔

    H5学习也已经进行了一个周了,除了学习过程中的乱哄哄的脑子,对H5初学者(我)常见的问题有了如下见解. 1.初学者在建立新的Html文件之后,有时候会把 <meta charset=" ...

  9. H5学习的第三周

    上周,我们结束了京东站的制作,本周我们开始了手机站和响应式网站的学习,并仿制了一个手机端界面和一个响应式界面,在完成这两个网站的过程中我遇到了许多问题,也了解了它们的解决方法,接下来我讲详细介绍本周我 ...

随机推荐

  1. HTML5开发实战——Sencha Touch篇(1)

    学习了很多主要的Sencha Touch内容,已经了解了Sencha Touch的开发模式.接下来一段时间我们将利用Sencha Touch来进行自己的web应用构建. 先要解决的是前端的问题.从最简 ...

  2. [思考]我们应该怎样建设企业IT

    从人员架构上来看,要不要企业自己的IT团队?如果要,应该有什么样的架构?运维,开发,管理,项目? 从是否外包角度看,要不要外包?如果外包,如何建立外包流程? 从业务角度看,企业IT的发展应该是围绕业务 ...

  3. h5ai目录列表优化

    h5ai是HTTP Web服务器的现代文件索引器,专注于您的文件.目录以有吸引力的方式显示,浏览它们通过不同的视图,面包屑和树状概述增强.最初,h5ai是HTML5 Apache Index的缩写,但 ...

  4. vsftp 777权限

    1. setsebool -P ftpd_disable_trans 1 2. service vsftpd restart

  5. 基于TCP的字符串传输程序

    ---恢复内容开始--- LINUX中的网络编程是通过SOCKET接口来进行的. Socket(套接字) Socket相当于进行网络通信两端的插座,只要对方的Socket和自己的Socket有通信联接 ...

  6. windows系统下mysql5.5查看和设置数据库编码

    1.显示当前编码命令: show variables like 'char%'; 2.设置编码为utf8命令:set names 'utf8';

  7. bzoj-1192 [HNOI2006]鬼谷子的钱袋(水题)

    题目链接: [HNOI2006]鬼谷子的钱袋 Time Limit: 10 Sec  Memory Limit: 162 MB Description 鬼谷子非常聪明,正因为这样,他非常繁忙,经常有各 ...

  8. 1.ARC模式下如何兼容非ARC的类

    ARC模式下如何兼容非ARC的类 :转变为ARC的, -f-objc-arc 非ARC模式下如何兼容ARC的类 :转变为非ARC -fno-objc-arc

  9. JS事件流与DOM事件处理程序

    在Javascript的DOM中,关于事件Event对象的知识是一定要掌握的.Event对象模型主要分为两个部分,一个是Event对象本身具有的属性和方法,这个参照API就可以学得:另一个是在DOM节 ...

  10. 【转】jenkins上配置robotframeworkride自动化脚本任务

    jenkins上配置robotframeworkride自动化脚本任务 编写好的自动化脚本,集成在jenkins上进行自动运行于监控,这里采用分布式构建,在一台slave上进行任务构建与自动化脚本的运 ...