ui-avatars Center text?

Center text?

Open HsRealDev opened this issue 6 years ago • 11 comments

Hi,

sorry, my OCD is bugging me again.

Could it be possible to center the text on the image?

Example of an avatar where text is not in aligned to the center: https://ui-avatars.com/api/?name=II&size=250

ps. Awesome service to help out with project bootstrapping.

Oct 17 '17 08:10 HsRealDev

Thank you!

Sure thing, I will attempt to make centering better! 👍

Oct 17 '17 21:10 LasseRafn

Hi Lasse,

I did some more debugging. And as one friend of mine once said: "The sitation is strange." :D

Changing the driver of ImageManager to Imagick in InitialAvatar class ...

InitialAvatar.php, line 34:
$this->image = new ImageManager(['driver' => 'imagick']);

... makes text to get then properly aligned in horizontal but the vertical alignment then goes wrong :)

Bugger.

Maybe there be a bug somewhere in Intervention -> Image lib. Or with the font.

Oct 18 '17 13:10 HsRealDev

And I debugged even a bit more using directly ImageMagick. I did this simple command line script:

<?php
declare(strict_types=1);

$fontFileName = 
    "/tmp/fonts/OpenSans-Regular.ttf";

$fillColor       = new \ImagickPixel('#000');
$strokeColor     = new \ImagickPixel('#000');
$backgroundColor = new \ImagickPixel('#f7f924');

$initials = 'PM';

$avatarSize = 256;
$fontSize   = 0.5 * $avatarSize;

$draw = new \ImagickDraw();
$draw->setStrokeColor($strokeColor);
$draw->setFillColor($fillColor);
$draw->setStrokeWidth(2);
$draw->setFontSize($fontSize);

$draw->setFont(
    $fontFileName
);

$draw->setGravity(\Imagick::GRAVITY_CENTER);
$draw->annotation(0, 0, $initials);

$imagick = new \Imagick();
$imagick->newImage($avatarSize, $avatarSize, $backgroundColor);
$imagick->drawImage($draw);
$imagick->writeImage("/tmp/test.png");

That one also has some problems to place the text correctly "exactly" aligned. But, IMHO, has better general output on different fonts and sizes.

What do you think Lasse? If you feel like this won't fix on UI-avatars, i understand :) In that case, just close this issue.

Oct 18 '17 15:10 HsRealDev

Sorry for the crazy slow response, been super busy. Anyway, I think this makes sense 👍 Will try to experiment and compare the two, maybe add an option to use one, but default to the most correct one

Apr 08 '18 20:04 LasseRafn

Hi this is a really useful service however this off centre issue is starting to bug me too. Is there any update on fixing this?