HBuilder是一款非常实用的编程工具,用户可以在HBuilder内进行编程,方便您可以制作出所需的代码样式。此外软件内还支持插件服务,帮助您在使用的时候可以有效的来导入插件。


仅10M的绿色发行包
2、极速
不管是启动速度、大文档打开速度、编码提示,都极速响应
3、清爽护眼
界面清爽简洁,绿柔主题经过科学的脑疲劳测试,是最适合人眼长期观看的主题界面
4、无鼠标操作
掌握HX的无鼠标操作体系,成为高效极客,飞一般编码
5、markdown优先
HX是唯一一个新建文件默认类型是md的编辑器。
除了顶尖的markdown编写体验、漂亮的着色外,HX的极速启动、多标签、热退出、各种快捷键操作,都给了你充足的理由升级记事本工具。


打开解压后的文件夹,找到一个叫做“Hbuilder.exe”的可执行文件,这个可执行文件就是Hbuilder的启动文件。

双击这个文件就可以打开Hbuilder这个开发编辑器了,因为我们是直接解压使用的所以找起来会很麻烦,你可以将“Hbuilder.exe”这个执行文件发送到桌面快捷方式,这样每次使用的时候直接在桌面就可以打开。

完成第六步之后,我们的桌面会出现一个Hbuilder的快捷方式,然后我们双击这个快捷方式,Hbuilder这个编辑器就打开了。


Hbuilder的使用
Hbuilder打开之后,会出现一些很人性话的设置,还有一点就是Hbuilder的编辑器风格是黄色系,对眼睛比较好,不同于其他的编辑器一般是以黑白为主,这里我一般使用标准模式。

视觉设置完成之后进入我们的项目建立阶段,点击“新建WEB项目”,创建项目名称,设置项目所在的位置确定即可,完成之后会在左边的项目栏管理器中出现。我这里创建的名称为demo。


打开项目demo的文件夹,我们会看到里面有首页index.html,有JS文件夹,有CSS文件夹,还有图片的文件夹,基本齐全。

到了这一步之后,我们便可以编写我们的代码了,在这里我就随便写了几句作为项目的演示。

代码的运行有两种方式,以下图为例,点击对应的浏览器之后回跳转到一个对应的页面。


当代码中有重要的标记出现时,会生成滚动条信息点,在滚动条右侧出现颜色各异的点。点击这些点或使用跳转到下一个信息点功能,可以快速到达这些代码处。如下标记会生成信息点:书签、任务、错误提示。

二、怎么实现代码追踪?
在编辑代码时经常会出现需要跳转到引用文件或者变量定义的地方,HBuilder提供了一个非常好用的代码追踪功能,只需要按住Ctrl+鼠标左键即可实现追踪。
三、输入small不提示,语法库是不是不全?
代码块是否提示,取决于是否设置了这个代码块,代码块是可自定义的。默认没有预置small代码块,你也可以在代码块弹出界面点右下角的编辑图标,进行代码块的补充修改。另外可以使用emmet(ZenCoding)语法,这个没有提示,但敲完small,按tab,就会自动生成标签。emmet是一种前端公开技术,网上教程很多。
四、为什么有时候我输入代码块的名称,却没有出现想要的代码块?
代码块的显示名称和激活字符是不同的,查看激活字符请在激活代码助手后选择代码块,看右边信息栏的详情
五、编辑器怎么实现分栏?
HBuilder编辑器分栏功能可以实现左右分栏和上下分栏以及组合分栏。
1、左右分栏实现:鼠标点着编辑器选项卡往最右边拖动即可实现左右分栏。

左右分栏实现效果:

2、上下分栏实现:鼠标点着编辑器选项卡往最下边拖动即可实现上下分栏。

上下分栏实现效果:

3、组合分栏实现:组合分栏就是即有的文件向下拖动,有的文件向右拖动,下面给出一个效果图,感兴趣的话您可以拖个试试。

修复了代码助手在窗体右边缘时被遮挡、自闭合标签回车缩进错误等问题
【App插件】快应用真机运行基座升级到1.0.13
【App插件】更新小程序to快应用/UniApp转换器
【重要】小程序to快应用/UniApp转换器开源了!

【软件介绍】
HBuilder是数字天堂推出的一款支持HTML5的Web开发IDE。HBuilder的编写用到了Java、C、Web和Ruby,其核心主体是由Java编写的,基于Eclipse所研发,顺其自然地兼容了Eclipse大量的插件,也是目前受到广泛开发者的认可和使用,其功能性和操作性都是市面上最出众之一。
【软件特色】
1、轻巧仅10M的绿色发行包
2、极速
不管是启动速度、大文档打开速度、编码提示,都极速响应
3、清爽护眼
界面清爽简洁,绿柔主题经过科学的脑疲劳测试,是最适合人眼长期观看的主题界面
4、无鼠标操作
掌握HX的无鼠标操作体系,成为高效极客,飞一般编码
5、markdown优先
HX是唯一一个新建文件默认类型是md的编辑器。
除了顶尖的markdown编写体验、漂亮的着色外,HX的极速启动、多标签、热退出、各种快捷键操作,都给了你充足的理由升级记事本工具。

【使用教程】
首先从本站进行下载,文件下载完后才能之后得到是一个压缩包,然后我们进行解压会得到一个文件夹,随便说一句这个文件夹就是Hbuilder的文件包,Hbuilder不用安装解压完成即可使用。
打开解压后的文件夹,找到一个叫做“Hbuilder.exe”的可执行文件,这个可执行文件就是Hbuilder的启动文件。

双击这个文件就可以打开Hbuilder这个开发编辑器了,因为我们是直接解压使用的所以找起来会很麻烦,你可以将“Hbuilder.exe”这个执行文件发送到桌面快捷方式,这样每次使用的时候直接在桌面就可以打开。

完成第六步之后,我们的桌面会出现一个Hbuilder的快捷方式,然后我们双击这个快捷方式,Hbuilder这个编辑器就打开了。


Hbuilder的使用
Hbuilder打开之后,会出现一些很人性话的设置,还有一点就是Hbuilder的编辑器风格是黄色系,对眼睛比较好,不同于其他的编辑器一般是以黑白为主,这里我一般使用标准模式。

视觉设置完成之后进入我们的项目建立阶段,点击“新建WEB项目”,创建项目名称,设置项目所在的位置确定即可,完成之后会在左边的项目栏管理器中出现。我这里创建的名称为demo。


打开项目demo的文件夹,我们会看到里面有首页index.html,有JS文件夹,有CSS文件夹,还有图片的文件夹,基本齐全。

到了这一步之后,我们便可以编写我们的代码了,在这里我就随便写了几句作为项目的演示。

代码的运行有两种方式,以下图为例,点击对应的浏览器之后回跳转到一个对应的页面。


【常见问题】
一、什么叫滚动条信息点?当代码中有重要的标记出现时,会生成滚动条信息点,在滚动条右侧出现颜色各异的点。点击这些点或使用跳转到下一个信息点功能,可以快速到达这些代码处。如下标记会生成信息点:书签、任务、错误提示。

二、怎么实现代码追踪?
在编辑代码时经常会出现需要跳转到引用文件或者变量定义的地方,HBuilder提供了一个非常好用的代码追踪功能,只需要按住Ctrl+鼠标左键即可实现追踪。
三、输入small不提示,语法库是不是不全?
代码块是否提示,取决于是否设置了这个代码块,代码块是可自定义的。默认没有预置small代码块,你也可以在代码块弹出界面点右下角的编辑图标,进行代码块的补充修改。另外可以使用emmet(ZenCoding)语法,这个没有提示,但敲完small,按tab,就会自动生成标签。emmet是一种前端公开技术,网上教程很多。
四、为什么有时候我输入代码块的名称,却没有出现想要的代码块?
代码块的显示名称和激活字符是不同的,查看激活字符请在激活代码助手后选择代码块,看右边信息栏的详情
五、编辑器怎么实现分栏?
HBuilder编辑器分栏功能可以实现左右分栏和上下分栏以及组合分栏。
1、左右分栏实现:鼠标点着编辑器选项卡往最右边拖动即可实现左右分栏。

左右分栏实现效果:

2、上下分栏实现:鼠标点着编辑器选项卡往最下边拖动即可实现上下分栏。

上下分栏实现效果:

3、组合分栏实现:组合分栏就是即有的文件向下拖动,有的文件向右拖动,下面给出一个效果图,感兴趣的话您可以拖个试试。

【更新日志】
修复搜索到折叠区域时,折叠不展开的bug修复了代码助手在窗体右边缘时被遮挡、自闭合标签回车缩进错误等问题
【App插件】快应用真机运行基座升级到1.0.13
【App插件】更新小程序to快应用/UniApp转换器
【重要】小程序to快应用/UniApp转换器开源了!

