Hbuilder介绍,uniapp框架

Hbuilder对程序前端页面进行开发(包括android,ios,小程序,web等等),其实也就是相当于把android开发进行前后端分离了。方便分工协作。提高开发效率。

用前端框架开发可以实现一次编码,多平台运行。

!!!!!!

原生       Android               pc                       web

进阶       分离开发                                          分离开发

新建项目并直接在android真机上运行项目

  1. 新建项目,模板uni uni项目;数据线连接手机。
  2. 运行-运行到手机或模拟器-运行到android app 基座

发布:这是手机web发布,也可以以其他方式。

在HBuilderX工具栏,点击发行,选择网站-H5手机版,如下图,点击即可生成 H5 的相关资源文件,保存于 unpackage 目录。

Js模块,css样式文件导入:

局部注册:

普通页面文件进行导入就行

全局注册:

全局样式,在根目录下的app.vue里写入,每个页面都会加载app.vue里的样式。

全局导入vue组件(包括界面、js、样式的库), 在项目根目录下的main.js里处理

uni-app 2.7以后推出了更简单的组件使用技术easycom无需引用和注册组件,直接在template区域使用组件即可。


下为html标签和uni-app内置组件的映射表:

  • div 改成 view
  • span、font 改成 text
  • a 改成 navigator
  • img 改成 image
  • input 仅仅是输入框。 原html规范中input不仅是输入框,还有radio、checkbox、时间、日期、文件选择功能。在uni-app和小程序规范中,input仅仅是输入框。其他功能uni-app有单独的组件或API:radio组件、checkbox组件、时间选择、日期选择、图片选择、视频选择、多媒体文件选择(含图片视频)、通用文件选择。
  • form、button、label、textarea、canvas、video 这些还在。
  • select 改成 picker
  • iframe 改成 web-view
  • ul、li没有了,都用view替代。做列表一般使用uList组件
  • audio 不再推荐使用,改成api方式,背景音频api文档 其实老的HTML标签也可以在uni-app里使用,uni-app编译器会在编译时把老标签转为新标签,比如把div编译成view。但不推荐这种用法,调试H5端时容易混乱。

除了改动外,新增了一批手机端常用的新组件

  • scroll-view 可区域滚动视图容器
  • swiper 可滑动区域视图容器
  • icon 图标
  • rich-text 富文本(不可执行js,但可渲染各种文字格式和图片)
  • progress 进度条
  • slider 滑块指示器
  • switch 开关选择器
  • camera 相机
  • live-player 直播
  • map 地图
  • cover-view 可覆盖原生组件的视图容器

cover-view需要多强调几句,uni-app的非h5端的videomapcanvastextarea是原生组件,层级高于其他组件。如需覆盖原生组件,则需要使用cover-view组件。详见层级介绍

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

人工智能极简史:一文读懂ChatGPT的前世今生

2022年11月30日,OpenAI推出的一款人工智能技术驱动的自然语言处理工具——ChatGPT,迅速在社交媒体上走红,短短5天,注册用户数就超过100万。 2023年1月末,ChatGPT的月活用户已突破1亿,一度成为史上增长最快的…

网站定制开发的流程|软件app小程序开发定制

网站定制开发的流程|软件app小程序开发定制 网站定制开发是一个为个体或企业创建定制化网站的过程。它涉及到规划、设计、开发和测试等一系列步骤,以满足客户的需求和目标。下面是网站定制开发的基本流程。 1. 需求分析:首先,与客户沟通并了解…

Netty Review - 快速上手篇

文章目录 基础概念官网Whats NettyWhy NettyAbout Netty Author & LeaderWhat can Netty doNetty开发流程Flow HL View客户端开发Handler客户端启动类 服务端开发Handler服务器端启动类 运行示例 基础概念 BIO、NIO和AIO这三个概念分别对应三种通讯模型:阻塞、…

Docker 中的端口

Docker 中的端口 0.0.0.0:8080->80/tcp ,主机(即运行 Docker 的机器)监听8080端口,如果有请求转发到容器的 80 端口上去。 详细解释一下: 0.0.0.0:8080->80/tcp :这是一个端口映射规则。 0.0.0.0:80…

【C语言 | 指针】C指针详解(经典,非常详细)

😁博客主页😁:🚀https://blog.csdn.net/wkd_007🚀 🤑博客内容🤑:🍭嵌入式开发、Linux、C语言、C、数据结构、音视频🍭 🤣本文内容🤣&a…

Django下的Race Condition漏洞

目录 环境搭建 无锁无事务的竞争攻击复现 无锁有事务的竞争攻击复现 悲观锁进行防御 乐观锁进行防御 环境搭建 首先我们安装源码包:GitHub - phith0n/race-condition-playground: Playground for Race Condition attack 然后将源码包上传到Ubuntu 为了方便使…

软板当然可以弯折啊,只是容易弯出问题而已

高速先生成员:黄刚 每次在介绍具体案例之前,都还是先铺垫下基础知识吧。今天讲的是一个软板的案例,我们循例先介绍下软板的概念。相信大多数的硬件工程师,PCB设计工程师或者测试工程师都见过,就是像下面的这些了。 它作…

openGauss学习笔记-118 openGauss 数据库管理-设置数据库审计-维护审计日志

文章目录 openGauss学习笔记-118 openGauss 数据库管理-设置数据库审计-维护审计日志118.1 前提条件118.2 背景信息118.3 操作步骤 openGauss学习笔记-118 openGauss 数据库管理-设置数据库审计-维护审计日志 118.1 前提条件 用户必须拥有审计权限。 118.2 背景信息 与审计日…

手写线性表C++ vector

目录 一、vector基本概念 1.1、构造函数 1.2、析构函数 1.3、插入元素 1.4、删除元素 1.5、重载运算符 二、完整代码 一、vector基本概念 C中的vector是一种动态数组,它可以根据需要自动调整大小。vector是C标准模板库(STL)中的一个容…

海康威视(iVMS)综合安防系统任意文件上传漏洞复现 [附POC]

文章目录 海康威视(iVMS)综合安防系统任意文件上传漏洞复现 [附POC]0x01 前言0x02 漏洞描述0x03 影响版本0x04 漏洞环境0x05 漏洞复现1.访问漏洞环境2.构造POC3.复现 0x06 修复建议 海康威视(iVMS)综合安防系统任意文件上传漏洞复…

中国银行模拟器app,用java设计框架,图片网上找的,提供代码,仅供娱乐

回执单生成器的Java程序需要涉及到一些基本的Java编程技能,包括创建类、处理用户输入和格式化输出。下面是一个简单的示例代码,用于生成一个简易的回执单。这个程序将接收用户的输入,然后生成一个格式化的回执单。 请注意,这个示…

解决Chrome无法自动同步书签

前提:(要求能正常访问google) 准备一个谷歌账号 安装Chrome浏览器 开启集装箱插件(或者其他能访问谷歌的工具) 步骤:(使用集装箱插件/能正常访问谷歌的其他工具) 下载安装使用“集…

Databend 开源周报第 119 期

Databend 是一款现代云数仓。专为弹性和高效设计,为您的大规模分析需求保驾护航。自由且开源。即刻体验云服务:https://app.databend.cn 。 Whats On In Databend 探索 Databend 本周新进展,遇到更贴近你心意的 Databend 。 用户案例&#…

故障演练 | 微服务架构下如何做好故障演练

前言 微服务架构场景中,应用系统复杂切分散。长期运行时,局部出现故障时不可避免的。如果发生故障时不能进行有效反应,系统的可用性将极大地降低。 什么是故障演练 故障演练是指模拟生产环境中可能出现的故障,测试系统或应用在…

HTML简单介绍

且视他人之疑目如盏盏鬼火,大胆地去你的夜路。 目录 1.网页 2.Web标准 3.HTML 3.1HTML结构 3.2HTML标签​编辑 4.标签介绍 4.1排版标签 4.2文本格式化标签 4.3媒体标签 4.3.1图片标签 4.3.2 音频标签 4.3.3视频标签 5.相对路径 6.链接标签 6.1target属…

【赠书第5期】AI时代项目经理成长之道:ChatGPT让项目经理插上翅膀

文章目录 前言 1 ChatGPT为项目经理带来便利 2 提供自动化的通知和提醒 3 提供数据分析和可视化 4 结论 5 推荐图书 6 粉丝福利 前言 在现代商业环境中,项目经理需要具备高度的灵活性和响应能力。而现在,随着技术的不断提升和新工具的涌现&#…

大厂设计师必备的8款Sketch插件

每个设计师都渴望有一个高效的插件来提高他们的设计能力。设计插件有助于自动化工作流程,快速组织设计文件或简化内容创建。Sketch可以说是设计师知名的设计工具,特别是其资源社区拥有丰富的Sketch插件,大大提高了设计师的工作效率。本文让设…

打开word文档报错,提示HRESULT 0x80004005 位置: 部分: /word/comments.xml,行: 0,列: 0

某用户遇到这样一个奇怪的问题,就是回复完word的批注后,保存文档再打开就会报错,提示很抱歉,无法打开XXX,因为内容有问题。,详细信息提示HRESULT 0x80004005 位置: 部分: /word/comments.xml,行: 0,列: 0 c…

解释tqdm模块显示进度条:

1. 在Python中&#xff0c;当你使用tqdm模块&#xff08;一个快速、可扩展的Python进度条库&#xff09;时&#xff0c;你可能会看到类似的输出&#xff1a;[6:20:38<6:34:14, 31.25s/it]。 这个输出提供了关于循环进度的详细信息&#xff1a; 6:20:38: 这是已经过去的时…