Question

我正在编写一个在图像上插入文本的脚本，它可以工作但不完全，即如果用户在textarea中添加换行符很好，但如果所有文本都在一行上看起来很糟糕。这是我的代码

$str="this is a string inserted by an user";
$img_width= 500;
$img_height= 500;
$font_size = 1; 
$txt_max_width = intval(0.6 * $img_width);
do {
    $font_size++;
    $p = imagettfbbox($font_size,0,$font,$str);
    $txt_width=$p[2]-$p[0];
    } while ($txt_width <= $txt_max_width);
    $y = $img_height * 0.4;
$x = ($img_width - $txt_width) / 2;
$white = imagecolorallocate($img, 255, 255, 255);
imagettftext($img, $font_size, 0, $x, $y, $white, $font, $str);
imagepng($img);
imagedestroy($img);

请查看此内容以了解http://app.xskarx.com

PS：抱歉我的英文不好

Answer 1

function ApplyLineBreaks(strTextAreaId) {
var oTextarea = document.getElementById(strTextAreaId);
if (oTextarea.wrap) {
    oTextarea.setAttribute("wrap", "off");
}
else {
    oTextarea.setAttribute("wrap", "off");
    var newArea = oTextarea.cloneNode(true);
    newArea.value = oTextarea.value;
    oTextarea.parentNode.replaceChild(newArea, oTextarea);
    oTextarea = newArea;
}

var strRawValue = oTextarea.value;
oTextarea.value = "";
var nEmptyWidth = oTextarea.scrollWidth;

function testBreak(strTest) {
    oTextarea.value = strTest;
    return oTextarea.scrollWidth > nEmptyWidth;
}
function findNextBreakLength(strSource, nLeft, nRight) {
    var nCurrent;
    if(typeof(nLeft) == 'undefined') {
        nLeft = 0;
        nRight = -1;
        nCurrent = 64;
    }
    else {
        if (nRight == -1)
            nCurrent = nLeft * 2;
        else if (nRight - nLeft <= 1)
            return Math.max(2, nRight);
        else
            nCurrent = nLeft + (nRight - nLeft) / 2;
    }
    var strTest = strSource.substr(0, nCurrent);
    var bLonger = testBreak(strTest);
    if(bLonger)
        nRight = nCurrent;
    else
    {
        if(nCurrent >= strSource.length)
            return null;
        nLeft = nCurrent;
    }
    return findNextBreakLength(strSource, nLeft, nRight);
}

var i = 0, j;
var strNewValue = "";
while (i < strRawValue.length) {
    var breakOffset = findNextBreakLength(strRawValue.substr(i));
    if (breakOffset === null) {
        strNewValue += strRawValue.substr(i);
        break;
    }
    var nLineLength = breakOffset - 1;
    for (j = nLineLength - 1; j >= 0; j--) {
        var curChar = strRawValue.charAt(i + j);
        if (curChar == ' ' || curChar == '-' || curChar == '+') {
            nLineLength = j + 1;
            break;
        }
    }
    strNewValue += strRawValue.substr(i, nLineLength) + "\n";
    i += nLineLength;
}
oTextarea.value = strNewValue;
oTextarea.setAttribute("wrap", "");
}

此函数接受textarea的ID作为其参数，并且只要有自动换行，它就会将新的换行符推送到textarea中。在表单提交中运行该函数，您将在服务器端代码中获得包含正确换行符的文本。

这样，文本将完全按照用户在制作图像之前看到的方式显示。用户无需猜测线条将如何破裂。

此功能在另一个答案中找到：finding "line-breaks" in textarea that is word-wrapping ARABIC text

Answer 2

你想要做的是将字符串拆分成更小的块或块，为此，你在PHP中有chunk_split。

您将以这种方式使用它：

// initialize variables
$final_string = false;
$size_of_the_chunk = 20;
$str = "_this_is_a_very_long_string__this_is_a_very_long_string__this_is_a_very_long_string__this_is_a_very_long_string__this_is_a_very_long_string__this_is_a_very_long_string_";
$length_of_string = strlen( $str );

// work only if necessary
if ( $length_of_string > $size_of_the_chunk ) {
    $final_string = chunk_split( $str, $size_of_the_chunk );
} else {
    $final_string = $str;
}

您可能遇到的主要问题是，字符串将在随机位置上分割，至少从用户的角度来看是随机的，因此，片段可能没有多大意义。尝试通过告知他们应该使用换行符来改进用户界面。

php - 在多行上转换单行字符串，然后插入图像

2 个答案: