设计模式实战项目:Markdown 文本编辑器软件开发(已开源)
📌一、项目简介
项目名称:YtyMark-java
本项目是一款基于 Java 语言 和 JavaFX 图形界面框架 开发的 Markdown 文本编辑器。项目不仅具备 Markdown 文本编写、预览、保存、导出等功能,还特别关注软件架构设计的优雅性与可维护性。项目采用多种经典的 面向对象设计模式,实现了解耦、扩展性和高可读性的代码结构。
此外,项目已 开源,旨在为有志于掌握设计模式、文本解析与渲染的开发者提供实战参考。
为什么编写这个项目
纸上得来终觉浅,绝知此事要躬行。单独学习的设计模式始终是理论的学习,实践才是经验的来源,唯有经验才属于自己的。再者,因为很少看到专门用于练手设计模式的实战项目,所以才有了YtyMark-java
这个开源项目。该项目主要用于学习设计模式的实战项目,将所学的设计模式用于实战,在实战中领悟真谛。
🧠二、技术栈
-
编程语言:Java 8
-
桌面界面框架:JavaFX
-
构建工具:Maven
-
核心功能模块:
-
Markdown 文本解析器
-
Markdown 语法树(AST)构建
-
HTML 渲染器
-
可视化编辑器界面
-
-
使用的设计模式(12种):
-
组合模式:将markdown语法解析结果构建成AST节点树。
-
构建者模式:创建复杂解析器和渲染器。
-
状态模式:对markdown文本不同语法做一些前置处理,裁剪成块级元素。
-
责任链模式:按优先级匹配不同,在"流水线"上处理复杂的块级元素解析及嵌套解析。
-
策略模式:动态选择解析器完成行内元素的解析和工具界面样式的切换。
-
迭代器模式:通过迭代器结合递归来遍历节点树,比如遍历块级元素进行行内元素解析和节点树渲染操作。
-
中介者模式思想:加入AST节点树解耦解析器和渲染器的耦合,使其灵活地渲染成不同的文档。
-
访问者模式:负责分离节点数据与渲染操作,提高渲染的扩展性;在行内元素嵌套解析时使用访问者模式来解决嵌套调用问题,因为嵌套节点的文本字段是不同的。
-
工厂模式:样式的创建通过工厂模式来完成。
-
观察者模式:识别到主题发生变化时执行重新渲染操作;样式切换后,渲染的文字样式也需要同步调整,再结合监听器(观察者模式)来实现主题变化后重新渲染文本内容,除此之外JavaFX使用了大量的监听器。
-
装饰模式:对自定义基础弹框做定制化的扩展,实现不同场景所需的弹框。
-
命令模式:封装工具界面中的功能点及快捷键命令。
-
备忘录模式:负责实现撤销和恢复功能,实现精细到单字符的撤销/恢复机制。
-
📦三、功能模块与设计模式应用
1. Markdown 文本解析器
-
目标:将 Markdown 文本解析为语法树(AST)。
-
设计模式:
-
组合模式:表示 Markdown 语法结构(如段落、标题、列表)之间的树形结构。
-
构建者模式:创建复杂解析器和渲染器。
-
状态模式:对markdown文本不同语法做一些前置处理,裁剪成块级元素。
-
责任链模式:按优先级匹配不同,处理复杂的块级元素解析及嵌套解析。
-
策略模式:动态选择解析器完成行内元素的解析。
-
迭代器模式:通过迭代器结合递归来遍历节点树,遍历块级元素进行行内元素解析。
-
2. AST 渲染器
-
目标:将 AST 语法树渲染为 HTML 文本预览。
-
设计模式:
-
迭代器模式:通过迭代器结合递归来遍历节点树,比如遍历节点树完成渲染操作。
-
中介者模式思想:加入AST节点树解耦解析器和渲染器的耦合,使其灵活地渲染成不同的文档。
-
访问者模式:负责分离节点数据与渲染操作,提高渲染的扩展性;在行内元素嵌套解析时使用访问者模式来解决嵌套调用问题,因为嵌套节点的文本字段是不同的。
-
3. JavaFX 用户界面
-
目标:为用户提供可视化的文本输入、预览、保存、导出(PDF/HTML)和样式切换等功能。
-
设计模式:
-
策略模式:动态选择解析器完成工具界面样式的切换。
-
工厂模式:样式的创建通过工厂模式来完成。
-
观察者模式:识别到主题发生变化时执行重新渲染操作;样式切换后,渲染的文字样式也需要同步调整,再结合监听器(观察者模式)来实现主题变化后重新渲染文本内容,除此之外JavaFX使用了大量的监听器。
-
装饰模式:对自定义基础弹框做定制化的扩展,实现不同场景所需的弹框。
-
命令模式:封装工具界面中的功能点及快捷键命令。
-
备忘录模式:负责实现撤销和恢复功能,实现精细到单字符的撤销/恢复机制。
-
注:篇幅原因,功能的详细实现会在后续的文章中再娓娓道来。
📝四、文本处理流程图
🧩五、模块划分
项目分为两大模块:
-
UI界面(ytyedit-mark)
-
markdown文本解析和渲染(ytymark)
YtyMark-java
├── ytyedit-mark/
│ ├── src/
│ │ ├── main/
│ │ │ ├── java/
│ │ │ │ ├── editor/ # JavaFX UI 界面
│ │ │ │ ├── enums/ # Icon图标等
│ │ │ │ ├── utils/ # 资源读取等
│ │ │ │ ├── window/ # 自定义窗口(主窗口、弹框)
│ │ │ │ ├── RenderMarkdown # 解析和渲染
│ │ │ │ ├── YtyEditApplication # 主程序入口
│ │ │ └── resources/
│ │ │ └── css/ # 主题样式(CSS)
│ │ │ └── fonts/ # 字体集
│ │ │ └── images/ # 图片
│ ├── README.md
│ └── pom.xml
│
├── ytymark/
│ ├── src/
│ │ ├── main/
│ │ │ ├── java/
│ │ │ │ ├── annotation/ # 自定义注解
│ │ │ │ ├── enums/ # 枚举值
│ │ │ │ ├── node/ # 树节点(块级和行级节点)
│ │ │ │ ├── parser/ # 解析器(块级和行级元素)
│ │ │ │ ├── renderer/ # 渲染器(块级和行级元素)
│ │ │ └── resources/
│ │ │ └──
│ ├── README.md
│ └──pom.xml
├── pom.xml
└── README.md
📸 六、截图预览
白天模式的截图:
夜间模式的截图:
支持的语法截图:
🚀七、项目亮点
-
💡 高度模块化,任何 Markdown 语法都能独立添加/修改。
-
🧠 设计模式实战,适合做设计模式学习的项目。
-
🖥️ 可按需获取,用户界面和文本解析渲染分为两个模块
-
只使用用户界面源码,然后轻松切换成熟的解析器依赖,开发一个完整的markdown文本编辑器;
-
仅学习文本解析渲染模块源码,不用关注用户界面源码。
-
-
🧪 解析性能毫秒级,确保解析效率。
-
🎯 轻松上手,使用JDK8 自带JavaFX模块,无需做额外处理。
-
📦 开源项目,文档完善,方便学习和贡献。
🙌八、项目地址(GitHub)
欢迎提交 PR、Issue、Star ⭐️!
你也可以在 Issues 区提出你的建议或想法!
✏️九、总结
本 Markdown 文本编辑器项目不仅实现了文本解析与图形界面交互,还将多种设计模式融入到实际应用中,是一次系统性的 设计模式实践或架构设计实践。主要目的用于学习设计模式的实战项目,将所学的设计模式用于实战。后续可阅读开源框架源码,剖析优秀的开源项目是如何设计出来的,毕竟YtyMark-java这个开源项目只是练手项目。
更多详细内容可以前往笔者微信公众号回复:设计模式,来获取,后续有关设计模式的新资料都可以从这个入口获取到。
-
秘籍1设计模式手册:《掌握设计模式:23种经典模式实践、选择、价值与思想》
-
秘籍2练手项目:设计模式实战项目--markdown文本编辑器软件开发(已开源)
查看往期设计模式文章的:设计模式