调整大小问题：基于用户输入的动态图像创建：Imagick：PHP：自动调整大小

Question

I am creating a dynamic Image on the base of User Input where I have 2 textboxes and 1 Image upload in form,

<?php
/* Create some objects */
$customImage = new Imagick('test.png');//dynamic image
$image = new Imagick();
$draw = new ImagickDraw();
$pixel = new ImagickPixel( '#FFF' );

/* New image */
$image->newImage(800, 75, $pixel);

/* Black text */
$draw->setFillColor('#a28430');

/* Font properties */
$draw->setFont('Roboto-Black.ttf');
$draw->setFontSize( 30 );


/* Create text */
$image->compositeImage($customImage,Imagick::COMPOSITE_DEFAULT, 10, 20);
$image->annotateImage($draw, 10, 50, 0, "First Line");// dynaimc text
$image->annotateImage($draw, 10, 70, 0, "second line");// dynamic text


/* Give image a format */
$image->setImageFormat('png');

/* Output the image with headers */
header('Content-type: image/png');
echo $image;

Current Image output of is

My sample uploaded Image

I already have pre-define font so I am using at as Roboto-Black.ttf and font-size, here I am $customImage getting as dynamic Image(where user uploaded) the Image and First Line and Second Line I am getting dynamic as well as test.png is also dynamic,

So, when I create the Image with I am defining the Image size $image->newImage(800, 75, $pixel); sometimes Image size is too big when test.png is small so after creating an Image is there any way to create the result Image as "auto" resize so it will auto adjust with the dynamic font and dynamic Image?

There is [resizeImage][3] from the but as a parameter it is expecting the height and width and I want as "auto"

Answer 1

Here's code that will perform a resize of the image based on the geometry (width) of the widest of two annotation text lines. This should help solve part of the challenges you have.

The code:

<?php

// >> Q: Resize image to the width of a text box (2 lines) using Imagick in PHP
// >> URL: https://stackoverflow.com/questions/62772906/resize-issue-dynamic-image-creation-on-the-base-of-user-input-imagick-php
//
// >> How to get geometry of an image using Imagick in PHP
// >> > https://www.php.net/manual/en/imagick.getimagegeometry.php
//
// >> How to get dimensions of text using Imagick in PHP
// >> > https://www.php.net/manual/en/imagick.queryfontmetrics.php

/* Create some objects */
$customImage = new Imagick('test.png');//dynamic image
$ciGeo=$customImage->getImageGeometry();  // >> 
$ciWidth=$ciGeo['width'];                 // >>
$ciHeight=$ciGeo['height'];               // >>
$ciAspect=$ciWidth/$ciHeight;             // >> > Aspect ratio (eg. 1=square)
$image = new Imagick();
$draw = new ImagickDraw();
$pixel = new ImagickPixel( '#FFF' );

/* Black text */
$draw->setFillColor('#a28430');

/* Font properties */
$draw->setFont('Roboto-Black.ttf');
$draw->setFontSize( 30 );

// >> Get two annotation text lines
$textLine1 = "First Line";
$textLine2 = "second line";
    
// >> Get text lines metrics to calculate geometry text box
$metricsL1 = $image->queryFontMetrics($draw, $textLine1);
$metricsL2 = $image->queryFontMetrics($draw, $textLine2);
$textWidth = $metricsL1['textWidth'];
if ($metricsL2['textWidth'] > $metricsL1['textWidth'])
{ $textWidth = $metricsL2['textWidth'];
};

// >> Resize images based on text box width
$diWidth = $textWidth + 20;                     // >> +20 = 2*10 padding
$diHeight = ($textWidth + 20)*$ciAspect;        // >> Height = width * aspect ratio 
$customImage->scaleImage($diWidth, $diHeight);  // >> Scale

// New image
$image->newImage($diWidth, $diHeight, $pixel);  // ++ 

// Create text
$image->compositeImage($customImage,Imagick::COMPOSITE_DEFAULT, 0, 0);
$image->annotateImage($draw, 10, 50, 0, $textLine1);// dynaimc text >>
$image->annotateImage($draw, 10, 70, 0, $textLine2);// dynamic text >>

// Give image a format
$image->setImageFormat('png');

// Output the image with headers
header('Content-type: image/png');
echo $image;

?>

a sketch output

Answer 2

Instead of trying to dynamically size things, it is probably easier to just pick a fixed to work with and scale what the user provides to match that.

For the upload it would look something like this:

define('IDEAL_WIDTH', 800);
define('IDEAL_HEIGHT', 800);

$customImage = new Imagick('test.png');//dynamic image
$customImage->scaleImage(IDEAL_WIDTH, IDEAL_HEIGHT);

And for your image where you are drawing text it would be:

$image->newImage(IDEAL_WIDTH, IDEAL_HEIGHT, $pixel);

You'll need to adjust where you are drawing your text slightly, but that should be really easy because you are working in a fixed area.

Other versions of this are to get a little crazier and ask the user for certain things like where they want the text and what font sizes to use.

Answer 3

This is more of a "hint" than answer; I do not use Imagick as I prefer Imagemagick with exec();

There is an example at the bottom of this thread: How do you append images that are already created with appendImage?

I was thinking along the lines of this before I found the above and you may be able to combine the two:

/* Create some objects */

$image = new Imagick();
$draw = new ImagickDraw();
$pixel = new ImagickPixel( '#FFF' );

/* New image */
$image->newImage(800, 75, $pixel);

/* Black text */
$draw->setFillColor('white');

/* Font properties */
$draw->setFont('Roboto-Black.ttf');
$draw->setFontSize( 30 );

/* Create text */
$image->annotateImage($draw, 10, 50, 0, "First Line");// dynaimc text
$image->annotateImage($draw, 10, 70, 0, "second line");// dynamic text

// Get the size of the image to esize the text
$size = getimagesize('MB75H.jpg');

// Resize the text - need to calculate the height from the new width
$image->resizeimage($size[0],100,Imagick::FILTER_LANCZOS,1);

// Load the second image
$image = new Imagick('MB75H.jpg');//dynamic image
$image->resetIterator();
$combined = $image->appendImages(true);

/* Give image a format */
$image->setImageFormat('png');

/* Output the image with headers */
header('Content-type: image/png');
echo $combined;