Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
769 views
in Technique[技术] by (71.8m points)

text - PHP word wrap with pixel dimensions

I'm looking for a way to wrap text into a box of specific width using PHP. I have dynamic text strings coming in, and variable font sizes.

I found a great way to cut the text up the way I want it from this thread: Smarter word-wrap in PHP for long words?

Using this block of code:

function smart_wordwrap($string, $width = 10, $break = "
") {
// split on problem words over the line length
$pattern = sprintf('/([^ ]{%d,})/', $width);
$output = '';
$words = preg_split($pattern, $string, -1, PREG_SPLIT_NO_EMPTY | PREG_SPLIT_DELIM_CAPTURE);

foreach ($words as $word) {
    if (false !== strpos($word, ' ')) {
        // normal behaviour, rebuild the string
        $output .= $word;
    } else {
        // work out how many characters would be on the current line
        $wrapped = explode($break, wordwrap($output, $width, $break));
        $count = $width - (strlen(end($wrapped)) % $width);

        // fill the current line and add a break
        $output .= substr($word, 0, $count) . $break;

        // wrap any remaining characters from the problem word
        $output .= wordwrap(substr($word, $count), $width, $break, true);
    }
}

// wrap the final output
return wordwrap($output, $width, $break);

}

This works great, but I need to find a way to feed a set pixel dimension (the constraining box), and font size into the above. The above function is using a character count - and if the font-size is very small obviously the character count needs to be larger and vice versa.

Is there anyway I could do this if I have the following variables?

$boxWidth = 200(px);
$text = (dynamic string);
$font = 'customfont.ttf'
$fontSize = (dynamic size);

I was thinking another loop to the word wrap function. Or maybe there's a way to edit the "explode" as I'm not entirely sure how that function works.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

As suggested by @Mark Baker I have implemented this behaviour using imagettfbbox()

  • Complete code-snippet with helper functions can be found here
  • I'm posting the relevant bits of code for reference

// utility functions to help text rendering on image

// Returns expected width of rendered text in pixels
public static function getWidthPixels(string $text, string $font, int $font_size): int {
    // https://www.php.net/manual/en/function.imageftbbox.php#refsect1-function.imageftbbox-returnvalues
    $bbox = imageftbbox($font_size, 0, $font, " " . $text);
    return $bbox[2] - $bbox[0];
}

// Returns wrapped format (with newlines) of a piece of text (meant to be rendered on an image)
// using the width of rendered bounding box of text
public static function wrapTextByPixels(
    string $text,
    int $line_max_pixels,
    int $font_size,
    string $font
): string {
    $words = explode(' ', $text);   // tokenize the text into words
    $lines = [];                             // Array[Array[string]]: array to store lines of words
    $crr_line_idx = 0;                       // (zero-based) index of current lines in which words are being added
    $crr_line_pixels = 0;                    // width of current line (in which words are being added) in pixels

    foreach ($words as $word) {
        // determine the new width of current line (in pixels) if the current word is added to it (including space)
        $crr_line_new_pixels = $crr_line_pixels + ImageTextRenderUtils::getWidthPixels(' ' . $word, $font, $font_size);
        // determine the width of current word in pixels
        $crr_word_pixels = ImageTextRenderUtils::getWidthPixels($word, $font, $font_size);


        if ($crr_word_pixels > $line_max_pixels) {
            // if the current word itself is too long to fit in single line
            // then we have no option: it must still be put in oneline only
            if ($crr_line_pixels == 0) {
                // but it is put into current line only if current line is empty
                $lines[$crr_line_idx] = array($word);
                $crr_line_idx++;
            } else {
                // otherwise if current line is non-empty, then the extra long word is put into a newline
                $crr_line_idx++;
                $lines[$crr_line_idx] = array($word);
                $crr_line_idx++;
                $crr_line_pixels = 0;
            }
        } else if ($crr_line_new_pixels > $line_max_pixels) {
            // otherwise if new width of current line (including current word and space)
            // exceeds the maximum permissible width, then force the current word into newline
            $crr_line_idx++;
            $lines[$crr_line_idx] = array($word);
            $crr_line_pixels = $crr_word_pixels;
        } else {
            // else if the current word (including space) can fit in the current line, then put it there
            $lines[$crr_line_idx][] = $word;
            $crr_line_pixels = $crr_line_new_pixels;
        }
    }

    // after the above foreach loop terminates, the $lines 2-d array Array[Array[string]]
    // would contain words segregated into lines to preserve the $line_max_pixels

    // now we just need to stitch together lines (array of word strings) into a single continuous piece of text with
    $concatenated_string = array_reduce(
        $lines,
        static function (string $wrapped_text, array $crr_line): string {
            return $wrapped_text . PHP_EOL . implode(' ', $crr_line);
        },
        ''
    );

    // the above process of concatenating lines into single piece of text will inadvertently
    // add an extra newline '
' character in the beginning; so we must remove that
    return StringUtils::removeFirstOccurrence($concatenated_string, "
");
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...