python 生成q版头像_在python中生成花式头像的最简单方法-CSDN博客

python 生成q版头像

This article is originally published in my personal blog.

本文最初发表在我的个人博客中。

This is a really short article, where I will show you how to generate cool avatars from a given string (email, username…) or from your logo using python.

这是一篇非常简短的文章，在这里我将向您展示如何使用给定的字符串(电子邮件，用户名...)或徽标使用python生成酷头像。

The idea for this article came to mind while I was working on a project where I have to set a default avatar for each user from the backend because I was dealing with a backend feeding two frontends, and maybe more in the future. But if you’re dealing with a single frontend, you would better consider doing it from the frontend, because it’s a lot easier.

在从事一个项目时，我想到了这篇文章的想法，在该项目中，我必须为后端的每个用户设置默认的头像，因为我正在处理一个后端，该后端为两个前端提供了信息，将来可能还会更多。但是，如果您要处理的是单个前端，则最好考虑从前端进行处理，因为它要容易得多。

Before I start, I want to mention that the professional way to do it, is by not generating the avatar, but instead using static images for default avatars, because It’s quicker, simpler, less error-prone, more future-proof, and ultimately looks better than generating them programmatically.

在开始之前，我想提到的专业方法是不生成化身，而是使用静态图像作为默认化身，因为它更快，更简单，更不易出错，更适合未来，并且最终看起来比以编程方式生成它们更好。

But, if you want to be really fancy like Google and have random colored circles and initials, you’re in the right place 😎

但是，如果您真的想像Google一样，并且有随机的彩色圆圈和缩写，那么您来对地方了😎

Let’s get started!

让我们开始吧！

头像使用缩写 (Avatars using initials)

# BUILT-IN
import re
import random# PIP
from cairosvg import svg2png
from xml.sax.saxutils import escape as xml_escapeCOLORS = [
    ['#DF7FD7', '#DF7FD7', '#591854'],
    ['#E3CAC8', '#DF8A82', '#5E3A37'],
    ['#E6845E', '#E05118', '#61230B'],
    ['#E0B050', '#E6CB97', '#614C23'],
    ['#9878AD', '#492661', '#C59BE0'],
    ['#787BAD', '#141961', '#9B9FE0'],
    ['#78A2AD', '#104F61', '#9BD1E0'],
    ['#78AD8A', '#0A6129', '#9BE0B3'],
    ['#AD8621', '#6B5621', '#E0AD2B'],
]INITIALS_SVG_TEMPLATE = """
<svg xmlns="<http://www.w3.org/2000/svg>" 
	pointer-events="none" 
	width="200" height="200">
  <defs>
    <linearGradient id="grad">
    <stop offset="0%" stop-color="{color1}" />
    <stop offset="100%" stop-color="{color2}" />
    </linearGradient>
  </defs>
  <rect width="200" height="200" rx="0" ry="0" fill="url(#grad)"></rect>
  <text text-anchor="middle" y="50%" x="50%" dy="0.35em"
        pointer-events="auto" fill="{text_color}" font-family="sans-serif"
        style="font-weight: 400; font-size: 80px">{text}</text>
</svg>
""".strip()
INITIALS_SVG_TEMPLATE = re.sub('(\\s+|\\n)', ' ', INITIALS_SVG_TEMPLATE)def get_png_avatar(text, output_file):    initials = ':)'    text = text.strip()
    if text:
        split_text = text.split(' ')
        if len(split_text) > 1:
            initials = split_text[0][0] + split_text[-1][0]
        else:
            initials = split_text[0][0]    random_color = random.choice(COLORS)
    svg_avatar = INITIALS_SVG_TEMPLATE.format(**{
        'color1': random_color[0],
        'color2': random_color[1],
        'text_color': random_color[2],
        'text': xml_escape(initials.upper()),
    }).replace('\\n', '')    svg2png(svg_avatar, write_to=output_file)

What I did here is that I take a pre-prepared SVG template, I fill it with the initials, and background color, and that is it!!

我在这里所做的是，我准备了一个预先准备的SVG模板，在其中填充了首字母缩写和背景色，就是这样！

Let’s test it,

让我们测试一下

import string
from io import BytesIO
from PIL import Image
from avatar_generator import get_png_avatar
rawIO = BytesIO()
get_png_avatar('AymaneMx', rawIO)
byteImg = Image.open(rawIO)
filename = ''.join(random.choices(string.ascii_uppercase + string.digits, k=8))
byteImg.save(filename + '.png', 'PNG')

Run, and the result will be a PNG image like this:

运行，结果将是这样的PNG图像：

While playing with the SVG template, I discovered that I can make an icon or a logo instead of a text, which brings us to the next part.

在使用SVG模板时，我发现可以制作一个图标或徽标而不是文本，这使我们进入了下一部分。

使用您的徽标的头像 (Avatars using your Logo)

To use your logo, you need only to change the text tag in the previous SVG template with a tag of your logo.

要使用徽标，只需更改带有徽标标签的SVG模板中的text标签即可。

For example, I will use the Twitter logo, I downloaded the SVG version from Twitter Brand Resources.

例如，我将使用Twitter徽标，我从Twitter Brand Resources下载了SVG版本。

After opening it with any editor you will see:

用任何编辑器打开它后，您将看到：

<svg xmlns="http://www.w3.org/2000/svg" id="Logo_FIXED" data-name="Logo — FIXED" viewBox="0 0 400 400">
    <defs>
        <style>.cls-1{fill:none;}.cls-2{fill:#1da1f2;}</style>
    </defs>
    <title>Twitter_Logo_Blue</title>
    <rect class="cls-1" width="400" height="400"/>
    <path class="cls-2"
          d="M153.62,301.59c94.34,0,145.94-78.16,145.94-145.94,0-2.22,0-4.43-.15-6.63A104.36,104.36,0,0,0,325,122.47a102.38,102.38,0,0,1-29.46,8.07,51.47,51.47,0,0,0,22.55-28.37,102.79,102.79,0,0,1-32.57,12.45,51.34,51.34,0,0,0-87.41,46.78A145.62,145.62,0,0,1,92.4,107.81a51.33,51.33,0,0,0,15.88,68.47A50.91,50.91,0,0,1,85,169.86c0,.21,0,.43,0,.65a51.31,51.31,0,0,0,41.15,50.28,51.21,51.21,0,0,1-23.16.88,51.35,51.35,0,0,0,47.92,35.62,102.92,102.92,0,0,1-63.7,22A104.41,104.41,0,0,1,75,278.55a145.21,145.21,0,0,0,78.62,23"/>
</svg>

As you may notice, the path tag is the one responsible for the logo/icon.

您可能会注意到， path标签是负责徽标/图标的标签。

So, let’s copy that in our SVG template, group it in a g tag, and addfill argument so we can change the color;

因此，让我们将其复制到SVG模板中，将其分组在g标签中，并添加fill参数，以便我们可以更改颜色；

LOGO_SVG_TEMPLATE = """
<svg xmlns="<http://www.w3.org/2000/svg>" width="400px" height="400px" viewBox="0 0 400 400">
    <rect class="cls-1" width="400" height="400" fill="{color1}" />
    <g width="400px" height="400px">
        <path 
            fill="{logo_color}" 
            d="M153.62,301.59c94.34,0,145.94-78.16,145.94-145.94,0-2.22,0-4.43-.15-6.63A104.36,104.36,0,0,0,325,122.47a102.38,102.38,0,0,1-29.46,8.07,51.47,51.47,0,0,0,22.55-28.37,102.79,102.79,0,0,1-32.57,12.45,51.34,51.34,0,0,0-87.41,46.78A145.62,145.62,0,0,1,92.4,107.81a51.33,51.33,0,0,0,15.88,68.47A50.91,50.91,0,0,1,85,169.86c0,.21,0,.43,0,.65a51.31,51.31,0,0,0,41.15,50.28,51.21,51.21,0,0,1-23.16.88,51.35,51.35,0,0,0,47.92,35.62,102.92,102.92,0,0,1-63.7,22A104.41,104.41,0,0,1,75,278.55a145.21,145.21,0,0,0,78.62,23"
        />
    </g>
</svg>
""".strip()
LOGO_SVG_TEMPLATE = re.sub('(\\s+|\\n)', ' ', LOGO_SVG_TEMPLATE)def get_png_avatar_from_logo(output_file):    random_color = random.choice(COLORS)    svg_avatar = LOGO_SVG_TEMPLATE.format(**{
        'color1': random_color[0],
        'logo_color': random_color[2],
    }).replace('\\n', '')    svg2png(svg_avatar, write_to=output_file)

Run a test,

进行测试

rawIO = BytesIO()
filename = ''.join(random.choices(string.ascii_uppercase + string.digits, k=8))
get_png_avatar_from_logo(rawIO)
byteImg = Image.open(rawIO)
byteImg.save(filename + '.png', 'PNG')

The result will be something like this:

结果将是这样的：

Now, you are maybe wondering how can I get an SVG file of my logo?

现在，您可能想知道如何获取徽标的SVG文件？

The answer to that is that you can ask your designer gently for it, or you can do it yourself, using Photoshop/Illustrator by exporting your logo as an SVG file.

答案是，您可以轻柔地问设计师，也可以使用Photoshop / Illustrator自己将徽标导出为SVG文件来自己做。

But the simple way, (which is why you’re here) is by using an online tool as online-convert, I use it for my shitty logo, and here is the result;

但是，最简单的方法(这就是您在这里的原因)是通过使用在线工具进行online-convert ，我将其用于糟糕的徽标，结果如下；