GDI+ 在Delphi程序的应用 -- 可调节的文字阴影特效

利用GDI+输出文字阴影效果有多种方法，最简单的就是第一次输出有偏移的灰色文字，第二次输出正常文字。下面是仿C#文字输出例子里的代码片断，输出了这种带阴影的文字：

serifFontFamily := TGpFontFamily.GenericSerif;
//Load the fonts we want to use
titleFont := TGpFont.Create(serifFontFamily, 60);
//Load the image to be used for the textured text from the exe's resource fork
textImage := TGpBitmap.Create('....mediamarble.jpg');
textTextureBrush := TGpTextureBrush.Create(textImage);
//Set up shadow brush - make it translucent
titleShadowBrush := TGpSolidBrush.Create(ARGB(70, kcBlack));

//Draw a textured string
s := 'Graphics Samples';
g.DrawString(s, titleFont, titleShadowBrush, 15, 25);
g.DrawString(s, titleFont, textTextureBrush, 10, 20);
效果图如下（作了适当缩小）：



显然，这种文字阴影效果不太令人满意，没有那种半阴影的效果。

网上介绍了一种“借助GDI+的反走样能力生成透明的阴影与半阴影”的文字阴影方法，其原理是将要输出的文字输出按一定比例缩小，以某种半灰调输出到一个按同样比例缩小的内存位图中，然后设置画布插值模式为高质量双三次插值法，再将位图放大到实际画布大小输出，因为双三次插值放大使文本的边缘产生Alpha模糊，这样就出现阴影与半影效果，下面是这种方法的Delphi代码：

procedure PaintText(g: TGpGraphics);
var
brush: TGpLinearGradientBrush;
font: TGpFont;
fontFamily: TGpFontFamily;
r: TGpRect;
bmp: TGpBitmap;
bg: TGpGraphics;
m: TGpMatrix;
begin
fontFamily := TGpFontFamily.Create('Times New Roman');
font := TGpFont.Create(fontFamily, 50, [fsBold], utPixel);
r := GpRect(Form1.PaintBox1.ClientRect);
brush := TGpLinearGradientBrush.Create(r, kcBlue, kcAliceBlue, 90);
// 填充渐变背景
g.FillRectangle(brush, r);
// 建立内存位图，其大小是画布的1/4
bmp := TGpBitmap.Create(r.Width shr 2, r.Height shr 2, g);
bg := TGpGraphics.Create(bmp);
bg.TextRenderingHint := thAntiAlias;
// 按1/4缩放输出阴影文字，并平移(3, 3)
m := TGpMatrix.Create(0.25, 0, 0, 0.25, 3, 3);
bg.SetTransform(m);
bg.DrawString('文字阴影特效', font, Brushs[ARGB(128, 0, 0, 0)], 10, r.Height / 3);
// 设置插值模式为高质量双三次插值法
g.InterpolationMode := imHighQualityBicubic;
g.TextRenderingHint := thAntiAlias;
// 放大输出阴影位图到画布
g.DrawImage(bmp, r, 0, 0, bmp.Width, bmp.Height, utPixel);
// 输出正常文字
g.DrawString('文字阴影特效', font, Brushs.White, 10, r.Height / 3);
m.Free;
bg.Free;
bmp.Free;
brush.Free;
font.Free;
fontFamily.Free;
end;
代码中已经作了注释，就不再详细讲解，下面是运行效果截图，图的上部分是带阴影的文字输出截图，下部分是单独的阴影输出截图：



从效果图，特别是从上半部分截图看，文字的阴影效果要比前面简单的文字阴影效果好，其阴影边缘有一定的半影效果；但是从下半部分单独的文字阴影输出图看，还是觉得不尽人意。首先是边缘模糊效果不太明显，其次是阴影半影部分，也就是边缘模糊部分有太强的放大痕迹，再次就是此方法无多大调节余地，想得到更明显的半影效果的办法就是进一步缩小阴影文字比例，但由此带来的锯齿状显然更突出。看来，想要得到好的文字阴影效果，如PhotoShop式样中的投影效果，得另辟途径。

经过研究，PhotoShop式样中的投影效果其实就是一种高斯模糊效果。一般的图像高斯模糊是对图像各像素的RGB用高斯卷积矩阵进行卷积处理（关于高斯模糊请看我的文章《GDI+ 在Delphi程序的应用 -- 图像卷积操作及高斯模糊》），而要处理文字阴影效果只需要建立一个透明的32位ARGB格式内存位图，将文字用一定的阴影色调输出到位图，然后用高斯模糊矩阵对位图的Alpha字节进行卷积处理，就可达到很好的效果。下面是函数代码：

// 卷积处理阴影效果。Data: GDI+位图数据，要求32位ARGB格式; Source: 复制的源
// ConvolMatrix: 卷积矩阵; MatrixSize：矩阵大小, Nuclear: 卷积核（必须大于0）
procedure MakeShadow(Data: TBitmapData; Source: Pointer;
ConvolMatrix: array of Integer; MatrixSize, Nuclear: LongWord);
var
Radius, mSize, rSize: LongWord;
x, y: LongWord;
Width, Height: Integer;
Matrix: Pointer;
asm
push esi
push edi
push ebx

mov esi, edx // esi = Source + 3 (Alpha byte)
add esi, 3
mov edi, [eax + 16] // edi = Data.Scan0
mov Matrix, ecx // Matrix = ConvolMatrix
mov ecx, MatrixSize
mov edx, ecx
dec ecx
mov ebx, [eax]
sub ebx, ecx
mov Width, ebx // Width = Data.Width - (MatrixSize - 1)
mov ebx, [eax + 4]
sub ebx, ecx
mov Height, ebx // Height = Data.Height - (MatrixSize - 1)
shr ecx, 1
mov Radius, ecx // Radius = MatrixSize / 2
mov eax, [eax + 8]
mov mSize, eax
shl edx, 2
sub mSize, edx // mSize = Data.Stride - MatrixSize * 4
add eax, 4
imul eax, ecx
add edi, eax // edi = edi + (Data.Stride * Radius + Radius * 4)
add edi, 3 // edi += 3 (Alpha byte)
shl ecx, 3
mov rSize, ecx // rSize = Radius * 2 * 4
mov ebx, Nuclear // ebx = Nuclear

mov y, 0 // for (y = 0; y < Height; y ++)
@yLoop: // {
mov x, 0 // for (x = 0; x < Width; x ++)
@xLoop: // {
push esi // Save(esi)
push edi // Save(edi)
mov edi, Matrix // edi = Matrix

xor eax, eax // eax = 0
//用卷积矩阵处理Alpha字节
mov ecx, MatrixSize // for (I = 0; I < MatrixSize; I ++)
@Loop3: // {
push ecx
mov ecx, MatrixSize // for (J = 0; J <= MatrixSize; J ++)
@Loop4: // {
movzx edx, [esi] // edx = *esi (Alpha byte)
imul edx, [edi]
add eax, edx // eax += edx * *edi
add esi, 4 // esi += 4
add edi, 4 // edi ++
loop @Loop4 // }
add esi, mSize // esi += mSize
pop ecx
loop @Loop3 // }
cdq
idiv ebx // eax /= ebx
pop edi // Result(edi)
mov [edi], al // *edi = al
add edi, 4 // edi += 4
pop esi // Reset(esi) esi += 4
add esi, 4

inc x
mov eax, x
cmp eax, Width
jl @xLoop // }
add esi, rSize
add edi, rSize
inc y
mov eax, y
cmp eax, Height
jl @yLoop // }

pop ebx
pop edi
pop esi
end;

procedure GdipShadow(Bmp: TGpBitmap; Radius: LongWord);
var
Data: TBitmapData;
Gauss: array of Integer;
Q: Double;
x, y, n, z: Integer;
p: PInteger;
Buf: Pointer;
begin
// 根据半径计算高斯模糊矩阵
Q := Radius / 2;
if Q = 0 then Q := 0.1;
n := Radius shl 1 + 1;
SetLength(Gauss, n * n);
p := @Gauss[0];
z := 0;
for x := -Radius to Radius do
for y := -Radius to Radius do
begin
p^ := Round(Exp(-(x * x + y * y) / (2.0 * Q * Q)) / (2.0 * PI * Q * Q) * 1000.0);
Inc(z, p^);
Inc(p);
end;
Data := Bmp.LockBits(GpRect(0, 0, Bmp.Width, Bmp.Height), [imRead, imWrite], pf32bppARGB);
GetMem(Buf, Data.Height * Data.Stride);
try
// 备份源数据
Move(Data.Scan0^, Buf^, Data.Height * Data.Stride);
// 高斯卷积处理阴影效果
MakeShadow(Data, Buf, Gauss, n, z);
finally
FreeMem(Buf);
Bmp.UnlockBits(Data);
end;
end;

// 计算并输出文字阴影效果
// g: 文字输出的画布; str要输出的文字; font: 字体; layoutRect: 限定的文字输出范围
// ShadowSize: 阴影大小; Distance: 阴影距离;
// Angle: 阴影输出角度(左边平行处为0度。顺时针方向)
// ShadowAlpha: 阴影文字的不透明度; format: 文字输出格式
procedure DrawShadowString(const g: TGpGraphics; const str: WideString;
const font: TGpFont; const layoutRect: TGpRectF;
ShadowSize, Distance: LongWord; Angle: Single = 60;
ShadowAlpha: Byte = 192; const format: TGpStringFormat = nil); overload;
var
Bmp: TGpBitmap;
Bg: TGpGraphics;
dr, sr: TGpRectF;
begin
sr := GpRect(ShadowSize shl 1, ShadowSize shl 1, layoutRect.Width, layoutRect.Height);
// 建立透明的32位ARGB阴影位图，其大小为layoutRect长、宽度 + ShadowSize * 4
Bmp := TGpBitmap.Create(Round(sr.Width) + ShadowSize shl 2,
Round(sr.Height) + ShadowSize shl 2, pf32bppARGB);
Bg := TGpGraphics.Create(Bmp);
try
Bg.TextRenderingHint := thAntiAlias;
// 以不透明度为ShadowAlpha的黑色画刷，
// 在2倍ShadowSize偏移处输出文字到位图画布，
Bg.DrawString(str, font, Brushs[ARGB(ShadowAlpha, kcBlack)], sr, format);
// 处理文字阴影效果
GdipShadow(Bmp, ShadowSize);
dr := layoutRect;
// 根据角度计算阴影位图在目标画布的偏移量
Offset(dr, Cos(pi * Angle / 180) * Distance,
Sin(pi * Angle / 180) * Distance);
// 扩大源和目标矩形，以输出边缘半影部分
Inflate(dr, ShadowSize, ShadowSize);
Inflate(sr, ShadowSize, ShadowSize);
// 输出阴影位图到目标画布
g.DrawImage(Bmp, dr, sr.X, sr.Y, sr.Width, sr.Height, utPixel);
finally
Bg.Free;
Bmp.Free;
end;
end;
// 计算并输出文字阴影效果，除以输出点origin替代上面布局矩形外，其他参数同上
procedure DrawShadowString(const g: TGpGraphics; const str: WideString;
const font: TGpFont; const origin: TGpPointF;
ShadowSize, Distance: LongWord; Angle: Single = 60;
ShadowAlpha: Byte = 192; const format: TGpStringFormat = nil); overload;
begin
DrawShadowString(g, str, font, g.MeasureString(str, font, origin, format),
ShadowSize, Distance, Angle, ShadowAlpha, format);
end;

代码中已经含比较详细的注释，就不再讲解了，本文介绍的函数最大的特点就是阴影的大小、间隔距离、输出角度以及不透明度可根据需要调整；阴影效果也很好，边缘模糊均匀，线条圆润平滑，可与一般的PhotoShop文字阴影效果相媲美；由于核心函数MakeShadow代码采用BASM，且只处理了像素的Alpha字节，边界处理也省略了，因此处理速度还是较满意的。为了照顾需要pascal代码的朋友，下面给出该函数的pascal版本，速度比BASM版本慢很多，不过，通过其中的代码和注释可以加深了解该函数的原理：

// 卷积处理阴影效果。Data: GDI+位图数据，要求32位ARGB格式; Source: 复制的源
// ConvolMatrix: 卷积矩阵; MatrixSize：矩阵大小, Nuclear: 卷积核（必须大于0）
procedure MakeShadow(Data: TBitmapData; Source: Pointer;
ConvolMatrix: array of Integer; MatrixSize, Nuclear: LongWord);
var
x, y, I, J: Integer;
Width, Height, mSize, rSize: Integer;
v, Radius, Count: Integer;
pd, ps, ps1: PByte;
begin
Radius := MatrixSize shr 1;
Width := Data.Width - Radius shl 1;
Height := Data.Height - Radius shl 1;
mSize := Data.Stride - MatrixSize shl 2;
rSize := Radius shl 3;
Count := MatrixSize * MatrixSize;
// pd 指向目标偏移地址为卷积半径后像素的Alpha字节
// 为简化过程，不处理以Radius为半径的边界像素
pd := Data.Scan0;
Inc(pd, Radius * Data.Stride + Radius * 4 + 3);
// ps 指向源首像素地址的Alpha字节，也就是目标首像素第一个卷积乘数的像素点
ps := Source;
Inc(ps, 3);
for y := 1 to Height do
begin
for x := 1 to Width do
begin
ps1 := ps;
v := 0;
for I := 0 to count - 1 do
begin
if (I <> 0) and (I mod MatrixSize = 0) then
Inc(ps1, mSize);
Inc(v, ConvolMatrix[I] * ps1^); // Alpha字节卷积求和
Inc(ps1, 4);
end;
v := v div Nuclear; // 卷积和 / 卷积核
pd^ := v;
inc(pd, 4);
Inc(ps, 4);
end;
Inc(ps, rSize);
Inc(pd, rSize);
end;
end;


下面给出演示代码和效果图：

procedure TextPaint(g: TGpGraphics);
var
brush: TGpLinearGradientBrush;
font: TGpFont;
fontFamily: TGpFontFamily;
r: TGpRect;
begin
fontFamily := TGpFontFamily.Create('Times New Roman'{'华文行楷'});
font := TGpFont.Create(fontFamily, 50, [fsBold], utPixel);
r := GpRect(Form1.PaintBox1.ClientRect);
brush := TGpLinearGradientBrush.Create(r, kcBlue, kcAliceBlue, 90);
g.FillRectangle(Brush, r);
DrawShadowString(g, '文字阴影特效', font, GpPoint(10, r.Height / 3), 5, 10);
g.TextRenderingHint := thAntiAlias;
g.DrawString('文字阴影特效', font, Brushs.White, 10, r.Height / 3);
brush.Free;
font.Free;
fontFamily.Free;
end;
效果图也和上面一样分上下两部分，以便效果比较，并给出了2种字体的文字输出，其中下图为华文行楷字体。





下面是华文彩云字体，五色渐变画刷文字：



由于本文代码没有做更多条件下的测试，可能存在BUG，而且算法也有待提出改进意见，请朋友们不吝指教，来信请寄maozefa@hotmail.com。

本例子中的GDI+版本系本人自己改写的，与网上流通的版本不完全兼容，如需使用本版本，请参照《GDI+ for VCL基础 -- GDI+ 与 VCL 》一文的下载地址，并请留意后面的修改说明。

后记1(2007.13.30)：刚才发现函数中果然存在一点BUG，原因是把数据源备份地址通过GDI+的TBitmapData结构的保留字段作为参数传递给MakeShadow函数，原以为该保留字段可以使用的，没想到GDI+ DLL内部可能使用了该字段（看来，保留字段还是不要使用的好，呵呵），导致设置某些字体，或者字体大小，或者字体风格时随机出现阴影位图清零，而无文字阴影输出的BUG，现已经修改本文代码，请朋友们谅解并提出宝贵意见。