我发起了一个 .Net 开源 跨平台 GUI （界面开发框架）项目 HtmlSharpCore

Posted 2021-01-02 凯特琳

大家好 ， 我发起了一个 .Net 开源 跨平台 GUI （界面开发框架）项目 ， 名字叫 htmlCore  。

项目的一个主要目标是可以用 .Net 在 移动设备 上 开发 GUI 程序 （界面程序） 。

 

欢迎 熟悉 C++ 和 操作系统 编程 的 网友加入 。 

我对 C++ 和 操作系统 编程 不熟 ， 需要有了解这部分的人 ， 负责 将 .Net Core 移植 到 android 和 ios 。

这个基础好了 ， 我们就可以用 C# 来开发 界面框架 。

 

界面框架 嘛 ， 不算太难 。

主要可以分为 这样 几个 部分 ：

1  界面描述语言

2  渲染

3  事件模型

 

O   了 。

 

界面描述语言 我打算采用  Html + Css + C# ， C# 作为 脚本语言 。

Xaml 是一个繁琐的 东东， 除了发明它的人 ， 没人知道那是什么 。

javascript 我想大家也受够了 。 用 C#  吧 。     ^^  ^^  ^^

 

界面描述语言的部分 涉及 编译原理 语法分析 ， 可以参考我之前写的 项目   SelectDataTable    https://www.cnblogs.com/KSongKing/p/9455216.html    ，  可以解析简单的 Sql 语句 ， 用 Sql 来查询 DataTable 里的数据 。

渲染 就是 GDI 编程 ， 或者说 调用 Android 和 iOS 的 原生界面接口 。

事件模型 ， 自己设计 ， 想怎么玩就怎么玩 。 不过 Html 的 事件模型 差不多 了 。

 

虽然说是 Html ， 但不是照搬 Html ， 我们只会实现一些 有用 常用 的 标签 和 样式 。 同时 ， 我们还要 增加一些 新的 标签 和 样式 ， 用于支持 Android 和 iOS 的 原生界面接口 。 

我们 沿袭一些 常用的 Html 标签 和 样式 ， 同时 继承 和 发扬 Html  简单明了 、 老少皆宜 、 妇孺皆知 、 多年以来深受人民群众喜爱   的  优良传统  。

 

只要 把  .Net Core 移植到 Android 和 iOS ， 想怎么玩都可以 。

 

我们接着来讨论一下具体的做法 。

 

首先， 我们不是 照搬 Html， 我们只会 沿用 Html 里的 div 和 span 这两个 标签（元素） 。

我们会定义一个 根元素 Window， 这表示一个 窗口 。

还会定义一个 元素 Drag， 这表示一个可以用鼠标拖动的元素， 拖动它的时候， 窗口（Window） 会跟着一起移动 。 可以用 Drag 元素 来 实现 自定义窗口， 比如 仿 360 窗口 。

还会定义一个 元素 Button， 这表示一个 按钮 。

事实上 Button 可以通过 div 来定制 。等， 在 HtmlCore 里， div 和 span 的 首字母 要大写， 叫 Div 和 Span 。

在 HtmlCore 里， 每个 元素（标签） 对应 一个 类（Class） 。 比如 Div 对应 Div 类， Span 对应 Span 类， Window 对应 Window 类， Drag 对应 Drag 类 。

在 Div 里 通过 嵌套 其它元素 （比如 Div 或者 Span） 可以实现 自定义效果 的 按钮 。

开发者 可以 override Div（或者 其它元素） 的 OnPaint() 和 OnPaintBackGround()   方法 来 扩展显示效果 。

通过 元素嵌套 来实现自定义效果 这类似于 WPF 。 还记得 WPF 入门教程 的 那个 “播放按钮”（Play Button） 吗 ？    ^^

HtmlCore 也会有样式表， 但不是在 元素 里用 “Style” 属性表示 的 样式表 。 而是 可以在一个 样式表 中定义样式 并将 样式统一应用到 一组元素 上 。其实就是 Html 里的 Css 里的 选择器 类似这样的 。

HtmlCore 的 样式表 可以直接对 元素 的 属性 进行 设置 。 也就是说， 我们 舍弃了 “Style‘ 属性， 所有的 样式 都直接作为 元素 的 属性， 比如 Color， Font ， BackColor     等等， 类似 WinForm 。

HtmlCore 的 样式表 的 作用 是 避免 重复的 对 元素 设置 样式 。

元素的 事件， 我们大致可以 沿袭 Html， 也可以吸收一些 WinForm 的 习惯 。

比如 可以定义 OnClick， OnMouseClick， OnMouseOver， OnMouseLeave， OnMouseMove， OnKeyDown， OnKeyUp     ……

 

好的， 这是 架构 。

 

接下来看看 具体 的 实现， 我们先 以 Windows 平台 上的 实现 为例 。

在 Windows 平台上， 我们会优先原则 基于 WinForm ， 即 以 WinForm 作为 底层架构 。

WinForm 本身是 ”原生“ 的， 另外 WinForm 封装 和 实现了 很多东西， 可以减少我们的 工作量 。

当然， 大家要 调用 更加 底层 的 接口， 这也是好的 。

有关 WinForm 的扩展， 可以参考我之前写的一个项目 《WinFormEx》    https://www.cnblogs.com/KSongKing/p/9455273.html 

对 WinForm 的扩展， 主要是 GDI+ 绘图 和 事件冒泡 。

 

具体的 编程方法 是 ：

Window 有一个 Load( htmc 文件 ) 方法， 可以加载 htmc 文件， 返回一个 对应的 Window 对象 。

HtmlCore 的 “Html” 文件 扩展名 定义为 “htmc” 。

比如 ：

Window win = Window.Load( "aa.htmc" );

Div div1 = win.Get<T>("div1");

Window 有一个 Get<T>(string id) 方法， 可以查找取得 Window 里的 子元素， 跟 Html 里的 document.getElementById( id ) 差不多 。

所有的 子元素 都在 Window 这一层 统一查找， 也就是说， 只有 Window 有 Get<T>( id ) 方法， 其它元素是 没有 Get 方法的 。

这里不搞 Asp.net 和 WinForm 那样的 Partial Class 之类的将 控件 变成 类的 字段 这样的 做法 。

这样会发明太多 新规则， 使得 HtmlCore 从 规则 到 实现 都很复杂， 难于推广 。

这没必要 。

win.Get<T>( id )    很简明实用 。 这也算是 Html 的一个 优良传统 吧  ？！       呵呵呵

 

然后， 可以类似 WinForm， 再写一个 Application 类， 可以  

Applicatiion.Run( win );

就 O 了 。   

 

有网友说 Drag 应该做成 属性 （而不是标签）， 好吧， 那就把 Drag 设计为 属性 吧 。

每个 元素 都有一个 Drag 和 DragJoin 属性， Drag = true;    这表示可以拖动， 设置了 Drag = true;   ， 就可以用 鼠标 拖动 元素了， 不需要自己写代码实现 。

DragJoin = "元素1, 元素2, 元素3,  ……"   ， 表示 和 元素 联动 的 元素 有哪些 。 联动 是指， 拖动元素时， 参与联动的元素会跟着一起移动 。

"元素1, 元素2, 元素3,  ……"    是 参与联动的 元素 的 ID 。

这个效果 可以实现 自定义标题栏 （如 仿 360 窗口） 和 其它 的 一些效果 。