4

我正在创建一个带有文本的动态图像的网络应用程序。绘制的每个字符串可能有多种颜色。

到目前为止,我已经创建了一个解析方法和一个渲染方法。parse 方法只获取字符串,并从中解析颜色,它们的格式如下:“§a这是绿色§r这是白色”(是的,它是 Minecraft)。所以这就是我的字体模块的样子:

# Imports from pillow
from PIL import Image, ImageDraw, ImageFont

# Load the fonts
font_regular = ImageFont.truetype("static/font/regular.ttf", 24)
font_bold = ImageFont.truetype("static/font/bold.ttf", 24)
font_italics = ImageFont.truetype("static/font/italics.ttf", 24)
font_bold_italics = ImageFont.truetype("static/font/bold-italics.ttf", 24)

max_height = 21 # 9, from FONT_HEIGHT in FontRederer in MC source, multiplied by
                # 3, because each virtual pixel in the font is 3 real pixels
                # This number is also returned by:
                # font_regular.getsize("ABCDEFGHIJKLMNOPQRSTUVWXYZ")[1] 

# Create the color codes
colorCodes = [0] * 32 # Empty array, 32 slots
# This is ported from the original MC java source:
for i in range(0, 32):
    j = int((i >> 3 & 1) * 85)
    k = int((i >> 2 & 1) * 170 + j)
    l = int((i >> 1 & 1) * 170 + j)
    i1 = int((i >> 0 & 1) * 170 + j)
    if i == 6:
        k += 85
    if i >= 16:
        k = int(k/4)
        l = int(l/4)
        i1 = int(i1/4)
    colorCodes[i] = (k & 255) << 16 | (l & 255) << 8 | i1 & 255

def _get_colour(c):
    ''' Get the RGB-tuple for the color
    Color can be a string, one of the chars in: 0123456789abcdef
    or an int in range 0 to 15, including 15
    '''
    if type(c) == str:
        if c == 'r':
            c = int('f', 16)
        else:
            c = int(c, 16)
    c = colorCodes[c]
    return ( c >> 16 , c >> 8 & 255 , c & 255 )

def _get_shadow(c):
    ''' Get the shadow RGB-tuple for the color
    Color can be a string, one of the chars in: 0123456789abcdefr
    or an int in range 0 to 15, including 15
    '''
    if type(c) == str:
        if c == 'r':
            c = int('f', 16)
        else:
            c = int(c, 16)
    return _get_colour(c+16)

def _get_font(bold, italics):
    font = font_regular
    if bold and italics:
        font = font_bold_italics
    elif bold:
        font = font_bold
    elif italics:
        font = font_italics
    return font

def parse(message):
    ''' Parse the message in a format readable by render
    this will return a touple like this:
    [((int,int),str,str)]
    so if you where to send it directly to the rederer you have to do this:
    render(pos, parse(message), drawer)
    '''
    result = []
    lastColour = 'r'
    total_width = 0
    bold = False
    italics = False
    for i in range(0,len(message)):
        if message[i] == '§':
            continue
        elif message[i-1] == '§':
            if message[i] in "01234567890abcdef":
                lastColour = message[i]
            if message[i] == 'l':
                bold = True
            if message[i] == 'o':
                italics = True
            if message[i] == 'r':
                bold = False
                italics = False
                lastColour = message[i]  
            continue
        width, height = _get_font(bold, italics).getsize(message[i])
        total_width += width
        result.append(((width, height), lastColour, bold, italics, message[i]))
    return result

def get_width(message):
    ''' Calculate the width of the message
    The message has to be in the format returned by the parse function
    '''
    return sum([i[0][0] for i in message])


def render(pos, message, drawer):
    ''' Render the message to the drawer
    The message has to be in the format returned by the parse function
    '''
    x = pos[0]
    y = pos[1]
    for i in message:
        (width, height), colour, bold, italics, char = i
        font = _get_font(bold, italics)
        drawer.text((x+3, y+3+(max_height-height)), char, fill=_get_shadow(colour), font=font)
        drawer.text((x, y+(max_height-height)), char, fill=_get_colour(colour), font=font)
        x += width

它确实有效,但是应该在字体底线以下的字符,如 g、y 和 q,被渲染在底线上,所以看起来很奇怪,这是一个例子:

关于如何使它们正确显示的任何想法?还是我必须制作自己的偏移表,手动放置它们?

4

1 回答 1

6

鉴于您无法从 PIL 获得偏移量,您可以通过切片图像来做到这一点,因为 PIL 适当地组合了多个字符。这里我有两种方法,但我认为第一种方法更好,尽管它们都只有几行。第一种方法给出了这个结果(它也是一个小字体的放大,这就是它被像素化的原因):

在此处输入图像描述

为了解释这里的想法,假设我想要字母“j”,而不是只制作一个“j”的图像,我制作一个“o j”的图像,因为这将保持“j”正确对齐。然后我裁剪我不想要的部分,只保留'j'(通过textsize同时使用'o'和'o j')。

import Image, ImageDraw
from random import randint
make_color = lambda : (randint(50, 255), randint(50, 255), randint(50,255))

image = Image.new("RGB", (1200,20), (0,0,0)) # scrap image
draw = ImageDraw.Draw(image)
image2 = Image.new("RGB", (1200, 20), (0,0,0)) # final image

fill = " o "
x = 0
w_fill, y = draw.textsize(fill)
x_draw, x_paste = 0, 0
for c in "The quick brown fox jumps over the lazy dog.":
    w_full = draw.textsize(fill+c)[0]
    w = w_full - w_fill     # the width of the character on its own
    draw.text((x_draw,0), fill+c, make_color())
    iletter = image.crop((x_draw+w_fill, 0, x_draw+w_full, y))
    image2.paste(iletter, (x_paste, 0))
    x_draw += w_full
    x_paste += w
image2.show()

顺便说一句,我使用'o',而不仅仅是'o',因为相邻的字母似乎会稍微相互腐蚀。

第二种方法是制作整个字母表的图像,将其切片,然后将其重新粘贴在一起。这比听起来容易。这是一个示例,构建字典和连接到图像中都只有几行代码:

import Image, ImageDraw
import string

A = " ".join(string.printable)

image = Image.new("RGB", (1200,20), (0,0,0))
draw = ImageDraw.Draw(image)

# make a dictionary of character images
xcuts = [draw.textsize(A[:i+1])[0] for i in range(len(A))]
xcuts = [0]+xcuts
ycut = draw.textsize(A)[1]
draw.text((0,0), A, (255,255,255))
# ichars is like {"a":(width,image), "b":(width,image), ...}
ichars = dict([(A[i], (xcuts[i+1]-xcuts[i]+1, image.crop((xcuts[i]-1, 0, xcuts[i+1], ycut)))) for i in range(len(xcuts)-1)])

# Test it...
image2 = Image.new("RGB", (400,20), (0,0,0))
x = 0
for c in "This is just a nifty text string":
    w, char_image = ichars[c]
    image2.paste(char_image, (x, 0))
    x += w

这是结果字符串的(放大)图像:

在此处输入图像描述

这是整个字母表的图像:

在此处输入图像描述

这里的一个技巧是我必须在原始字母图像中的每个字符之间放置一个空格,否则相邻的字符会相互影响。

我想如果您需要对有限范围的字体和字符执行此操作,那么预先计算字母图像字典将是一个好主意。

或者,对于不同的方法,使用像 numpy 这样的工具,您可以轻松确定ichar上面字典中每个字符的 yoffset(例如,沿每个水平行取最大值,然后在非零索引上找到最大值和最小值)。

于 2013-10-06T20:04:27.343 回答