2014-02-18 26 views
0

我正在編寫一個腳本,插入文本在圖像上,它的作品,但不是完全,即如果用戶在textarea中添加換行符罰款,但是如果所有文本都在一行看起來很糟糕。這是我的代碼php - 在多行上打開單行字符串,然後插入圖像

$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:抱歉,我的英語不好

回答

0

你想要做什麼,是將字符串分割成更小的塊或塊,對於這一點,你必須在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; 
} 

你可能有主要的問題是,該字符串就會被破壞隨機的地方,至少隨機從用戶的角度出發,因此,該片段可能沒有多大意義。通過通知他們應該使用換行符來嘗試改進用戶界面。

0
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,每當有自動換行,它將新的換行符推入文本區。在submit表單中運行該函數,您將在服務器端代碼中獲得正確換行的文本。

通過這種方式,文字將完全按照用戶在圖像製作前看到的方式顯示。用戶不需要猜測線路是如何斷開的。

此功能被發現另一個答案中:finding "line-breaks" in textarea that is word-wrapping ARABIC text

+0

謝謝@Kyle,但我認爲這是比服務器端更好的包裝文本比客戶端,問題是idk如何做到這一點,我會嘗試一切 – xSkArx