前言：

Freetype是一个跨平台、开源的字体渲染器，网上很多文章介绍，本人就不啰嗦了。本文重点在于实现文章标题所属的各种效果，不是Freetype的基本使用方法介绍文档，所以对于Freetype不熟悉的同学们请先学习下Freetype的基本用法，才可以使用本文中所提及的方法。

正文：

用FreeType实现矢量字体的粗体、斜体、描边、阴影效果不是一件容易的事，本人认为皆因Freetype的接口太过于底层化，Freetype没有对其进行上层包装，所以要实现这些对于软件/游戏来说的基本效果，都是件挺麻烦的事情。不过，问题总是会有解决方法的，这些效果的实现，请听本人一个个道来：

1.      加粗

加粗可以使用FreeType中的一个API来实现FT_Outline_Embolden，但是这个API不支持水平垂直方向加粗量的分别设置，所以，需要参照FT_Outline_Embolden的实现重新编写一个函数，GDI++已经做了这个事情，引用它的代码：

// 就是FT_Outline_Embolden
FT_Error Old_FT_Outline_Embolden( FT_Outline*  outline, FT_Pos strength )
{
    FT_Vector*    points;
    FT_Vector    v_prev, v_first, v_next, v_cur;
    FT_Angle    rotate, angle_in, angle_out;
    FT_Int        c, n, first;
    FT_Int        orientation;

if ( !outline )
        return FT_Err_Invalid_Argument;

strength /= 2;
    if ( strength == 0 )
        return FT_Err_Ok;

orientation = FT_Outline_Get_Orientation( outline );
    if ( orientation == FT_ORIENTATION_NONE )
    {
        if ( outline->n_contours )
            return FT_Err_Invalid_Argument;
        else
            return FT_Err_Ok;
    }

if ( orientation == FT_ORIENTATION_TRUETYPE )
        rotate = -FT_ANGLE_PI2;
    else
        rotate = FT_ANGLE_PI2;

points = outline->points;

first = 0;
    for ( c = 0; c < outline->n_contours; c++ )
    {
        int  last = outline->contours[c];

v_first = points[first];
        v_prev  = points[last];
        v_cur   = v_first;

for ( n = first; n <= last; n++ )
        {
            FT_Vector    in, out;
            FT_Angle    angle_diff;
            FT_Pos        d;
            FT_Fixed    scale;

if ( n < last )
                v_next = points[n + 1];
            else
                v_next = v_first;

/* compute the in and out vectors */
            in.x = v_cur.x - v_prev.x;
            in.y = v_cur.y - v_prev.y;

out.x = v_next.x - v_cur.x;
            out.y = v_next.y - v_cur.y;

angle_in   = FT_Atan2( in.x, in.y );
            angle_out  = FT_Atan2( out.x, out.y );
            angle_diff = FT_Angle_Diff( angle_in, angle_out );
            scale      = FT_Cos( angle_diff / 2 );

if ( scale < 0x4000L && scale > -0x4000L )
                in.x = in.y = 0;
            else
            {
                d = FT_DivFix( strength, scale );

FT_Vector_From_Polar( &in, d, angle_in + angle_diff / 2 - rotate );
            }

outline->points[n].x = v_cur.x + strength + in.x;
            //伀偙傟傪僐儊儞僩傾僂僩偟偨偩偗
            //outline->points[n].y = v_cur.y + strength + in.y;

v_prev = v_cur;
            v_cur  = v_next;
        }

first = last + 1;
    }

return FT_Err_Ok;
}

// 垂直加粗
FT_Error Vert_FT_Outline_Embolden( FT_Outline*  outline, FT_Pos strength )
{
    FT_Vector*    points;
    FT_Vector    v_prev, v_first, v_next, v_cur;
    FT_Angle    rotate, angle_in, angle_out;
    FT_Int        c, n, first;
    FT_Int        orientation;

if ( !outline )
        return FT_Err_Invalid_Argument;

strength /= 2;
    if ( strength == 0 )
        return FT_Err_Ok;

orientation = FT_Outline_Get_Orientation( outline );
    if ( orientation == FT_ORIENTATION_NONE )
    {
        if ( outline->n_contours )
            return FT_Err_Invalid_Argument;
        else
            return FT_Err_Ok;
    }

if ( orientation == FT_ORIENTATION_TRUETYPE )
        rotate = -FT_ANGLE_PI2;
    else
        rotate = FT_ANGLE_PI2;

points = outline->points;

first = 0;
    for ( c = 0; c < outline->n_contours; c++ )
    {
        int  last = outline->contours[c];

v_first = points[first];
        v_prev  = points[last];
        v_cur   = v_first;

for ( n = first; n <= last; n++ )
        {
            FT_Vector    in, out;
            FT_Angle    angle_diff;
            FT_Pos        d;
            FT_Fixed    scale;

if ( n < last )
                v_next = points[n + 1];
            else
                v_next = v_first;

/* compute the in and out vectors */
            in.x = v_cur.x - v_prev.x;
            in.y = v_cur.y - v_prev.y;

out.x = v_next.x - v_cur.x;
            out.y = v_next.y - v_cur.y;

angle_in   = FT_Atan2( in.x, in.y );
            angle_out  = FT_Atan2( out.x, out.y );
            angle_diff = FT_Angle_Diff( angle_in, angle_out );
            scale      = FT_Cos( angle_diff / 2 );

if ( scale < 0x4000L && scale > -0x4000L )
                in.x = in.y = 0;
            else
            {
                d = FT_DivFix( strength, scale );

FT_Vector_From_Polar( &in, d, angle_in + angle_diff / 2 - rotate );
            }

//outline->points[n].x = v_cur.x + strength + in.x;
            //仾偙傟傪僐儊儞僩傾僂僩偟偨偩偗
            outline->points[n].y = v_cur.y + strength + in.y;

v_prev = v_cur;
            v_cur  = v_next;
        }

first = last + 1;
    }

return FT_Err_Ok;
}

// 新的加粗函数
FT_Error New_FT_Outline_Embolden( FT_Outline*  outline, FT_Pos str_h, FT_Pos str_v )
{
    if ( !outline ) return FT_Err_Invalid_Argument;
    int orientation = FT_Outline_Get_Orientation( outline );
    if ( orientation == FT_ORIENTATION_NONE )
        if ( outline->n_contours ) return FT_Err_Invalid_Argument;
    Vert_FT_Outline_Embolden( outline, str_v );
    Old_FT_Outline_Embolden( outline, str_h );
    return FT_Err_Ok;
}

// 让一个字体槽加粗，并且填充其他的大小属性
void New_GlyphSlot_Embolden( FT_GlyphSlot  slot , const Vector2Float &embolden)
{
    if(embolden == Vector2Float::ZERO)
        return;
    FT_Library  library = slot->library;
    FT_Face     face    = slot->face;
    FT_Error    error;
    FT_Pos      xstr = embolden.x, ystr = embolden.y;

if ( slot->format != FT_GLYPH_FORMAT_OUTLINE &&
        slot->format != FT_GLYPH_FORMAT_BITMAP )
        return;

if ( slot->format == FT_GLYPH_FORMAT_OUTLINE )
    {
        FT_BBox oldBox;
        FT_Outline_Get_CBox(&slot->outline , &oldBox);
        error = New_FT_Outline_Embolden( &slot->outline, xstr , ystr);
        if ( error )
            return;

FT_BBox newBox;
        FT_Outline_Get_CBox(&slot->outline , &newBox);
        xstr = (newBox.xMax - newBox.xMin) - (oldBox.xMax - oldBox.xMin);
        ystr = (newBox.yMax - newBox.yMin) - (oldBox.yMax - oldBox.yMin);
    }
    else if ( slot->format == FT_GLYPH_FORMAT_BITMAP )
    {
        xstr = FT_PIX_FLOOR( xstr );
        if ( xstr == 0 )
            xstr = 1 << 6;
        ystr = FT_PIX_FLOOR( ystr );

error = FT_Bitmap_Embolden( library, &slot->bitmap, xstr, ystr );
        if ( error )
            return;
    }

if ( slot->advance.x )
        slot->advance.x += xstr;

if ( slot->advance.y )
        slot->advance.y += ystr;

slot->metrics.width        += xstr;
    slot->metrics.height       += ystr;
    slot->metrics.horiBearingY += ystr;
    slot->metrics.horiAdvance  += xstr;
    slot->metrics.vertBearingX -= xstr / 2;
    slot->metrics.vertBearingY += ystr;
    slot->metrics.vertAdvance  += ystr;

if ( slot->format == FT_GLYPH_FORMAT_BITMAP )
        slot->bitmap_top += ystr >> 6;
}

2.      斜体

斜体在FreeType中可以通过矩阵变换来实现，只要把矩阵设置成一个切边矩阵就可以了，方法如下：

// 倾斜度，越大就越斜
float lean = 0.5f;
FT_Matrix matrix;
matrix.xx = 0x10000L;
matrix.xy = lean * 0x10000L;
matrix.yx = 0;
matrix.yy = 0x10000L;
FT_Set_Transform( face, &matrix, 0 );
  1. 3.      描边

网上有不少文章说描边其实很简单，就是上下左右各移动一个像素渲染一次，最后在中间再渲染一次就可以了。但是，这种方法只对于位图字体有效，对于矢量字体，效果就不好了，特别是大字体，1个像素只是很细的边界而已，对于很小的字体，1像素又显得太大。

这里提供另一种实现方案，使用的是Freetype的API：

  1. 使用FT_Stroker_New创建一个笔触
  2. FT_Stroker_Set设置笔触为描边
  3. 把Load后的glyph通过FT_Glyph_Copy拷贝一份出来
  4. 对这个拷贝出来的glyph使用FT_Glyph_StrokeBorder设置成描边渲染
  5. 使用FT_Outline_Render渲染这个描边的glyph，渲染前要设置FT_Raster_Params参数成：
FT_Raster_Params params;
memset(&params, 0, sizeof(params));
params.flags = FT_RASTER_FLAG_AA | FT_RASTER_FLAG_DIRECT;
params.gray_spans = RasterCallback;
  1. 在回调函数RasterCallback中实现像素化到位图中
  2. 对原来的glyph执行8操作，在回调函数RasterCallback中实现像素化到位图中，像素化过程使用alphablend的方式绘制上去
  3. 把位图渲染到屏幕上或保存到文件中

这个方法是Freetype的一个example，只是很少有人注意而已，源码在这里http://www.freetype.org/freetype2/docs/tutorial/example2.cpp。

12. 阴影

阴影的实现就比较简单了，只要一个个像素偏移后多渲染几次就可以了，再次不多说。

使用FreeType实现矢量字体的粗体、斜体、描边、阴影效果的更多相关文章

  1. openhtmltopdf 支持自定义字体、粗体

    一.支持自定义字体 private static void renderPDF(String html, OutputStream outputStream) throws Exception { t ...

  2. chromium 34以后中文字体粗体渲染问题

    估计不少人更新后都遇到这个情况了吧,粗体渲染如然变得很模糊,很奇怪,Google下说是字体实现方式变了,国内一些网站用的中文字体都是宋体,但是宋体本身没有粗体,Win下的粗体是微软自己通过某种方式实现 ...

  3. MAC里“微软雅黑”字体标准体和粗体无法同时使用问题的解决方法

    微软雅黑字体,有标准体和粗体两种字体,我用的系统是OSX10.9,adobe或者是office软件中,均无法同时使用.要么只能用标准体,粗体报错:要么就是能用粗体,标准体无法使用.很偶然找到了以下MA ...

  4. UILabel字体加粗等属性和特效

    /* Accessing the Text Attributes text  property font  property textColor  property textAlignment  pr ...

  5. windows矢量字体点阵数据的提取(转)

    源:windows矢量字体点阵数据的提取 问题参考:windows api 获取字库点阵的问题 1.提取原理 在windows系统当中提取矢量字体的字模有很多方法,下面介绍一种利用GetGlyphOu ...

  6. android textview字体加粗 Android studio最新水平居中和垂直居中

    android textview字体加粗 Android studio最新水平居中和垂直居中 Android中字体加粗在xml文件中使用android:textStyle=”bold”但是不能将中文设 ...

  7. MathType编辑粗体空心字的技巧

    在用MathType公式编辑器编辑公式时,由于不同的使用需要,会有不同的字体要求.如果是正式的论文中的公式,一般公式只要求数学的国际使用规定就可以了,而如果是用在ppt等这种演示的文稿中,所要用到的字 ...

  8. WPF自定义控件与样式(1)-矢量字体图标(iconfont)

    一．图标字体 图标字体在网页开发上运用非常广泛,具体可以网络搜索了解,网页上的运用有很多例子,如Bootstrap.但在C/S程序中使用还不多,字体图标其实就是把矢量图形打包到字体文件里,就像使用一般 ...

  9. idea 光标变成粗体且当前文件搜索功能无法使用的问题

    今天安装了idea最新版,安装完成后发现光标变成了粗体,并且快捷键在使用时出现了问题,比如:ctrl+F搜索功能无法使用 经过反复修改配置也无法改善情况,后来一次重启看到下面小窗弹出有关vim的一个提 ...

随机推荐

  1. 【HDU】病毒侵袭持续中（AC自己主动机+map）

    一開始一直WA,之后发现这道题不止一组输入,改成多组输入之后就过了. 利用map把每一个字符串映射到它相应的结点上即可了. 11909467 2014-10-19 11:54:00 Accepted ...

  2. Selenium之偷懒教程

    进来一直停留在基础理论知识的学习中,认为太乏味,就写了一个网页自己主动化的demo:自己主动写日报.省的以后自己打开网页写啦. 直接上代码: 自己主动填写日报DEMO import java.io.B ...

  3. 纯css加伪类实现关闭提示创窗口

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  4. SharePoint2010添加webpart找不到内容编辑器

    1.开启相关网站集功能.2.若还是找不到可以在其它有内容编辑器的站点下,在“Web 部件”中找到并下载内容编辑器,上传至本站点即可.

  5. C实现二叉树（模块化集成，遍历的递归与非递归实现）

    C实现二叉树模块化集成 实验源码介绍(源代码的总体介绍):header.h : 头文件链栈,循环队列,二叉树的结构声明和相关函数的声明.LinkStack.c : 链栈的相关操作函数定义.Queue. ...

  6. La=LaULb （单链表）

    #include<stdio.h> typedef struct LNode { int data; struct LNode *next; }LNode,*LinkList; void ...

  7. MySqlQueryList

    //辅助查询列表,或实例 public class MySqlQueryList { #region List<T> ToList<T>(string sql, params ...

  8. [LeetCode]题解（python）：126-Word Ladder II

    题目来源: https://leetcode.com/problems/word-ladder-ii/ 题意分析: 给定一个beginWord和一个endWord,以及一个字典单词,找出所有从begi ...

  9. NET Core个人博客

    NET Core重写个人博客站点小结 今天用ASP.NET Core重写了个人博客站点,原来是基于ASP.NET 4.5开发的.重写工作总体很顺利,最后成功发布到Ubunt+Nginx平台上.效果如下 ...

  10. linux服务器安全小知识

    使用单用户模式进入系统 Linux启动后出现boot:提示时,使用一个特殊的命令,如linuxsingle或linux 1,就能进入单用户模式(Single-User mode).这个命令非常有 ...