红孩儿编程大师

红孩儿编辑器开发纪实万事开头难，先写出一个初始的版本。再不断地优化它。需求分析1基本功能需求1.1文件操作1.1.1创建新文件，1.1.2保存文件，1.1.3退出1.2编辑操作复制，剪切，粘贴1.3查找与替换查找，替换1.4插入操作图片，表格，音频，视频1.5标签页操作创建，切换，关闭2非功能需求2.1加载文件的文件大小限制，2.2文件的每行长度限制。3隐含...

红孩儿编辑器的模块设计8文件的保存与序列化与反序列化操作保存的策略有手工的保存与自动化的保存。手工的保存就是用户自动点击保存按钮或者使用键盘上的快捷键操作。自动化的保存就是系统每隔一定的时间检查一下，是否有修改，如果有，则保存到文件中。手工的保存与自动化的保存，两者没有冲突与矛盾，可以同时采用这两种策略。序列化 是把缓存中的二维结构，转换成一维的结构，即字符串或者是数据字节流...

红孩儿编辑器的渲染子系统的渲染模块 函数关系图如下： 

红孩儿编辑器的模块设计9主编辑区域的三大对象的设计第一个是编辑器对象它有属性长度，宽度，光标的位置，行高度，字宽度，还有状态这个子对象。行号所占用的字符数它的方法有判断左边界，判断右边界，定位鼠标的行首，行尾，上下左右移动，上下翻页，回车，退格，初始化，得到光标的位置信息，包括可见区的行号，列号，屏幕上的行号列号，第二个对象是配置对象，它的属性有子对象查找的配置，字体大小，字体...

红孩儿编辑器的模块设计11代码的语法高亮显示这是一个有很强的需求的功能。对于程序员来说它是一个很重要的功能。在程序的编辑过程中不可或缺。这就引出一个如下的问题。 什么样的设计是好的设计？ 好的设计完美地满足了人们的需求，差的设计不但没有满足人们的需求，还会有阻碍的作用。好的设计可以提高人们的工作的效率，差的设计让人分散精力并且浪费时间。好的设计让人感到美的存在，让人使用...

红孩儿编辑器的模块设计10 10.1  文件保存的编码方式在保存文件时，例如windows的记事本，会有一个编码方式的设置选项可选的编码方式有ANSI,UTF-8,Unicode,Unicode-big-endian这四种。默认是ANSI，它的编码方式是对于英语字符是ASCII,汉字是区位码，也就是GB2312。这是汉字编码的1980年的国家标准。 因为无论是文本文件，还是...

红孩儿编辑器的模块设计6编辑器的主显示区域的文件显示的整体逻辑配置信息中的是否显示行号，是否自动换行，对文件在编辑器上的显示有直接的影响。所以分成了如下的四种情况进行描述：1  显示行号，自动换行    每行显示的字符总数n=编辑器的宽度/字符的宽度-行号占用的字符数    文件中的一行在屏幕上占用的行数=文件中的一行字符数/每行显示的字符的总数   显示时按照屏幕上的一行行进...

红孩儿编辑器的模块设计13 自动补全功能的逻辑分成两种情况一种文本的写作过程另一种是代码编写的过程对于文本的自动补全，涉及到人工智能领域的一个分支自然语言处理的技术。即对已有的文本进行相关的分析，来预测作者将要写的是什么，提示出相应的选项，让写作者进行选择，以加快录入的效率。这个要求有一点高，需要有词法和语法的分析，还有要一个巨量数据的语料库。可以先实现它的初级版本，即当作...

红孩儿编辑器的模块设计12 插入图像的逻辑插入图像需要解决的问题有如下的几个：1如何把图像的文件上传到系统的内存中2如何解析图像文件的数据流3如何显示图像的信息第一个问题使用了HTML5的File API进行实现。暂不展开叙述第二个问题是本篇的重点讨论对象。为了解析图像的文件数据流，需要了解图像文件的格式，不同的图像文件格式，采用了不同的编码与解码方案。本系统首先默认实现...

红孩儿编辑器的模块设计16 加密与解密的功能在配置信息中，进行配置，有普通的文件保存与加密文件保存在加密保存的信息下，需要用户设置密码，在打开加密的文件时，需要输入密码，才能解密文件，进行正常的浏览与编辑文件。还有加密算法的设置，例如方法1，方法2，方法3 实现过程：在加密文件的保存时，加上八个字节的文件头。前七个字节是标识符，标识这个文件是一个加密的文件，读取时需要解...

红孩儿编辑器的模块设计17自动生成代码    这个概念是有狭义和广义的，狭义根据配置定义的设置生成了代码块，例如eclipse的设置对象的属性的代码实现，系统会自动生成setter 和getter的方法实现代码。    广义的自动生成代码是包括代码的转换的含义。例如编译器把高级编程语言转换成了汇编语言，汇编器又进一步把汇编语言转换成了机器语言。还有DSL(领域专用语言)的工具，它可以把...

红孩儿编辑器的模块设计14代码自动格式化格式化的规则需要事先定义，采用配置的方式进行设置。例如把制表符替换成4个空格符号。同一级的分界符对齐。代码块父子层级之间的加4个空格符缩进，超长代码行的自动换行。对象的方法之间加一个空行。代码的格式化的目的是使程序的代码逻辑关系更清晰，提高了代码的可读性。代码主要是给人阅读的，顺便它也能在机器上执行。但有时候，格式化可能画蛇添足，甚至执行错误，这需要...

红孩儿编辑器的模块设计15查找功能的逻辑需要配置的信息有查找目标是多个还是一个，查找方向是向前还是向后，查找范围是全文还是选中范围，查找使用语言是英语还是汉语，在英语的情况下，大小写字母是否敏感，在汉语的情况下，简体字与繁体字是否敏感。查找是否支持正则表达式。在支持正则表达式的情况下，正则表达式的写法支持哪一种规范呢？因为几乎各种高级的编程语言都内在默认支持了正则表达式，但遗憾的是正则表达式的...

红孩儿编辑器的模块设计５5.1 矩阵转换模块的设计16*16点阵 转换成 32*32点阵的逻辑这就是说把一个点放大成四个点，如果这四点都显示的话，字体形状是相似的。现在需要让它从粗体变成瘦体一点的。这四个点的位置如下1  23  4如果这个点的右方有一个紧相邻的点，这四个点中显示１和２点如果这个点的右下方有一个紧相邻的点，这四个点中显示 １和4 点如果这个点的下方有一...

红孩儿编辑器的模块设计4 编辑器主显示区的样式渲染的逻辑例如在显示区有背景色或者是背景图片，字，以及对字的种种修饰，包括加外框，下划线，中划线等这需要有图层的概念，在显示区绘制第一个图层，是背景色或者是背景图片第二个图层是字，第三个图层是字的修饰内容，例如外框，下划线，中划线等。背景色，背景图片，字体大小，之类的信息，现在采用的是放在配置信息中。这样做的好处是方便解析，但是灵活...

红孩儿编辑器的概要设计第二部分技术决策1编程语言的选择 html,javascript2 在1的基础上图像库的选择   使用HTML5的画布（canvas）api3 持久化技术选择   使用WEB浏览器的客户端存储，以后考虑使用数据库例如redis.以上的决策是为了实现编辑的在线的web版本。1输入子系统处理对键盘和鼠标的响应模块有键值映射模块主要实现的有如下的函数功...

红孩儿编辑器的详细设计第二部分第一部分是各个子系统的架构图根据之前的设计文档，对之前的架构图进行细化得到如下的架构图 第二部分是各个子系统的模块的名称定义key_map.js 是输入子系统的键值映射的模块，文件中只有键的常量定义，这是数据文件的性质。不计入代码规模的行数统计。character_draw.js  渲染子系统中的字符显示模块。以下的两个文件是核心控制子...

红孩儿编辑器的模块设计（1）主显示区域的滚动条的逻辑处理第一个问题是判断滚动条是否需要显示的问题，第二个问题是如何渲染滚动条的问题第三个问题是通知渲染滚动条，或者是取消滚动条的显示的时机问题第四个问题是滚动条如何响应鼠标的操作的问题第一个问题逻辑规则如下如果当文件的行数超过了一屏幕能够显示的最大的行数时，需要在显示区域的右侧显示出纵向的滚动条。如果文件的总行数改变成小于等于一...

红孩儿编辑器的系统设计设计原则：1。尽快出一个原型的界面，再快速地进行迭代改进。2。以易用性为第一目标功能界面设计1状态栏区域2 功能按钮区域3 编辑器显示主区域4 输入区域5 系统配置区域例如编辑器的主要区域如下所示红孩儿编辑器的架构设计设计原则1 可扩展性是第一位的2 以插件的体系为理念系统的一级子系统有输入子系统，核心控制子系统，缓存子系统，渲染...

红孩儿编辑器的详细设计1。输入子系统第一个设计问题是编辑器是采用多模式切换的方式，还是单模式的方式。本次开发采用了单模式的方式多模式是指像linux操作系统下的vim编辑器那样分成编辑模式，命令模式，单行模式等。单模式只有一种编辑模式。符合绝大多数的用户的使用习惯，开发会复杂一些。多模式有利于开发实践，有利于纯键盘操作，和执行性能等，是适合系统管理员与程序员使用的方式。多模式切换的概...

红孩儿编辑器的详细设计第三部分这一部分详细地列出各个模块的接口定义输入子系统键盘模块  key_operation()   key_up()鼠标模块   input(val) 核心控制子系统控制模块   core_controll_logic(event_type,key_code,str)输入法模块 //输入的是一个英语字符串，输出是一个以区位码为元素的二维矩阵。 lo...

红孩儿编辑器的模块设计2  核心控制子系统的控制模块第一层的控制分成三种情况：以事件类型分为鼠标，键盘按下事件，键盘弹起事件第二层控制分成语言设置分成中文和英文第三层控制为输入字符的分类分成直接打印的字符，英语小写字母，数字与空格五笔输入法的控制逻辑分成四类，有一级简码，二级简码，三级简码，和四个字母的全码。在三级简码和全码时，在查找字符串对应区位码时，映射的数据是...

红孩儿编辑器的开发规范第一：先写相关的设计与开发的文档，然后再开发程序代码。如果不能把设计思路与系统实现的逻辑结构，以文档的形式描述清楚，那么就是设计者根本不知道自己要做什么。开发者也没有了目标与方向。在系统的规模很小的情况下，例如，总代码行数在2000行以下时，程序可以不讲究任何的开发方法，甚至文档也可以没有，让程序代码野蛮地成长。但是这个让开发者的头脑的记忆负担越来越重。在2...

红孩儿编辑器的开发 1  字体库的生成过程采用了位图的方式，以后的优化过程中，会改为矢量图的方式来实现。现在采用的是16*16的点阵数据，先在EXCEL软件中，手工地把字的形状画出来。有点的位置为1，无点的位置为0，一行计算成一个数据，它的值小于等于65535。所以一个字的点阵图像表示成如下的16个数据的数组，来表示这16行的情况。例如 如下的一行数据，代表汉字“一”[0,0,0,0...

红孩儿编辑器的模块设计3 编辑器的主显示区域的显示行号的逻辑首先需要明确的是行号的概念，有文件中的行号和屏幕上相对于屏幕左上角顶点的屏幕的行号。需要需要的是文件中的行号，这是用户更关心的行号。这也意味着在上下翻页，或者滚动一行时，行号与显示内容要一起刷新。逻辑上分成两种情况来讨论。一种是不自动换行的情况，意味着屏幕上的每一行都有一个行号，这个文件行号=屏幕上的相对行号+屏幕上左上...

红孩儿编辑器的详细设计第四部分系统中主要的数据结构设计1缓存的结构二维的数组，还有一个栈，是一个修改的日志 包括操作类型，位置，原内容，新内容。2状态的结构是一个对象，它有属性是文件名，当前的光标行号，当前光标的列号，左上角顶点处的位置在文件中的行号，列号3配置的结构是一个对象，它有属性 是否是语法高亮显示，是否是代码折叠， 是否是括号匹配，是否是自动换行，是否是显示行号...

控制 子系统 的函数依赖关系图如下：  

红孩儿编辑器模块设计7首次明确一下如下的相关的概念屏幕 与屏幕的可见区，缓存与文件屏幕与屏幕的可见区的关系，就好像是拿着放大镜看地图。地图很大，用放大镜来移动着，看一个部分。转换公式是屏幕的可见区的相对的行号+左上角的顶点在屏幕中的行数=屏幕中的绝对的行号屏幕的可见区的相对的列号+左上角的顶点在屏幕中的列数=屏幕中的绝对的列号屏幕与缓存都可以看成是两维的数组，如果没有自动换...

红孩儿编辑器的模块设计文档目录1 主显示区域的滚动条的逻辑处理2.1 核心控制子系统的控制模块2.2 五笔输入法的控制逻辑2.3  复制，粘贴与删除的缓存操作逻辑3.1 编辑器的主显示区域的显示行号的逻辑3.2 编辑器的主显示区域的编辑显示逻辑4.1  编辑器主显示区的样式渲染的逻辑4.2  拼音输入法模块的查询逻辑5.1 矩阵转换模块的设计5.2 光标定位的模块的设计6.1...