混合App开发,HBuilder开发移动App

使用HBuilder开发混合App:

Hbuilder:是一个在线打包工具,不需要在本地配置开发环境;直接将做好的网站,通过一些简单的操作,就能在线打包为一个App;

混合APP开发常见技术:Html5+、ReactNative、Weex、Ionic;这里使用HTML5+ 开发混合APP,它是一个强大的产业联盟。下面是使用HTML5+结合HBuilder开发混合app的步骤:

1.打开HBuilder编辑器,找到:文件–>新建–>移动App点击,如图:
在这里插入图片描述
2.在弹出的配置中配置相关信息后点击完成(需要注意的是下面应用名称即项目名称,实际显示在移动端桌面的app名称并非这里设置,但是建议与这里名称一致),如图:
在这里插入图片描述
3.此时会在桌面看到testapp,之后在HBuilder中继续找到testapp项目,如图:
在这里插入图片描述
4.如果在第三步骤结束后无法打开testapp项目文件夹,就需要打开项目管理器(HBuilder编辑器顶部–>跳转–>跳转到项目管理器),此时会在工作区看到testapp项目,如图:
在这里插入图片描述
5.在项目管理器中双击打开testapp项目文件夹,并双击打开manifest.json文件,此时会看到一个配置信息的弹框,这里配置信息分多个页面配置,首先看 应用信息 配置页面如图:
在这里插入图片描述
图标配置:
在这里插入图片描述
启动图配置:
在这里插入图片描述
6.如果是一个简单的应用,后面的配置项没有必要再进行配置;此时将testapp中的index.html删除,并将已经开发好的web页面复制粘贴到本项目中(注意web页面各文件引用资源路径问题),如下图将web项目中的index.html和main.js移动到testapp项目中:
在这里插入图片描述
7.如果上面步骤都顺利的话,需要保存manifest.json文件(底部代码视图 Ctrl + S,如果忘记保存也没事,后面发行时会有弹框提示,点击确认即可);现在就可以利用HBuilder的相关功能进行打包发行(特别强调:如果项目存在安全问题,不建议使用HBuilder打包发行,因为自己项目源代码会发布在HBuilder平台上,虽然明确说明不会泄露源码,但还是不建议这样做),下面将一个无安全隐患的testapp发行打包,如图:
在这里插入图片描述
8.点击完云打包后会弹出打包相关选项(忘记保存manifest.json文件会多弹一个保存manifest.json文件的弹框),勾选配置项如图:
在这里插入图片描述
9.点击打包后,会弹出一个询问是否有权限漏选弹框,根据实际情况点击;之后会进行打包(第一次打包可能会弹出认证的情况,根据弹框提示网址进入网站,上传身份证等资料实名认证即可),认证成功的情况下,继续打包可看到如下:
在这里插入图片描述
10.此时根据提示拿到安装包,如:
在这里插入图片描述
11.移动app安装包实际是在项目文件夹unpackage下release文件夹中,此时将这个后缀为apk的文件发送到手机等设备安装(通过QQ等工具可发送到手机),如下图为后缀为apk文件位置:
在这里插入图片描述
12.安装完成后效果如下图:
在这里插入图片描述

提示:本文图片等素材来源于网络,若有侵权,请发邮件至邮箱:810665436@qq.com联系笔者删除。
笔者:苦海

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/575280.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

fanuc roboguide_ROBOGUIDE软件:机器人产线输送带输送物料虚拟仿真操作

概述输送带在机器人生产线或工作站中是常见的物料传送设备,它能够将物料从一个工位自动传送到另一个工位,是实现自动化生产制造必不可少的装置设备之一。虚拟仿真是对真实的工业机器人生产线或工作站的图形化再现,因此,对于具有输…

双电阻差分电流采样_小小的采样电阻,还真有点门道!

电流检测电阻的基本原理根据欧姆定律,当被测电流流过电阻时,电阻两端的电压与电流成正比.当1W的电阻通过的电流为几百毫安时,这种设计是没有问题的.然而如果电流达到10-20A,情况就完全不同,因为在电阻上损耗的功率(PI2xR)就不容忽视了.我们可以通过降低电阻阻值来降低功率损耗,…

jpa in查询_优选在shopee虾皮怎么发货价格查询皮皮虾云仓

优选在shopee虾皮怎么发货价格查询皮皮虾云仓皮皮虾云仓物流系统为现代化管理系统,可集中化,高效化的处理本土店物流订单。物流系统可对接主流的的电商平台ERP可以实现高效的订单处理。如lazada,shopee,1688、速卖通、eaby、shopi…

html5+、ReactNative、Weex、Ionic之间的区别、(配置java、python、Android环境)、ReactNative(react-native-cli)、yarn、Weex

html5、ReactNative、Weex、Ionic之间的区别: html5和Ionic: 在开发原理上基本相同,都是需要先开发出一个完整的网站,再通过html5或Ionic提供的打包技术对网站进行打包成移动app,它们实际还是一个网站,并非…

delphi listview失去焦点后的颜色_阴阳师姑获鸟和惠比寿建模更新对比 爷爷帅了 觉醒后鸟姐颜值提升...

阴阳师体验服近期更新了人气式神姑获鸟还有惠比寿的相关建模,本次特别奉上有关这两位式神的建模形象对比图,对比后发现经过修改和优化之后,爷爷更帅了,而觉醒后的鸟姐颜值也有所提升,一起来看看吧。惠比寿觉醒前觉醒前…

kibana 显示 @timestamp 时间问题(utc or browser当前时间)自动转换显示

https://github.com/elasticsearch/kibana/issues/95 可以统一timestamp时间字段为当前信息时区的时间! http://www.elasticsearch.org/guide/en/elasticsearch/reference/current/mapping-date-format.html 转载于:https://www.cnblogs.com/sunxucool/p/3939701.ht…

React简介、虚拟DOM、Diff算法、创建React项目、JSX语法、组件、组件声明方式、组件传值props和state、组件的生命周期

React简介: 前面只是简单介绍移动APP开发,后面还会继续深入介绍移动app开发;其中想要用ReactNative开发出更出色的应用,那么就得学好React,下面将介绍React: React 是一个由 Facebook 开发用于构建用户界…

去掉 edittext 长按全选_开封消毒湿巾全选

开封消毒湿巾全选   其实,带有杀菌效果的清洁产品大多通过降低微生物的繁殖力达到预期的杀菌效果,所添加的每种杀菌成分都针对特定细菌,无法杀灭所有细菌。如果产品中的杀菌剂浓度总是不能将细菌完全杀灭,就可能导致细菌对该类杀…

代数余子式之和怎么算_小明说养老 | 养老金怎么算之月平均缴费指数怎么来的?...

上一期小明分享了企业职工养老保险退休待遇怎么算,具体可戳小明说养老|养老金怎么算?小明来教你。在以张阿姨为例的计算举例中,提到张阿姨15年的平均缴费指数为0.8209。对这个平均缴费指数的概念提问较多,今天就来解释一下月平均缴…

ReactNative简介、开发环境、调试、常用组件、useState状态、FlatList组件、SectionList组件、Platform 模块、定义样式、图片组件、触摸事件、打包apk发布版

ReactNative简介: ReactNative是基于React语法来进行开发移动app的框架; ReactNative中提供了移动端专用的一些组件,我们要使用ReactNative固有的组件代替网页中使用的一些元素,如:div, p, img 都不能用了&#xff1…

odis工程师使用方法_傅里叶红外光谱仪常见故障维修及排除方法,你了解有多少种呢?...

傅里叶红外光谱仪在使用过程中难免会出现故障,那我们该怎么检修呢?赛默飞傅里叶红外光谱仪有些光谱仪器的使用说明书会给出光谱仪的常见故障及排查方法,有些光谱仪器还有自诊断功能,当傅里叶红外光谱仪不能正常工作时,…

微信小程序简介、发展史、小程序的优点、申请账号、开发工具、初识wxml文件和wxss文件

微信小程序介绍: 小程序简介: 小程序是一种连接用户与服务的方式,它能在微信内被便捷地获取和传播,具有出色的使用体验。 不需要下载安装,用户通过搜一搜或扫一扫就可以打开使用,使用完后退出即可。 小…

tia v15 添加项目_硬技能,TIA 博途软件界面的介绍

在前面的文章中给大家介绍了TIA 博途软件的安装包等介绍,这次小编给大家介绍一下TIA 博途软件的界面。#电工学习PLC#你知道吗,在博途软件的自动化项目任务的创建中,我们可以使用portal视图和项目视图。Portal视图是面向任务的视图&#xff0c…

UIImagePickerController按钮的中文问题

UIImagePickerController按钮的中文问题 执行以下两步即可 1. 在targets中设置region为China 2. 在project中添加支持中文 转载于:https://www.cnblogs.com/YouXianMing/p/3935460.html

rsatool使用步骤图解_工作中想要事半功倍?图解来助你

一次会议上,老板让我们进行一场头脑风暴,然后将脑中浮现出来的想法以ppt的形式,在会议上与大家分享。在会上我看到其他区域的同事做的ppt,真的叫一个精美啊,有图形对比、有案例分析、有未来展望。反观自己的&#xff0…

ZRender源码分析2:Storage(Model层)

回顾 上一篇请移步:zrender源码分析1:总体结构 本篇进行ZRender的MVC结构中的M进行分析 总体理解 上篇说到,Storage负责MVC层中的Model,也就是模型,对于zrender来说,这个model就是shape对象,在…

java语言概述、java语言特性、java语言发展史、java语言作用

Java介绍: Java语言概述: Java语言是由美国Sun(Stanford University Network)斯坦福网络公司的java语言之父–詹姆斯高斯林,在1995年推出的高级的编程语言。所谓编程语言,是计算机的语言,人们…

电脑显示器不亮主机正常_电脑主机已开机 显示屏却不亮(看完秒懂)

台式电脑是工作的得力助手,我们用的是软件,但是如果硬件出问题了,就无法工作了。有时会遇到台式电脑开机,主机开了,但是屏幕却不亮,是怎么回事呢?现在,笔者告诉大家怎样一步步查明原…

二进制的认识、进制之间的转换、计算机储存单位

二进制: 计算机中的数据不同于人们生活中的数据,人们生活采用十进制数,而计算机中全部采用二进制数表示,它只包含0、1两个数,逢二进一,如:1110。每一个0或者每一个1,叫做一个bit&am…

.net一个函数要用另一个函数的值_VLOOKUP函数

两个表格顺序不同,如何匹配合并?如下图:常常遇到有人问我,两个表格需要按照人名合并起来,但是两表的人名顺序并不相同,怎么处理呢?这个就要用到EXCEL大名鼎鼎的VLOOKUP函数了。具体语法如下&…