Generated profile picture does appear a second later and is not positioned correct

[MariusBluem]

I think this was a PR from you @rullzer ... #6876

• should appear directly after loading
• should be exactly in the middle
• should be re-generated if the name was changed:

[MorrisJobke]

should be exactly in the middle

Damn ... that one is hard. I tried a lot, but some characters somehow are not properly positioned so I added a little offset: https://github.com/nextcloud/server/pull/6876/files#diff-b32c4056021bc99b934fe5c4de05b79bR256

Could you remove that line and check again?

[rullzer]

PR with some fixes (help is welcome) in #7498

[danxuliu]

should be exactly in the middle

Damn ... that one is hard. I tried a lot, but some characters somehow are not properly positioned

I am not sure if that can be achieved using PHP GD. imagettftext seems to have only pixel accuracy (the X and Y positions are integers), but to get a proper alignment sub-pixel accuracy would be needed (for example, if the width of the character bounding box is an odd value).

Generating the avatar in a large enough size for the values to become integers (in the example above, twice as large) and then scaling it down would not work either, as the character would lose crispness.

An option would be to generate the avatar like it is done now, but with a margin on each side. Then, the image would be translated (the margins are needed to have enough room to translate the image without losing the background colour) so the character is in the right place and the resulting image would be cropped to the final size. But again this would need sub-pixel accuracy in PHP GD when transforming images, which I do not know if it is available.

Probably something like PHP Cairo or PHP ImageMagick would be needed to align the character exactly in the middle (I have not checked their features, but I guess that they have support for rendering text with sub-pixel accuracy).

[rullzer]

Somewhat related to this. We should start using srcset for avatars. That way we can just serve higer resolution images. The advantage is that it will work properly on HiDPI screens. But higher resolution images will also center it 'better' by default ;)