CN110377280A - 一种用于编程教学的可视化系统 - Google Patents

Abstract

本发明提供了一种用于编程教学的可视化系统，包括可视化操作区模块、文件管理模块、代码积木块库模块、课程库模块、综合案例库模块、模式切换模块、代码渲染区模块、执行输出区模块，所述文件管理模块与可视化操作区模块之间的指令双向输入输出，课程库模块与综合案例库模块之间的指令双向输入输出，代码积木块库模块、课程库模块、综合案例库模块向可视化操作区模块单向指令输入，可视化操作区模块向代码渲染区模块单向指令输入、代码渲染区模块向执行输出区模块单向指令输入；本发明通过可视化的课程教学，让编程初学者可以快速掌握编程语言，具有交互界面友好，学习方便的优点。

Description

一种用于编程教学的可视化系统

技术领域

本发明涉及软件可视化编程技术领域，尤其是涉及一种用于编程教学的可视化系统。

背景技术

可视化程序设计是一种全新的程序设计方法，亦即可视化编程，以“所见即所得”的编程思想为原则，力图实现编程工作的可视化，即随时可以看到结果，程序与结果的调整同步，主要是让程序设计人员利用软件本身所提供的各种控件，像搭积木式地构造应用程序的各种功能。

可视化编程语言是一个完整的领域，在过去的60年里，出现了多种多样的语言，简单地概括，这些语言可以分为两大类：基于块的可视化编程：在基于块的可视化编程环境中，编程者不需要输入文本代码，而是可以将预先定义好的块通过拖拽放到脚本区域，如Google Blockly是一款基于Web的、开源的、基于块的可视化程序编辑器，编程者可以通过拖拽块的形式快速构建程序，而这些所拖拽的每个块就是组成程序的基本单元，每个图形对象都是代码块，将它们拼接起来，创造出简单功能，然后将一个个简单功能组合起来，构建出一个程序；基于流的可视化编程语言，也称为基于节点的编程语言，使用流程图来表示状态、逻辑或数据的变化，很多人尝试建立基于流的通用可视化编程语言，例如Raptor、Flowgorithm、Visual Logic或DRAKON，这些语言在3D编程、音乐合成、信号处理或物联网/嵌入式电路设计工具等领域大受欢迎，但这些语言仍然是非常狭窄的领域和高度专业化的解决方案。

从上面的阐述可知，现有的可视化编程技术中，大都只是一个基本的图形框架或者需要高深特定领域知识，对于编程初学者仍然无法直接使用这些工具进行编程学习，而且对于常见的编程语言如python等自带了很多工具库，在默认情况下无法调用。

发明内容

针对上述所阐述的缺陷和问题，本发明所要解决的技术问题是提供一种用于编程教学的可视化系统，方便可视化编程语言初学者进行编程学习使用。

为了达到上述目的，本发明提供如下技术方案：

一种用于编程教学的可视化系统，包括可视化操作区模块、文件管理模块、代码积木块库模块、课程库模块、综合案例库模块、模式切换模块、代码渲染区模块、执行输出区模块，所述文件管理模块与可视化操作区模块之间的指令双向输入输出，课程库模块与综合案例库模块之间的指令双向输入输出，代码积木块库模块、课程库模块、综合案例库模块向可视化操作区模块单向指令输入，可视化操作区模块向代码渲染区模块单向指令输入、代码渲染区模块向执行输出区模块单向指令输入；

所述文件管理模块，包括新建功能项、导入功能项、导出功能项、另存功能项；

所述可视化操作区模块，用于用户拖拽积木块，进行程序逻辑的编写，删除不合适的积木块；

所述代码积木块库模块，用于管理默认和新建的代码积木块，积木块是对编程语言抽象化的图形化表示，通过拖拽积木就可以直观了解到代码背后的运转原理；

所述课程库模块，用于管理课程列表，通过课程从易到难，逐步了解编程语言的各个知识点；

所述模式切换模块，用于在综合案例库模块学习时切换学习模式和测试模式；

所述代码渲染区模块，用于显示可视化操作区模块中积木块对应的代码；

所述执行输出区模块，用于显示程序执行结果。

上述技术方案中，所述文件管理模块用于管理可视化操作生成的配置文件，分为新建功能项、导入功能项、导出功能项、另存功能项，所述新建功能项指令在可视化操作区模块新建图形界面；导入功能项导入将图形界面配置文件导入可视化操作区模块、导出功能项将可视化操作区模块更新的内容追加写入到配置文件、另存功能项用于将可视化操作区模块的内容写入新的配置文件中。

上述技术方案中，所述代码积木块库模块分为：数据积木块库、运算积木块库、控制积木块库、函数积木块库、变量积木块库，所述数据类积木块库包括字符串、数字、布尔、列表、元组、字典、集合、常用数学常量以及对上述类型进行处理的方法；运算类积木块库包含算符运算符、比较运算符、位运算符、逻辑运算符、随机数、整数列表生成、数性质判断、三角函数运算、对数运算以及其他常见数学运算；所述控制积木块库包含逻辑指令，重复执行、重复执行N次、重复执行知道满足某种条件、循环遍历序列对象、退出循环、继续循环、如果、如果...否则；所述函数类积木块库包含定义新函数、设置函数参数、设置函数返回值；所述变量类积木块库罗列显示编程过程中定义的变量。

上述技术方案中，所述管理课程列表包括教学的所有课程列表、编程语言的各个知识点。

上述技术方案中，所述综合案例库模块用于管理学习成果，对一个案例包括学习模式和测试模式，在学习模式中，学生编辑积木块时，代码视图有对应的代码展示；在测试模式中，在学生代码视图中输入代码时，最后点击运行看结果是否正确。

上述技术方案中，所述可视化操作区模块，在用户拖拽积木块，进行程序逻辑的编写，删除不合适的积木块时，整个可视化操作区域能够完成放大、缩小操作。

上述技术方案中，所述模式切换模块用于切换学习模式和测试模式，学习模式中，学生编辑积木块时，代码视图有对应的代码展示，测试模式在学生代码视图中输入代码后，点击运行，查看结果是否正确。

本发明通过可视化的课程教学，让编程初学者可以快速掌握编程语言，具有交互界面友好，学习方便的优点。

具体实施方式

下面将结合本发明的实施例，对本发明的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

实施例1：一种用于编程教学的可视化系统，包括可视化操作区模块、文件管理模块、代码积木块库模块、课程库模块、综合案例库模块、模式切换模块、代码渲染区模块、执行输出区模块，所述文件管理模块与可视化操作区模块之间的指令双向输入输出，课程库模块与综合案例库模块之间的指令双向输入输出，代码积木块库模块、课程库模块、综合案例库模块向可视化操作区模块单向指令输入，可视化操作区模块向代码渲染区模块单向指令输入、代码渲染区模块向执行输出区模块单向指令输入。

所述文件管理模块用于管理可视化操作生成的配置文件，分为新建功能项、导入功能项、导出功能项、另存功能项。

新建功能项指令在可视化操作区模块新建图形界面，用户点击新建，则会清空可视化操作区的所有积木块，生成一个新的配置文件；导入功能项导入将图形界面配置文件导入可视化操作区模块，点击导入可以从之前保存的一个配置文件中加载配置内容，并根据配置内容重新生成可视化操作区；导出功能项将可视化操作区模块更新的内容追加写入到配置文件，点击导出则会将可视化操作区更新的内容追加写入配置文件，如果之前没有生成配置文件，则会新建一个配置文件用于保存内容；另存功能项用于将可视化操作区模块的内容写入新的配置文件中；点击另存则是将当前可视化操作区的内容写入新的配置文件中。

可视化操作区模块在用户拖拽积木块，进行程序逻辑的编写，删除不合适的积木块时，整个可视化操作区域能够完成放大、缩小操作。用户从代码积木库模块拖入新的代码块到可视化操作区，同时根据拖入的代码块，代码渲染区模块会显示对应的代码；用户删除代码块，也会造成代码渲染区模块也会相应的删除对应的代码。；可视化操作区的更新可以通过文件管理模块的保存功能将最新的内容写入配置文件中，以供后续继续编辑使用。

代码积木块库模块，用于管理默认和新建的代码积木块，代码积木块库模块分为：数据积木块库、运算积木块库、控制积木块库、函数积木块库、变量积木块库，积木块是对编程语言抽象化的图形化表示，通过拖拽积木就可以直观了解到代码背后的运转原理。

数据类积木库包括字符串、数字、布尔、列表、元组、字典、集合、常用数学常量以及对上述类型进行处理的方法。

运算类积木库包含算符运算符、比较运算符、位运算符、逻辑运算符、随机数、整数列表生成、数性质判断、三角函数运算、对数运算以及其他常见数学运算。

流程控制类积木库包含重复执行、重复执行N次、重复执行知道满足某种条件、循环遍历序列对象、退出循环、继续循环、如果、如果...否则。

函数类积木库包含定义新函数、设置函数参数、设置函数返回值，新定义好的函数也会显示在函数库中。

变量类积木库主要罗列显示在编程过程中定义的一些列变量，如变量a1，b等。

代码积木库中的积木，用于拖拽到可视化操作区模块，通过积木库的组合实现复杂的程序逻辑，同时也可在代码渲染区模块看到对应的程序代码。

课程库模块用于管理课程列表，通过课程从易到难，逐步了解编程语言的各个知识点，课程库中包含10节自带的课程，每节课程均包含要学习的知识点和学习任务，学生通过知识点的学习，了解概念，通过一个个的学习任务，掌握并加深对该知识点的学习。

实施例中，10节课程具体的知识点和学习任务如下：

课程1：认识操作系统，知识点包含操作系统的概念、常见操作系统、发展历史、系统作用、总结；该节课没有具体的学习任务，以概念学习为主。

课程2：认识Python，知识点包含Python的概念、应用领域、python的优缺点；该节课没有具体的学习任务，以概念学习为主。

课程3：标识符与数据类型，知识点包含标识符的概念、变量和函数名命名规则；

课程3的学习任务有：

①创建一个变量，值为个数字类型，将其显示出来。

②创建一个变量，值为布尔类型，将其显示出来。

③创建一个变量，值为字符串类型，例如“hello world”，将其显示出来。

④检查变量命名是否合法，是否符合驼峰式命名法。

课程4：字符串，知识点包含字符串的概念、常用转移符。

课程4的学习任务有：

①创建一个字符串变量，值为：'hello world'，将其显示出来。

②显示一个包含单引号(‘)和双引号(“)的特殊字符串，例如：”I’m OK”。

③显示一个多行字符串。

④定义两个或多个字符串变量，并为其赋不同的值，,将两个或多个字符串拼接起来并显示。

⑤创建一个字符串变量，从字符串截取部分显示，例如从“hello world”中截取出“hello”并显示。

⑥创建两个字符串变量str1，str2，判断str1是否包含str2，将结果显示。

例如str1＝‘hello world’,str2＝‘orl’，结果应该显示True。

⑦创建字符串变量str1,值为'1,2,3,5,6'。将strl1按字符逗号(,)拆分，并显示结果。

⑧创建一个字符串变量，可以任意赋值，统计包含的字符个数并显示。

课程5：列表，知识点包括列表的定义，列表(list)是一种有序的集合，写在中括号([])内，元素之间用逗号隔开，可以存储任意类型，任意数量的元素，可以随时添加、修改、删除其中的元素。

课程5的学习任务有：

①创建一个列表变量，名为student，通过末尾最佳的方式，向student中添加一些元素，最后student的值为:['Tom',18,'上海','男']，分别对应姓名、年龄、地址、性别。最后将student显示出来。

②插入元素，在‘男’之前插入‘篮球’，对应爱好。然后将student显示出来。

③访问列表元素，通过索引(下标)的方式访问列表student，将姓名、年龄、地址、爱好、性别分别显示出来。

④修改某个元素,将student中的年龄由18改为20。

⑤删除某个元素，将student中的‘篮球’删除，然后将列表显示出来。

⑥列表截取，从student中将‘上海’,‘男’这两个元素截取并显示出来。

⑦统计student中元素的数量并显示出来。

⑧判断student中是否包含‘男’，将结果显示出来；判断是否包含‘篮球’，将结果显示出来。

⑨获取‘'Tom'在列表student中的索引值，并将索引值显示出来。

⑩追加列表，新建列表infos,值为：['数学',80,'英语',94,'语文',89,['Michael','Jack','Bob','Tracy']],将列表infos追加到student中，并显示追加后的新列表。

课程6：元组，知识点包括元组的定义，元组(tuple)和列表类似，也是一种有序集合，写在小括号内，元素之间用逗号隔开，可以存储任意类型，任意数量的元素。但元组创建好其包含的元素就不能修改或删除。

课程6的学习任务有：

①新建一个元组变量，名为students,值为：('Michael','Jack','Bob','Tracy')，将students显示出来。

②访问元组，根据索引访问student中的Bob，将其显示出来。

③元组截取，截取元组students中间两个元素显示出来。

④元组是否包含某个元素，判断students是否包含Tom，将结果输出；判断是否包含Jack，将结果输出。

⑤元素在元组中的索引值，显示Michael在元组中的索引值。

⑥多维元组，新建一个元组变量，名为stud2,值为:('Michael',('Jack',18,'男'),['Bob',19,'女'],'Tracy')，获取stud2中的19并显示。

⑦获取元组中元素的个数，显示stud2元素的个数并显示出来。

课程7：字典，知识点包括字典的定义、字典创建语法、字典的特点。

课程7的学习任务有：

①创建一个字典变量student,向student中添加四个键值对{'name':'tom','age':18,'sex':'男',50:78}，然后将student显示出来。

②根据键访问值，获取name对应的值并显示出来。获取50对应的值并显示出来。

③修改字典元素，将age对应的值修改为22。

④获取字典student所有的key值，并显示。

⑤获取字典student所有的value值，并显示。

⑥删除字典元素，删除50:78这个键值对。

⑦判断字典是否包含某个键，判断student是否包含age，将结果显示；判断是否包含50，将结果显示。

⑧显示student中键值对的数量。

⑨清空字典，清空student，然后显示student。

课程8：集合，知识点包含集合的定义，集合(set)和字典(dict)类似，是一组key的集合，但不存储value。由于key不能重复，所以，在set中，没有重复的key。

课程8的学习任务有：

①创建一个集合类型变量set1,向set1中添加1,1,2,2,3,3,5,7八个元素，将set1显示出来。

②判断集合中是否包含某个元素,判断set1是否包含1，将结果显示；判断是否包含4，将结果显示。

③删除元素,删除set1中的1，然后显示set1。

④两个集合交集，新建集合变量set2,值为：{2,3,4,5,8}，计算set1和set2的交集并显示。

⑤两个结合的并集,计算set1和set2的并集并显示。

⑥两个集合的差集,计算set1和set2的差集集并显示；计算set2和set1的差集集并显示。

⑦判断集合是否是另外一个集合的子集，新建集合set3,值为：{3,4}，判断set3是否是set1的子集，并将结果显示；判断set3是否是set2的子集，并将结果显示。

课程9：流程控制，知识点包括，流程控制的种类，流程控制包括条件控制语句和循环语句；条件控制语句也可以称之为判断语句，通过一条或多条语句判断的结果来决定接下里要执行的代码块；循环语句就是在符合条件的情况下，重复执行一个代码块；

课程9的学习任务有：

①简单的if语句。定义变量age，值为20，定义变量name,值为‘小明’。使用if语句，判断如果age等于20，就输出显示‘小明的年龄是20岁’。之后换成其他的判断语句，比如大于、大于等于等，看看‘小明的年龄是20岁’这句话是否还可以显示。

②If-else语句。使用If-else语句，判断如果age大于20，就输出显示‘小明的年龄大于20岁’，否则输出显示‘小明的年龄小于或者等于20岁’。

③If-elif-else语句，使用If-elif-else语句，判断如果age大于20，就输出显示‘小明的年龄大于20岁’，否则如果age小于20，输出显示‘小明的年龄小于20岁’，否则如果age等于20，输出显示‘小明的年龄等于20岁’，否则输出显示‘猜不出小明的年龄’。

④while循环语句，只要条件满足，就不断循环，条件不满足时退出循环。

输出5遍‘hello world’；

使用while计算1到100的和，让结果值显示出来。

⑤break语句,在循环体内遇到break会终止循环，不论此时循环的条件是否为真。

定义变量n,初始值为0，运行while循环，条件是n小于5，循环语句是n自增1，然后判断n如果等于3，使用break语句跳出循环，否则将自增后的n显示出来，查看输出内容。

⑥continue语句，break会终止整个循环，continue是跳过当前循环，不再执行continue之后的代码，直接执行下一次循环。

将上面示例中的break换成continue，查看输出内容有什么不同，理解break和continue的作用和不同。

⑦for...in循环，for可以用于循环遍历任何序列项目，如一个列表或者一个字符串。创建变量studenst,值为：['jack',23,'男','北京']，使用for...in循环将students中的每个值显示出来。

课程10：函数，知识点包括函数的定义、函数声明规范。

课程10的学习任务有：

①定义函数PrintName，该函数有一个参数name，其功能是将传入的name显示出来。之后调用该函数。

②定义函数product，其有两个参数x,y。返回x和y的乘积，之后调用该函数并将结果值显示出来。

③定义变量old,值为10.定义函数modifyX,参数为x，功能是将x赋值为20。调用函数modifyvalue，传入old。显示调用函数前old的值和调用函数后old的值。

④定义变量student，值为['jack',23,'男','北京'],定义函数modifyList，参数为x,功能是将传入的列表student中的23改为18。调用函数modifyList，传入student。显示调用函数前student的值和调用函数后student的值。

每个学习任务的完成均需要使用代码积木块库模块中不同类型的积木块，将积木库拖拽到可视化操作区，通过积木块的组合完成对应的学习任务。

综合案例库模块用于管理学习成果，例如：

综合案例1：有四个数字：1、2、3、4，能组成多少个互不相同且无重复数字的三位数？各是多少？

综合案例5：一球从100米高度自由落下，每次落地后反跳回原高度的一半；再落下，求它在第10次落地时，共经过多少米？第10次反弹多高？

通过案例检测学习成，每个案例的学习均需要使用代码积木块库模块中不同类型的积木块，将积木库拖拽到可视化操作区，通过积木块的组合完成对应的综合案例，通过模式切换模块，可以切换为学习模式或测试模式。在学习模式中学生编辑积木块时，代码视图有对应的代码展示。而测试模式要求在学生代码视图中输入代码，最后点击运行看结果是否正确。

模式切换模块主要用于在综合案例库模块学习时切换学习模式和测试模式。学习模式中，学生编辑积木块时，代码视图有对应的代码展示，测试模式要求在学生代码视图中输入代码，最后点击运行看结果是否正确。

代码渲染区模块用于显示可视化操作区模块中积木块对应的代码，每当可视化操作区模块中的内容有变化时，代码渲染区模块也会跟着将最新的代码渲染出来，从而方便用户查看，更快的让用户了解适应编程。

执行输出区模块用于显示程序执行结果。点击代码渲染区模块的执行按钮，执行输出区模块就会显示程序执行的结果。

对于可视化编程的学习者，通过在本发明所公开的系统的引导下，采用自学方式，能够掌握基础的可视化编程的基础知识，为将来进一步学习可视化编程打下良好的基础。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应所述以权利要求的保护范围为准。

Claims (7)

1.一种用于编程教学的可视化系统，其特征在于：包括可视化操作区模块、文件管理模块、代码积木块库模块、课程库模块、综合案例库模块、模式切换模块、代码渲染区模块、执行输出区模块，所述文件管理模块与可视化操作区模块之间的指令双向输入输出，课程库模块与综合案例库模块之间的指令双向输入输出，代码积木块库模块、课程库模块、综合案例库模块向可视化操作区模块单向指令输入，可视化操作区模块向代码渲染区模块单向指令输入、代码渲染区模块向执行输出区模块单向指令输入；

所述文件管理模块，包括新建功能项、导入功能项、导出功能项、另存功能项；

所述可视化操作区模块，用于用户拖拽积木块，进行程序逻辑的编写，删除不合适的积木块；

所述代码积木块库模块，用于管理默认和新建的代码积木块，积木块是对编程语言抽象化的图形化表示，通过拖拽积木就可以直观了解到代码背后的运转原理；

所述课程库模块，用于管理课程列表，通过课程从易到难，逐步了解编程语言的各个知识点；

所述模式切换模块，用于在综合案例库模块学习时切换学习模式和测试模式；

所述代码渲染区模块，用于显示可视化操作区模块中积木块对应的代码；

所述执行输出区模块，用于显示程序执行结果。

2.根据权利要求1所述的一种用于编程教学的可视化系统，其特征在于：所述文件管理模块用于管理可视化操作生成的配置文件，分为新建功能项、导入功能项、导出功能项、另存功能项，所述新建功能项指令在可视化操作区模块新建图形界面；导入功能项导入将图形界面配置文件导入可视化操作区模块、导出功能项将可视化操作区模块更新的内容追加写入到配置文件、另存功能项用于将可视化操作区模块的内容写入新的配置文件中。

3.根据权利要求1或2所述的一种用于编程教学的可视化系统，其特征在于：所述代码积木块库模块分为：数据积木块库、运算积木块库、控制积木块库、函数积木块库、变量积木块库，所述数据类积木块库包括字符串、数字、布尔、列表、元组、字典、集合、常用数学常量以及对上述类型进行处理的方法；运算类积木块库包含算符运算符、比较运算符、位运算符、逻辑运算符、随机数、整数列表生成、数性质判断、三角函数运算、对数运算以及其他常见数学运算；所述控制积木块库包含逻辑指令，重复执行、重复执行N次、重复执行知道满足某种条件、循环遍历序列对象、退出循环、继续循环、如果、如果...否则；所述函数类积木块库包含定义新函数、设置函数参数、设置函数返回值；所述变量类积木块库罗列显示编程过程中定义的变量。

4.根据权利要求3所述的一种用于编程教学的可视化系统，其特征在于：所述管理课程列表包括教学的所有课程列表、编程语言的各个知识点。

5.根据权利要求4所述的一种用于编程教学的可视化系统，其特征在于：所述综合案例库模块用于管理学习成果，对一个案例包括学习模式和测试模式，在学习模式中，学生编辑积木块时，代码视图有对应的代码展示；在测试模式中，在学生代码视图中输入代码时，最后点击运行看结果是否正确。

6.根据权利要求5所述的一种用于编程教学的可视化系统，其特征在于：所述可视化操作区模块，在用户拖拽积木块，进行程序逻辑的编写，删除不合适的积木块时，整个可视化操作区域能够完成放大、缩小操作。

7.根据权利要求6所述的一种用于编程教学的可视化系统，其特征在于：所述模式切换模块用于切换学习模式和测试模式，学习模式中，学生编辑积木块时，代码视图有对应的代码展示，测试模式在学生代码视图中输入代码后，点击运行，查看结果是否正确。