Avatar mit Initialen immer mit gleicher Hintergrundfarbe möglich?

hfichtner · February 10, 2021 at 10:26 AM

Hallo zusammen,

die kunterbunten Avatar mit Initialen und unterschiedlicher Hintergrundfarbe stört mich im Design meiner Seite.

Wie kann man eine generelle Hintergrundfarbe für die Initialen definieren?

Grüße

Hajö

**Alexander Ebert** · February 10, 2021 at 12:02 PM Official Post

Hallo,

das ist nicht möglich, die Hintergrundfarbe wird fest auf Basis des Benutzernamens berechnet. Bei gleichbleibenden Hintergrundfarben verliert man auch das Unterscheidungskriterien bei Benutzernamen mit den selben Initialen, weil sich diese nicht länger unterscheiden.

hfichtner · February 10, 2021 at 2:25 PM

Hallo,

das ist klar, aber man müsste doch die Funktion der Berechnung der Hintergründe durch einen festen Farbwert ersetzen können, oder?

Grüße

Hajö

SoftCreatR · February 10, 2021 at 2:52 PM

Quote from hfichtner

Hallo,
das ist klar, aber man müsste doch die Funktion der Berechnung der Hintergründe durch einen festen Farbwert ersetzen können, oder?

Grüße
Hajö

Ist dann halt Scheiße (und mit dem nächsten Update rückgängig gemacht):

Diff: lib/data/user/avatar/DefaultAvatar.class.php

@@ -1,3 +1,3 @@
 $svg = <<<SVG
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="128" height="128"><path fill="#{$backgroundColor}" d="M0 0h16v16H0z"/><text x="8" y="8" fill="#{$textColor}" text-anchor="middle" dy=".3em" font-family="Arial" font-size="7">{$text}</text></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="128" height="128"><path fill="#000fff" d="M0 0h16v16H0z"/><text x="8" y="8" fill="#fff" text-anchor="middle" dy=".3em" font-family="Arial" font-size="7">{$text}</text></svg>
 SVG;

hfichtner · February 10, 2021 at 3:08 PM

Vielen Dank.

norse · February 10, 2021 at 3:18 PM

Hier mal ein Beispiel der Auswirkungen: https://www.woltlab.com/members-list/?…der=ASC&letter=

Mit der Änderung hätten 22 der 30 auf dieser Seite gelisteten Benutzer identische Avatare.

Gruß norse

hfichtner · February 10, 2021 at 3:21 PM

Hallo norse,

da habt ihr natürlich recht, aber wenn ich den Silhouette Avatar einrichte, wäre ja auch jeder identisch.

Und ich finde einfach, dass es massiv das Design stört, wenn es da so bunt wird...

Muss nochmal drüber nachdenken.

Danke und Grüße

Hajö

Susi · February 11, 2021 at 9:20 AM

Könnte man dort anstatt der Farbe eigentlich auch ein Bild als Hintergrund angeben?

SoftCreatR · February 11, 2021 at 9:27 AM

Quote from Susi

Könnte man dort anstatt der Farbe eigentlich auch ein Bild als Hintergrund angeben?

Theoretisch. Dazu bedarf es jedoch einem Pattern:

XML

<defs>
  <pattern id="bg" patternUnits="userSpaceOnUse" width="128" height="128">
    <image href="background.jpg" x="0" y="0" width="128" height="128" />
  </pattern>
</defs>

Und der anschließenden Nutzung:

XML

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="128" height="128"><path fill="url(#bg)" d="M0 0h16v16H0z"/><text x="8" y="8" fill="#{$textColor}" text-anchor="middle" dy=".3em" font-family="Arial" font-size="7">{$text}</text></svg>

Sollte am Ende etwa so aussehen:

XML

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="128" height="128"><defs><pattern id="bg" patternUnits="userSpaceOnUse" width="128" height="128"><image href="background.jpg" x="0" y="0" width="128" height="128"/></pattern></defs><path fill="url(#bg)" d="M0 0h16v16H0z"/><text x="8" y="8" fill="#{$textColor}" text-anchor="middle" dy=".3em" font-family="Arial" font-size="7">{$text}</text></svg>

Allerdings ungetestet.

Participate now!