QZhi 发表于 2024-2-4 22:42:50

【不止 VB】 QZhi HTML Editor:一个简易的 HTML 编辑器

本帖最后由 QZhi 于 2024-2-5 19:34 编辑

QZhi HTML Editor 简介

QZhi HTML Editor 是一款轻量级的所见即所得编辑器,可用于编辑 HTML4 文档。您可以轻松快捷地编辑 HTML4 文档。此外,它还是快速生成小型网页的完美工具。使用 QZhi HTML Editor,您可以同时解决多项任务:

[*]以所见即所得的方式编辑 HTML 文档
[*]在同一窗体内设计网页/编辑源码/预览网页


本软件采用 Microsoft® Visual Basic® 6.0 语言编写,使得本软件较其他同类软件(如 BlueGriffon)更快速、更便捷。

软件特性


[*]以所见即所得的方式编辑 HTML 文档。
[*]无需编码,直接插入控件。
[*]Unicode 支持。
[*]多窗体操作,十分便捷。


系统需求

硬件需求

[*]处理器:166 MHz 或更快。
[*]内存:至少 128 MB。
[*]硬盘:至少 10 MB 空余。
[*]显示屏:24 位色 Super VGA (1024 x 768) 或更高分辨率的监视器。

软件需求

[*]Microsoft® Windows® 2000 及更高版本的 Microsoft® Windows® 操作系统。
[*]Microsoft® Internet Explorer® 5.5 及更高版本的 Microsoft® Internet Explorer® 网络浏览器。
[*]Microsoft® Visual Basic® 6.0 运行库。
[*]Microsoft® Windows® Common Controls 5.0 控件集。(一定要用 5.0 版!)


注:
不建议您在 Windows 9x 上安装本软件,您应在支持 Unicode 的 Microsoft® Windows NT® 上安装本软件。

截图


下载链接
https://github.com/QZhiStudio/QZhi-HTML-Editor/

灵感来源

Visual J++ 6.0 的 HTML 编辑器

又及:
本程序仅做抛砖引玉的尝试,在这个程序的基础上,您可以制作出 CHM 编辑器、Markdown 编辑器、BBCode 编辑器、LaTex 编辑器……
此外,作为一个英语一般、编程水平普通的初中学生,我的代码显然是存在很多不足之处的,如果我的程序有不足之处,恳请您指出。
谢谢!

美俪女神 发表于 2024-2-8 21:33:24

不知道你是否可以获取/设置“源码”选项卡里那个TEXTBOX的内容。如果可以的话,给控件添加事件对应的JS函数名称应该很简单。

我发现你把所有窗口都融为一体了,很好。建议你把左边控件栏的宽度和下边信息栏的高度做成可调节的,防止在小屏幕电脑上碍眼。

每次看到“设计-源码-预览”这三联装选项卡时,我就想起了2001年的夏天,我在有冷气机的小学“多媒体计算机教学室”里使用FrontPage设计网页的情形。

美俪女神 发表于 2024-2-5 21:27:40

你那个comctl32.ocx的版本是1.4的,VB6SP6自带的好像不是这个版本,导致VBP打开时报错。只要把VBP文件里的这一行:Object={6B7E6392-850A-101B-AFC0-4210102A8DA7}#1.4#0; comctl32.ocx改为:Object={6B7E6392-850A-101B-AFC0-4210102A8DA7}#1.3#0; comctl32.ocx就能在默认安装了VB6SP6的系统上打开了,编译自然也是没问题的。

美俪女神 发表于 2024-2-5 17:41:53

你真的是初中生吗?这个软件的水平已经超过很多大学软件制作比赛的作品了。
顺带说两个建议:
1、软件界面改为MDI,不要用SDI。或者干脆就用“单窗口+窗口内的虚拟小窗口”。
2、给控件增加事件处理流程。比如可以给按钮添加个处理CLICK事件的JS代码。

戈登走過去 发表于 2024-2-5 10:20:57

哇,好酷!
(这两个截图我都爱了

QZhi 发表于 2024-2-5 12:18:04

QZhi HTML Editor Version 1.0.184 Beta
本版本修复了 QZhi HTML Editor Version 1.0.179 Beta 的已知问题。

[*]修复了因 IE 速度过快而打印空白文件的问题。
[*]修复了在编辑模式下仍打印网页而非源码的问题。
[*]修改了帮助文件中的个别错字。

下载地址:https://github.com/QZhiStudio/QZhi-HTML-Editor/releases/tag/v1.0.184-beta

QZhi 发表于 2024-2-5 12:19:33

戈登走過去 发表于 2024-2-5 10:20
哇,好酷!
(这两个截图我都爱了

其实我也没想到扁平风格的 Visual Studio 2022 图像库在拟物化的 Windows Vista 里竟然没有违和感……

QZhi 发表于 2024-2-5 13:58:37

QZhi HTML Editor Version 1.0.191 Beta
本版本修复了 QZhi HTML Editor Version 1.0.184 Beta 的已知问题。

[*]修复了没有及时销毁类的问题。
[*]修复了在预览模式下文件正在加载时无法写入的问题。
[*]修复了打开新页面时会新建 IE 窗口的问题。

gujin163 发表于 2024-2-5 15:04:11

啥也不说了,帖子就是带劲!

美俪女神 发表于 2024-2-5 18:09:09

从GITHUB上下载你的工程并打开,会提示找不到COMCTL32.OCX,你可以在一个只安装了VB6的干净虚拟机里试试。

顺带说句,你可以用SetParent把其他小窗口的内容全部挪动到主窗口里,然后用SetWindowLong来修改窗口样式。这样子就可以把你的程序改为伪MDI效果。

我自制的IDE就是用的这种土办法配合TAB控件,实现了类似VS的效果(工程列表、查找、编译输出窗口就一个,代码编辑窗口有很多个)。

QZhi 发表于 2024-2-5 18:34:11

美俪女神 发表于 2024-2-5 18:09
从GITHUB上下载你的工程并打开,会提示找不到COMCTL32.OCX,你可以在一个只安装了VB6的干净虚拟机里试试。
...

啊!
我忘了,我用的是 VB5 的控件!(我懒得 CreateWindowExW)

QZhi 发表于 2024-2-5 18:35:31

本帖最后由 QZhi 于 2024-2-5 18:36 编辑

美俪女神 发表于 2024-2-5 17:41
你真的是初中生吗?这个软件的水平已经超过很多大学软件制作比赛的作品了。
顺带说两个建议:
1、软件界面 ...

把软件界面改成 MDI 还好处理,只要把
Begin VB.Form frmMenu
改成
Begin VB.MDIForm frmMenu
就行了

但是事件处理流程就不好处理了,如果真的要干,至少得做这几项工作:
1.获取网页的 element
2.遍历,依靠 id 获取每一个元素的 element
3.为每个 element 分配一个类
4.对每一个类进行事件处理

但是,并非所有的元素都是有 id 的。而且即使通过一定手段获取到了 element,也无法直接使用。
VB6 是没有 HtmlElement 类的(IHTMLElement 类也不支持直接处理事件),如果真要操作,得用不同的类,如 <input type="button"> 要使用 HTMLInputButtonElement 类或 HTMLInputElement 类。

像这样的类有这么多:

仅第三步就可以让整个软件的体积成倍增长,完成以上 4 个步骤约等于从 0 开始写一个 IDE。(又及:还要考虑 IE 的版本)

但这不是大问题,最坑的是有些 element 的事件根本无法获取!比如我在 frmCode 里定义的 eEditor 就始终无法获取到 onchange 事件。

所以,第二条建议我无法完成。

当然,以上只是我自己的见解,如有错误,恳请指出!

美俪女神 发表于 2024-2-5 19:03:12

QZhi 发表于 2024-2-5 18:35
把软件界面改成 MDI 还好处理,只要把

改成


你误解我的意思了。比如我手动在网页上添加了一个按钮Button1,你会自动在后台帮我编写了如下代码:
<input type="button" name="Button1" value="test"></input>
此时我又希望可以对Button1添加一个Click事件,希望你可以生成/修改为以下代码:
<script type="text/javascript">
function Button1_Click()
{
        alert("Button1_Click");
}
</script>
<input type="button" name="Button1" value="test" onclick="Button1_Click()"></input>

QZhi 发表于 2024-2-5 19:11:45

美俪女神 发表于 2024-2-5 19:03
你误解我的意思了。比如我手动在网页上添加了一个按钮Button1,你会自动在后台帮我编写了如下代码:

此 ...

第一个功能是目前有的,代码是由 IE 的生成器生成的,默认的效果是指派数字 ID。

至于第二个功能,我是真没有头绪……

美俪女神 发表于 2024-2-5 19:15:46

QZhi 发表于 2024-2-5 19:11
第一个功能是目前有的,代码是由 IE 的生成器生成的,默认的效果是指派数字 ID。

至于第二个功能,我是 ...

对啊,我就是看到了有第一个功能,才希望有第二个功能。

不过我没仔细看你的代码,我以为HTML代码是你自己生成的,没想到是IE帮生成的。

目前没有头绪也也没关系,你还年轻,来日方长,有兴趣的话就慢慢研究吧。

QZhi 发表于 2024-2-5 19:28:04

美俪女神 发表于 2024-2-5 19:15
对啊,我就是看到了有第一个功能,才希望有第二个功能。

不过我没仔细看你的代码,我以为HTML代码是你自 ...

我又看了一下 Visual J++ 的 HTML 编辑器,大概有了想法:

1.遍历 MSHTML 库,记录所有的类
2.依次遍历每一个类,将每一个方法、属性、事件记录在 TreeView 中
3.当用户选定一个控件,获取其 element 和 id
4.查看文档是否有 script 元素,如果没有就新建
5.将事件处理代码写入 script 元素

您有什么更好的建议吗?

QZhi 发表于 2024-2-5 19:31:57

美俪女神 发表于 2024-2-5 19:03
你误解我的意思了。比如我手动在网页上添加了一个按钮Button1,你会自动在后台帮我编写了如下代码:

此 ...

Visual J++ 的 HTML 编辑器是这样的:

QZhi 发表于 2024-2-8 12:00:01

QZhi HTML Editor Version 1.0.191 RC

[*] 修复了字符串转 HTML 实体得到负数的问题。
[*] 修复了打印源码和打印消息时不正确换行的问题。
[*] 修复了颜色选择器“取消”按钮按下没有反应的问题。
[*] 修复了“格式”菜单中“背景色”“前景色”按钮的图标在动态更改时模糊的问题。
[*] 修复了部分文档无法打印(预览)的问题。
[*] 修复了打印源码时不正确换行的问题。
[*] 修复了在低版本 IE 下消息列表无法自动滚动的问题。
[*] 修复取色器部分控件背景不透明的问题。
[*] 修复取色器初始化时不更新亮度条的问题。
[*] 修复取色器的“红色” Updown 控件因高度少 1 像素而渲染不全的问题。
[*] 改 SDI 界面为 MDI 界面。
[*] 更改了消息列表的字体。
[*] 新增了 WebBrowser.NavigateWarning 和 WebBrowser.NavigateError 两种消息类型。
[*] 增加了消息列表的保存和清空功能。

注:本版为 rc 版(但是帮助文档没有更新),如果没有错误,下一个版本将是正式版。

顺便放两张 MDI 版的图:

QZhi 发表于 2024-2-8 22:09:58

美俪女神 发表于 2024-2-8 21:33
不知道你是否可以获取/设置“源码”选项卡里那个TEXTBOX的内容。如果可以的话,给控件添加事件对应的JS函数 ...

获取/设置“源码”选项卡里那个TEXTBOX的内容是可以的(早在 1.0.179 版之前就可以做到了),但是添加函数的功能能这样干吗?我担心会把代码插到注释里头去。

美俪女神 发表于 2024-2-8 22:25:01

QZhi 发表于 2024-2-8 22:09
获取/设置“源码”选项卡里那个TEXTBOX的内容是可以的(早在 1.0.179 版之前就可以做到了),但是添加函 ...

你别老把我的帖子置顶啊,不然这个帖子的顺序都乱套了。

关于在什么位置插入JS,可以参考一下这个:https://www.runoob.com/js/js-howto.html
页: [1] 2
查看完整版本: 【不止 VB】 QZhi HTML Editor:一个简易的 HTML 编辑器