1

我的网站有一个图片生成器。它允许访问者在图像上编写自定义文本。

我通过显示图片和使用 Javascript 来处理这种情况，因此他们可以在图片上书写（预览图片的外观）。在他们按下提交后，我得到 x&y 坐标、文本和字体大小。

（我也支持多种字体大小）

为了在图像上写入文本，我使用ImageTTFText函数。

好的，到目前为止一切都很好。现在我遇到的问题是如何知道句子何时太长而无法放在一行中。我遇到了wordwrap功能，但它不可靠。它根据字符数拆分句子。但是，例如，如果您输入十次“I”和十次“D”，您会发现宽度有所不同。

好的，然后我遇到了ImageTTFBBox，它会计算盒子的大小，所以我会知道它什么时候太长。好吧，这很好，但是那我怎么能拆分句子呢？（通过文字）。

如果有人能给我答案，我将不胜感激。

4

2 回答 2

0

我的逻辑是在每一行中添加尽可能多的单词，而不必删减一个单词。所以，我会在一行中添加一个单词，用 来检查它的渲染大小ImageTTFBBox()，然后重复直到行溢出（然后明显删除导致溢出的单词）。如果遇到行溢出的情况，一行只有一个字，那你就必须剪掉这个字。你会打电话ImageTTFBBox()很多很多次。

于 2012-05-20T16:40:44.937 回答
0

如果您使用的是 HTML5，您可以在发送之前请求 Javascript 给您一些帮助。假设你有一个画布（甚至是在代码中创建的）和一个ctxt你可以做的上下文：

ctxt.font = "14pt Arial";
ctxt.textAlign = "left";
ctxt.fillStyle = "#000";
ctxt.fillText(text, x, y);
var metrics = ctxt.measureText(text);
var width = metrics.width;

现在您知道您的文本有多宽，并且可以进行一些基本的自动换行。假设您的有效宽度（图像宽度减去内边距）为 180 像素，文本宽度为 679 像素。这是一个 +/- 25% 的比率 (26.05%)。使用该比率提取句子的前 25%，查看它是否适合宽度，绘制并向下移动一行。

于 2012-05-20T17:18:52.960 回答