今天看啥 热点：
HBuilder开发App教程03-定制图标，启动页以及打包，hbuilder03-
helloworld
上次说到了helloworld，你应该已经可以新建项目，真机调试了，
这次来说说图标的定制，启动页的定制以及打包。
如果不定制图标的话，默认会是博文顶部图表的样子，
你肯定不想这个样子，来吧，定制一个自己的图标吧。
打开项目下的manifest.json，选择底部的图标配置（老版本需升级到最新版），
然后选择一个制作好的256*256大小的png，系统会自动生成各种大小的图标。
启动页定制
步骤和上面一样，至不要要选择启动图片配置一项，
然后按照各种图片大小格式选择制作好的图片，
如果你只生成android的app，只需要设置android的图片。
选择应用信息一项，然后
1.填写应用名称
也就是之后显示在手机上的app名称
因为开发的时候会频繁修改打包，
所以建议用版本号做区分，例如使用1.1.1.，代表：大。中。小。日期
3.页面入口
app启动后的入口页面，这个很重要，之后会详细讲解。
4.重力感应
有四中模式，一般只需要选择第一种就行了，也就是正常屏幕，
有其他需要在依次选择。
也就是引用三方插件的配置，
大部分都是需要输入你自己的ak，sk，
相关使用请参考第三方sdk，
这里只需要配置ak，sk，
比较常用的是登录，支付，推送，分享。
为了给用户一个更好的体验，
需要将不需要的权限删掉，
只保留必须的权限。
配置了这么多总算可以打包了，
Hbuilder默认是在云端打包的，
也就是将你的代码提交上去，进行打包，然后你下载打好的包，
优点：不管你的机器配置高低，只要网速快都可以很快的打好包，
当然你也可以进行本地打包，那样就需要android环境和ios环境，不做推荐。
具体的选择：
1.选择平台
选择android或ios，或者两者都有
2.选择证书
如果只是自己玩可以选择公用证书，
但是这样不能发到线上，如果要发布到线上需要自己申请google和apple的证书。
3.点击打包
点击打包，然后等待吧，系统会显示进度，当打包完成后会自动下载到本地，
打开包所在文件夹就可以使用app了。
更多教程：
HBuilder开发App教程：/book/detail/3
更多学习笔记：/book
版权声明：本文为博主原创文章，未经博主允许不得转载。
相关搜索：
相关阅读：
相关频道：
Android教程最近更新&&&&hbuilder开发移动app入门
hbuilder开发移动app入门
使用hbuilder开发html5+移动应用，包括入门教程和Android、ios真机调试，入门首选。
嵌到我的页面
<input type="text" readonly="true" value="">
若举报审核通过，可奖励20下载分
被举报人：
举报的资源分：
请选择类型
资源无法下载
资源无法使用
标题与实际内容不符
含有危害国家安全内容
含有反动色情等内容
含广告内容
版权问题，侵犯个人或公司的版权
*详细原因：
您可能还需要
精易模块[源码] V5.28
移动开发下载排行谈谈APP架构选型：React Native还是HBuilder
原文链接导读：最近公司的一款新产品APP要进行研发，老大的意思想用H5来做混合APP以达到高效敏捷开发的目的。我自然就开始进行各种技术选型的调研，这里重点想说的是我最后挑选出的2款hybrid app开发技术方案：RN(react native)，HBuilder。React Native是大名鼎鼎的Facebook的开源技术框架，而HBuilder是国内的H5工具开发公 司DCLOUD的产品。我自己先总结下吧：这两个技术框架在开发效率上基本上可以媲美WEB开发的速度，RN强调的是&Learn once, write anywhere&，RN不强求一份原生代码支持多个平台；而HBuilder则可以实现类似JAVA的&Write once, run anywhere&，也就是说写一份代码，即可同时发布多平台，这个效率比原生开发而言自然会double。两者的原理其实都是基于JS在做前端开发，用JS去做桥接调用原生的API，最大的优点是方便做APP的动态更新而不用频繁去发布版本，当然hybrid的这种框架也有弱势缺点，就是目前原生APP的开发生态已经趋向成熟，一些第三方库和框架不仅丰富而且稳定，所以如果改用基于JS的Hybrid app方案来做，一定要考虑APP产品是否适合用这种技术来做。下面我把一些网友对这两个框架的看法列举如下供参考：RN -React Native部分&&&&&&&&&&&&&&&&&React Native的核心实现：先简单说几点，详细的等回头更新。1. React Native里面没有webview，这货不是Hybrid app，里面执行JS是用的JavascriptCore。2. 再说React Native的核心，iOS Native code提供了十来个最基本核心的类（RCTDeviceEventEmitter、RCTRenderingPerf等）、或组件（RCTView、RCTTextField、RCTTextView、RCTModalFullscreenView等），然后由React Native的JS部分，组成二十来个基本组件（Popover、Listview等），交由上层的业务方来使用（THGroupView）。3. 就如他们在宣传时所说，他们实现了一套类似css的子集，用来解决样式问题，相当复杂和强大，靠这个才能将Native的核心组件组成JS层的基本组件再组成业务端的业务组件，应该是采用facebook/css-layout & GitHub的C语言版本实现的（在ppt中我们看到了类似flex-direction: column一类的代码，这个正是css-layout支持的语法）。4. 在React Native中，写JS的工程师解决的是「将基本组件拼装成可用的React组件」的问题，写Native Code的工程师解决的是「提供核心组件，提供足够的扩展性、灵活性和性能」的问题。&React Native是什么？其实这东西从Native开发来说，相当于重新发明了一个浏览器渲染引擎并且套一个React的壳，从Web开发角度来说，就是把原来React的后端换成了Native code来实现，就跟Flipboard最近搞的React Canvas 一样： Flipboard & GitHubreact-canvasReact Native的优势和劣势：：优势相对Hybird app或者Webapp：1. 不用Webview，彻底摆脱了Webview让人不爽的交互和性能问题2. 有较强的扩展性，这是因为Native端提供的是基本控件，JS可以自由组合使用3. 可以直接使用Native原生的「牛逼」动画（在FB Group这个app里面，面板滑出带一点果冻弹动，面板基于某个点展开这种动画随处可见，这种动画用Native code来做小菜一碟，但是用Web来做就难上加难）。优势相对于Native app：1. 可以通过更新远端JS，直接更新app，不过这快成为各家大型Native app的标配了&劣势：1. 扩展性仍然远远不如web，也远远不如直接写Native code（这个不用废话解释了吧）2. 从Native到Web，要做很多概念转换，势必造成双方都要妥协。比如web要用一套CSS的阉割版，Native通过css-layout拿到最终样式再转换成native原生的表达方式（比如iOS的Constraint/origin/Center等属性），再比如动画。另外，若Android和iOS都要做相同的封装，概念转换就更复杂了。HBuilder部分&&&&&&&&&&&&&&&&&&&&-phonegap出的早，自然用的人多。phonegap自己的定位是混合开发hybrid，用原生+js；HBuilder的定位是纯js搞定一切。5+ 和 phonegap在能力、性能、开发便利性上都优于phonegap。先看能力：5+ 有HTML5+和Native.js技术，HTML5+包含常用的跨平台的几百个API，能满足常规开发需求，而Native.js把40w原生api映射成js对象，这样js可以直接调原生。HTML5+和Native.js的组合形成了最强大的能力引擎。 而phonegap需要用原生工程师写原生插件并给js开发者封装接口才能实现js调原生能力，开发成本、对人的要求都不一样。当然5+ 也支持原生插件，这点和phonegap类似。一个已经写好的原生sdk，无需使用Native.js重写，也可以通过5+ sdk来集成。详见文档中心 & 5+ App & 5+ SDK5+的直接封装的跨平台api比较全，二维码、摇一摇、地图、微信分享、语音输入、推送这些常用api都是跨平台的，使用方便简单。详见 http://www.html5plus.org/再看性能：phonegap做的app，在低端Android手机上很难流畅运行，否则HTML5早就火了，原生开发早就被挤压了。Phonegap为了避免HTML5的体验不佳，采用了spa模式，但这个模式其实在低端机上也玩不转，而且代码非常复杂。5+ App的性能更高，它的动态效果都是被我们的增强引擎处理的，通过增强的引擎，可以在低端机上流畅的运行各种动态效果，比如侧滑菜单、下拉刷新、长列表滚动，见 官网首页 & App选项卡- 性能视频最后看开发便利性：phonegap没有专业开发工具，语法提示、调试、打包都很麻烦。而在HBuilder里，5+的语法api提示非常完善；把手机通过数据线连上电脑，HBuilder可以真机运行，保存一个页面立即在手机上看到效果，Android上还可以看console.log。而用phonegap，你改完一个页面，不得不先打包，然后安装在手机上，然后发现不对，然后改下代码，然后继续打包。。。关于打包，phonegap由adobe提供了云打包，但需要先在本机准备资源，然后提交到国外的服务器，而HBuilder是一键打包，更加方便。当然phonegap和HBuilder都支持本地打包，那样就需要点原生开发知识了。除了工具和runtime，还有mui框架phonegap只是一个手机runtime，没有HBuilder工具，更没有Mui框架。mui是目前最接近原生App的HTML5框架，它的体验比jqm、bootstrap等框架更接近原生，它的性能远高于jqm、bootstrap、Ionic、framework7等框架。这种性能差别原因有2，一方面是设计思路不同，mui坚持用原生js做，不依赖jquery或angularjs，因为框架的依赖越多，App性能越差；另一方面是因为mui调用了5+的底层原生加速，这比不带原生加速的框架更快。mui详见：http://dcloudio.github.io/mui/当然phonegap有一个优势，就是能支持windows phone、blackberry，这方面5+确实没有支持。&优势：Dcloud的其他服务没具体用过，HBuilder用过，还是一个很不错的编辑器，整体体验还是不错，像代码提示很智能，基于Eclipse的二次开发能做出这样也挺厉害了。特别是对HTML语法支持浏览器兼容性很好。有个前端框架写CSS挺省事的。缺点：HBuilder Size太大，而且还得联网使用，整体体验还是Eclipse风格，相比我还是推荐使用Sublime。主要是做出了的应用就是网页的体验，这个实在是不适合用来做应用。做个WebApp还行。
最新教程周点击榜
微信扫一扫HBuilder_快速开发_开发组件、快速开发_API服务_API Store
所属分类：
快速开发、工具类
更新时间：
HBuilder是DCloud（数字天堂）推出一款支持HTML5的Web开发IDE。“快，是HBuilder的最大优势，通过完整的语法提示和代码输入法、代码块及很多配套，HBuilder能大幅提升HTML、js、css的开发效率。
1、HTML5语法、HTML5+语法、三大浏览器扩展语法，尽收HBuilder中。
2、每个浏览器发布新版后，一周内，其新增语法就收录入HBuilder。
3、怎么能忘记js框架，这里有强大到令你震惊的Jquery语法提示！
4、每个语法在哪个浏览器、哪个版本上是否可运行，这里都有。
5、没有比这里更全的语法库，也没有比这里更全的浏览器兼容性数据库。
1、飞一样的编码
2、手机App开发
3、震撼的语法提示
4、保护视力的界面
开发工具与文档
下载地址：您目前使用的浏览器该进博物馆啦~~~
为了更佳的浏览体验，请使用现代浏览器访问本站
Outdated Browser
您的浏览器已禁用 Javascript，启用它获得更好的体验。
Outdated Browser
这是为桌面用户准备的工具，但您可以安心在这里浏览
46.5% 的互联网用户在使用 此款浏览器
GOOGLE CHROME
支持如下操作系统
16.5% 的互联网用户在使用 此款浏览器
MOZILLA FIREFOX
支持如下操作系统
21.6% 的互联网用户在使用 此款浏览器
INTERNET EXPLORER
支持如下操作系统
10.3% 的互联网用户在使用 此款浏览器
APPLE SAFARI
支持如下操作系统
1.5% 的互联网用户在使用 此款浏览器
支持如下操作系统
冷静 这是为桌面用户提供的不是为手机用户提供的}