androidh5开发
① h5端是什么设备
h5端的意思是第5代HTML,也指用H5语言制作的一切数字产品。
H5端是一系列制作网页互动效果的技术集合,即H5就是移动端的web页面。对于许多手游玩家来说,H5可能是个十分陌生的名词,其实H5就是HTML的高级版本。
H5游戏平台正以跨平台运营模式作为未来前进方向,将各个平台端游戏汇总整合集中,为玩家提供便捷的游戏通道,开创游戏平台运营新纪元,并努力成为综合游戏平台领跑者。
H5其实就是HTML5,常说的H5测试,就是移动端web页面,他跟安卓app与IOS app的区别:以往的app是使用的原生系统内核的,相当于直接在系统上操作,是传统意义上的软件,更加稳定。
H5的APP先得调用系统的浏览器内核,相当于是在网页中进行操作,较原生APP稳定性稍差,似乎还没有六百万级用户量的H5APP。
H5最大的优点是可以跨平台,开发容易,APP的话需要用Android语言和IOS语言各自写,H5开发只要开发一套。
② 如何利用html5开发android界面
H5开发安卓界面需要注意以下三点:
(上)包括Android设备多分辨率的问题,Android中构建HTML5应用程序基础
(中)包括Android与JS之间的互动,Android处理JS的警告对话框等,Android中的调试
(下)包括本地储存在Android中的应用,地理位置的应用,离线应用的构建
进入正题
● Android设备多分辨率的问题
Android浏览器默认预览模式浏览 会缩小页面 WebView中则会以原始大小显示
Android浏览器和WebView默认为mdpi。hdpi相当于mdpi的1.5倍 ldpi相当于0.75倍
三种解决方式:1 viewport属性 2 CSS控制 3 JS控制
1 viewport属性放在HTML的<meta>中
html代码:
<span style="font-size: x-small;"> <head>
<title>Exmaple</title>
<meta name=”viewport” content=”width=device-width,user-scalable=no”/>
</head></span>
meta中viewport的属性如下:
<span style="font-size: x-small;"> <meta name="viewport"
content="
height = [pixel_value | device-height] ,
width = [pixel_value | device-width ] ,
initial-scale = float_value ,
minimum-scale = float_value ,
maximum-scale = float_value ,
user-scalable = [yes | no] ,
target-densitydpi = [dpi_value | device-dpi |
high-dpi | medium-dpi | low-dpi]
"
/>
</span>
2 CSS控制设备密度
为每种密度创建独立的样式表(注意其中的webkit-device-pixel-ratio 3个数值对应3种分辨率)
html代码:
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.5)" href="hdpi.css" />
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.0)" href="mdpi.css" />
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 0.75)" href="ldpi.css" />
3 JS控制
Android浏览器和WebView支持查询当前设别密度的DOM特性
window.devicePixelRatio 同样值有3个(0.75,1,1.5对应3种分辨率)
JS中查询设备密度的方法
js代码:
if (window.devicePixelRatio == 1.5) {
alert("This is a high-density screen");
} else if (window.devicePixelRation == 0.75) {
alert("This is a low-density screen");
}
Android中构建HTML5应用
使用WebView控件 与其他控件的使用方法相同 在layout中使用一个<WebView>标签
WebView不包括导航栏,地址栏等完整浏览器功能,只用于显示一个网页。
③ android的H5混编开发用什么框架好
可以使用qmik,这个框架是专门为移动而开发的, 它具有体积小(22k,远远把jquery mobile 给丢弃了), 模块化开发,在框架本身就已经集成了模块化开发功能(可以不需要再引入第三化的模块化开发框架,如seajs,requirejs等) jquery语法,入门很简单,应用场景也比较丰富 听说作者在阿里任职
④ android开发用H5哪个框架比较好
一、Adobe Edge 目前还处于预览阶段的Adobe Edge是用HTML5、CSS、javaScript开发动态互动内容的设计工具。内容可以同时兼容移动设备和桌面电脑。Edge的一个重要功能是 Web工具包界面,方便确保页面在不同浏览器中的架构一致性,此外Edge还将整合TypeKit这样的字体服务。 动画和图形可以添 加到HTML元素中,程序也能通过Edge自身的代码片段库或者JavaScript代码进行扩展。动画可以在独立的时间线上进行嵌套,还能实现互动功 能。符合可以服用并通过API和代码片段控制。通过Edge设计的内容可以兼容iOS和Android设备,也可以运行在火狐、Chrome、 Safari和IE9等主流浏览器。 二、Adobe Dreamweaver CS6 Adobe Dreamweaver CS6作为一个Web设计软件,提供了对HTML网站和移动程序的可视化编辑界面。其Fluid Grid排版系统整合CSS样式表功能,提供自适应版面的跨平台兼容性。开发者可以完全实现Web设计的可视化操作,无需为代码所困。 用户不但还能在Live View中预览,还提供多屏幕预览功能。开发者可以通过MultiScreen预览面板查看HTML5内容的渲染效果。Live View通过WebKit渲染引擎支持HTML5。 三、Adobe ColdFusion 10 ColdFusion是用来开发企业Web程序的服务器端技术,通过Websockets、互动表单、视频和地理标签等HTML5技术创建富媒体用户体验。 四、Sencha Architect 2 在开发移动和桌面应用的工具中,Sencha的定位是HTML5可视化应用开发。开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发Sencha Touch2和Ext JS4 JavaScript应用,并实时预览。 五、Sencha Touch 2 Sencha Touch2是移动应用框架,也被看作是Sencha的HTML5平台。开发者可以用它开发面向iOS、Android和Blackberry、Kindle Fire等多种平台的移动应用。 六、Dojo Foundation Maqetta 来自于IBM的一个项目,Dojo Foundation Maqetta是为桌面和移动设备开发HTML5应用的开源工具,支持在浏览器中查看HTML5界面。用户体验设计师可以通过拖放组装UI样板 七、微软Visual Studio 2010 ServicePack 1 虽然一开始并不支持HTML5,但微软在2011年三月发布的Visual Studio 2010 SP1中提供了IntelliSense,追加了针对HTML5的一些元素。 八、JetBrains WebStorm 4.0 作为拥有HTML编辑器的JavaScript集成开发环境,WebStorm4.0提供了开发web应用的HTML5样板。开发者可以在创建HTML文档时可获得对HTML5文件的支持。例如砍伐者键入。开发者还可以在chrome浏览器中实时预览HTML文档。 九、Google Web Toolkit 该开发工具用于开发浏览器应用,但库中支持很多HTML5功能。包括对客户端或web存储的支持。其他HTML5功能还包括支持Canvas可视化,以及音频和视频widget。 十、DCloud HBuilder HBuilder是当前最快的HTML开发工具,强大的代码助手帮你快速完成开发,最全的语法库和浏览器兼容性数据让浏览器碎片化不再头痛。
⑤ android开发用H5哪个框架比较好
一、Adobe Edge 目前还处于预览阶段的Adobe Edge是用HTML5、CSS、JavaScript开发动态互动内容的设计工具。内容可以同时兼容移动设备和桌面电脑。Edge的一个重要功能是 Web工具包界面,方便确保页面在不同浏览器中的架构一致性,此外Edge还将整合TypeKit这样的字体服务。 动画和图形可以添 加到HTML元素中,程序也能通过Edge自身的代码片段库或者JavaScript代码进行扩展。动画可以在独立的时间线上进行嵌套,还能实现互动功 能。符合可以服用并通过API和代码片段控制。通过Edge设计的内容可以兼容iOS和Android设备,也可以运行在火狐、Chrome、 Safari和IE9等主流浏览器。 二、Adobe Dreamweaver CS6 Adobe Dreamweaver CS6作为一个Web设计软件,提供了对HTML网站和移动程序的可视化编辑界面。其Fluid Grid排版系统整合CSS样式表功能,提供自适应版面的跨平台兼容性。开发者可以完全实现Web设计的可视化操作,无需为代码所困。 用户不但还能在Live View中预览,还提供多屏幕预览功能。开发者可以通过MultiScreen预览面板查看HTML5内容的渲染效果。Live View通过WebKit渲染引擎支持HTML5。 三、Adobe ColdFusion 10 ColdFusion是用来开发企业Web程序的服务器端技术,通过Websockets、互动表单、视频和地理标签等HTML5技术创建富媒体用户体验。 四、Sencha Architect 2 在开发移动和桌面应用的工具中,Sencha的定位是HTML5可视化应用开发。开发团队可以在一个单一集成的环境中完成应用的设计、开发和部署。开发者还可以开发Sencha Touch2和Ext JS4 JavaScript应用,并实时预览。 五、Sencha Touch 2 Sencha Touch2是移动应用框架,也被看作是Sencha的HTML5平台。开发者可以用它开发面向iOS、Android和Blackberry、Kindle Fire等多种平台的移动应用。 六、Dojo Foundation Maqetta 来自于IBM的一个项目,Dojo Foundation Maqetta是为桌面和移动设备开发HTML5应用的开源工具,支持在浏览器中查看HTML5界面。用户体验设计师可以通过拖放组装UI样板 七、微软Visual Studio 2010 ServicePack 1 虽然一开始并不支持HTML5,但微软在2011年三月发布的Visual Studio 2010 SP1中提供了IntelliSense,追加了针对HTML5的一些元素。 八、JetBrains WebStorm 4.0 作为拥有HTML编辑器的JavaScript集成开发环境,WebStorm4.0提供了开发web应用的HTML5样板。开发者可以在创建HTML文档时可获得对HTML5文件的支持。例如砍伐者键入。开发者还可以在chrome浏览器中实时预览HTML文档。 九、Google Web Toolkit 该开发工具用于开发浏览器应用,但库中支持很多HTML5功能。包括对客户端或web存储的支持。其他HTML5功能还包括支持Canvas可视化,以及音频和视频widget。 十、DCloud HBuilder HBuilder是当前最快的HTML开发工具,强大的代码助手帮你快速完成开发,最全的语法库和浏览器兼容性数据让浏览器碎片化不再头痛。
⑥ android为什么要用h5做界面
H5开发安卓界面需要注意以下三点:
(上)包括Android设备多分辨率的问题,Android中构建HTML5应用程序基础
(中)包括Android与JS之间的互动,Android处理JS的警告对话框等,Android中的调试
(下)包括本地储存在Android中的应用,地理位置的应用,离线应用的构建
进入正题
● Android设备多分辨率的问题
Android浏览器默认预览模式浏览 会缩小页面 WebView中则会以原始大小显示
Android浏览器和WebView默认为mdpi。hdpi相当于mdpi的1.5倍 ldpi相当于0.75倍
三种解决方式:1 viewport属性 2 CSS控制 3 JS控制
1 viewport属性放在HTML的<meta>中
html代码:
<span style="font-size: x-small;"> <head>
<title>Exmaple</title>
<meta name=”viewport” content=”width=device-width,user-scalable=no”/>
</head></span>
meta中viewport的属性如下:
<span style="font-size: x-small;"> <meta name="viewport"
content="
height = [pixel_value | device-height] ,
width = [pixel_value | device-width ] ,
initial-scale = float_value ,
minimum-scale = float_value ,
maximum-scale = float_value ,
user-scalable = [yes | no] ,
target-densitydpi = [dpi_value | device-dpi |
high-dpi | medium-dpi | low-dpi]
"
/>
</span>
2 CSS控制设备密度
为每种密度创建独立的样式表(注意其中的webkit-device-pixel-ratio 3个数值对应3种分辨率)
html代码:
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.5)" href="hdpi.css" />
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.0)" href="mdpi.css" />
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 0.75)" href="ldpi.css" />
3 JS控制
Android浏览器和WebView支持查询当前设别密度的DOM特性
window.devicePixelRatio 同样值有3个(0.75,1,1.5对应3种分辨率)
JS中查询设备密度的方法
js代码:
if (window.devicePixelRatio == 1.5) {
alert("This is a high-density screen");
} else if (window.devicePixelRation == 0.75) {
alert("This is a low-density screen");
}
Android中构建HTML5应用
使用WebView控件 与其他控件的使用方法相同 在layout中使用一个<WebView>标签
WebView不包括导航栏,地址栏等完整浏览器功能,只用于显示一个网页。
⑦ 淘宝,京东这种商城的APP都是用Android+h5语言来开发的吗
一般比较大的平台都会采用Android原生+h5混合开发,这样能取各方面的优点;
原生开发可以访问设备中的所有功能,运行速度更快,性能更高,而且可以启用优秀的离线处理和存储能力等等,提供最佳的用户体验,最优质的用户界面,最华丽的交互。
原生开发的缺点在逐渐的开发、运营过程中显现出来。开发成本高,不同平台需要定制不同的app,也就是android定制apk,ios定制app,开发人员需要多平台多语言,人力成本、时间成本较多,通用性差;
H5开发是Html5开发的app,本质上运行在手机浏览器中的页面,一般使用app做一个壳套用浏览器运行H5的页面,由于H5的特性也有很多app使用半原生半H5的hybird app 开发模
H5有许多优点,特别针对原生开发的缺点。如:
直接在网页上调试和修改,几乎不用考虑用户机型和适配的问题,针对原生开发的平台碎片化、开发人力成本、时间成本高;版本升级优势,网页的升级与用户无关,用户无需下载更新安装,保证实时送达到用户手中;上线时间稳定、快速,不需要通过开发市场的审核,有收入分成的开发市场更是可以绕过收入分成。除此以外在视频媒体方面H5表现也十分优秀的。
H5的缺点有许多,当新技术出现时候许许多多的人都在吹嘘它的优点,到真正实用时才对它的缺点正视。H5加载大图片的时候性能会下降,大量用户访问同一个H5应用时性能会下降,响应速度比不上原生app,上网速度也不及原生app,H5不能自动处理动画上反复交互(网页游戏),需要借助css3、javascript。
⑧ androd H5混合开发 当无网络下,android怎么加载H5界面
H5开发安卓界面需要注意以下三点:(上)包括Android设备多分辨率的问题,Android中构建HTML5应用程序基础(中)包括Android与JS之间的互动,Android处理JS的警告对话框等,Android中的调试(下)包括本地储存在Android中的应用,地理位置的应用,离线应用的构建进入正题●Android设备多分辨率的问题Android浏览器默认预览模式浏览会缩小页面WebView中则会以原始大小显示Android浏览器和WebView默认为mdpi。hdpi相当于mdpi的1.5倍ldpi相当于0.75倍三种解决方式:1viewport属性2CSS控制3JS控制1viewport属性放在HTML的中html代码:Exmaplemeta中viewport的属性如下:2CSS控制设备密度为每种密度创建独立的样式表(注意其中的webkit-device-pixel-ratio3个数值对应3种分辨率)html代码:3JS控制Android浏览器和WebView支持查询当前设别密度的DOM特性window.devicePixelRatio同样值有3个(0.75,1,1.5对应3种分辨率)JS中查询设备密度的方法js代码:if(window.devicePixelRatio==1.5){alert("Thisisahigh-densityscreen");}elseif(window.devicePixelRation==0.75){alert("Thisisalow-densityscreen");}Android中构建HTML5应用使用WebView控件与其他控件的使用方法相同在layout中使用一个标签WebView不包括导航栏,地址栏等完整浏览器功能,只用于显示一个网页。
⑨ 移动端h5开发 分ios和android么
h5开发开发的应用是纯html写的,不需要分ios 还是android, 但是最终需要ios或者android来打包成不同平台的应用程序包, 通常不同的h5框架都有不同的打包方式或者打包平台.
⑩ app开发方式比较
app开发方式比较如下:
1、原生开发是在安卓ios等移动平台上利用官方提供的开发语言、开发工具进行APP开发,由于利用的是官方提供的语言和工具,并且能够直接操控硬件设备,在应用性能上和交互体验上是最好的,但是远而生应用的可移植性比较差,特别是一款原生APP,安卓和ios都各自开发同样的逻辑界面,要写两套。
2、网页版APP开发是利用web技术进行的APP开发,我们知道web技术本身需要浏览器的支持才能进行展示和用户交互。H5开发的好处是可以跨平台编写代码,同时在androidiosWindows上运行。由于web技术本身的限制,H5移动应用不能直接访问硬件设备和离线储存,所以在用户体验和性能上啊有很大的局限性。
3、混合式开发是结合原生和H5开发的技术,取长补短一种的开发模式。原生代码部分,是利用插件或者其他的框架为H5提供一个容器程序啊,主要是在业务实现界面展示是利用H5相关的web技术上进行实现的,比如现在的京东、淘宝,今日头条等都是利用混合式开发的模式。
开发流程
首先,制作一款APP,必须要有相关的idea,也就是说,第一步是APP的idea形成。其次,就是通过那些idea来进行APP的主要功能设计以及大概界面构思和设计。接着是大功能模块代码编写以及大概的界面模块编写。在界面模块编写之前,开发者可以在模拟器做大的功能开发。
然后把大概的界面和功能连接后,app的大致demo就出来了。值得一提的是,如果有界面设计师,就能节省大量时间。比如界面设计上,可以编写功能模块和设计师同步进行。这样app的demo出来后,基本上可以有界面可以用了。