[发明专利]绘制文本的方法及装置

说明书

技术领域

本发明涉及计算机技术领域，尤其涉及一种绘制文本的方法及装置。

背景技术

画布(Canvas)元素是超文本标记语言5.0(Hyper Text Markup Language5.0，简称HTML5)应用中的一个新元素，它用于在网页上绘制图形。Canvas元素自己没有绘图的能力，它是将一个绘图的API展现给客户端，使客户端使用JavaScript将想要绘制的图形内容绘制到Canvas上。另外，通过多种方法也可以将绘制字符、文本，或者将图像等添加到Canvas上。

当在一个有限宽度的Canvas上绘制文本时，通常是先设置绘制的起点坐标，然后从起点坐标开始由左向右将文本一次性绘制到Canvas上，由于Canvas本身只支持单行绘制，因此当需要绘制的文本比较长且单行排列的总长度超过Canvas的宽度时，则会根据Canvas的宽度进行适当的缩小文本以适应Canvas的宽度。但是，当文本过长，并将其缩小到可视的范围内时依然不能将完整的文本绘制在Canvas中时，对于超出Canvas宽度的部分文本则不会在Canvas上绘制，而是将超出的部分省略，而且还可能出现在Canvas最右边可能出现只显示某个字符的一部分的情况。综上可以看出，现有的在Canvas上绘制文本的方法效果差。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的一种绘制文本的方法及装置。

为解决上述技术问题，一方面，本发明提供了一种绘制文本的方法，该方法包括：

在画布Canvas上绘制每一个字符之前，计算当前的剩余宽度，所述剩余宽度为Canvas宽度减去前一个字符的字符终点横坐标的差值，所述字符终点横坐标为所述前一个字符的字符起点横坐标与所述前一个字符的字符 宽度之和；

判断所述剩余宽度是否小于待绘制字符的字符宽度；

若所述剩余宽度不小于所述待绘制字符的字符宽度，则在所述前一个字符之后绘制所述待绘制字符；

若所述剩余宽度小于所述待绘制字符的字符宽度，则换行绘制所述待绘制字符。

另一方面，本发明还提供了一种绘制文本的装置，该装置包括：

计算单元，用于在画布Canvas上绘制每一个字符之前，计算当前的剩余宽度，所述剩余宽度为Canvas宽度减去前一个字符的字符终点横坐标的差值，所述字符终点横坐标为所述前一个字符的字符起点横坐标与所述前一个字符的字符宽度之和；

判断单元，用于判断所述剩余宽度是否小于待绘制字符的字符宽度；

第一绘制单元，用于若所述剩余宽度不小于所述待绘制字符的字符宽度，则在所述前一个字符之后绘制所述待绘制字符；

第二绘制单元，用于若所述剩余宽度小于所述待绘制字符的字符宽度，则换行绘制所述待绘制字符。

借由上述技术方案，本发明提供的绘制文本的方法及装置，能够在画布Canvas上绘制每一个字符之前，首先计算Canvas的宽度减去前一个字符的字符终点横坐标的差值得到当前Canvas的剩余宽度，其中字符终点横坐标为前一个字符的字符起点横坐标与前一个字符的字符宽度之和；然后判断Canvas当前剩余宽度是否小于待绘制字符的字符宽度，若剩余宽度不小于待绘制字符的字符宽度，则在前一个字符之后绘制待绘制字符，若剩余宽度小于待绘制字符的字符宽度，则另起一行绘制待绘制的字符。与现有技术相比，本发明能够在Canvas上通过逐个绘制字符的方式绘制文本，并在每绘制一个字符之前计算当前Canvas的剩余宽度，然后判断剩余宽度是否小于待绘制字符的字符宽度，并根据判断的结果来决定是否进行换行绘制待绘制字符，实现了文本的分行绘制，使绘制不再受到Canvas宽度的限制，即使是较长的文本也可以正常和完整的绘制到Canvas中，展现出更好的绘制效果。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1示出了本发明实施例提供的一种绘制文本的方法流程图；

图2示出了本发明实施例提供的另一种绘制文本的方法流程图；

图3示出了本发明实施例提供的一种绘制文本的装置的组成框图；

图4示出了本发明实施例提供的另一种绘制文本的装置的组成框图。

具体实施方式