freetype将字符串制作成位图并显示过程详解

news2024/12/26 23:00:37

        在流媒体项目中字幕显示是不可或缺的一环,一般会有字幕流在视频播放过程中进行显示;不过还有很多情况是从头到尾只在视频的某个区域显示某些文字,例如某个电视台的log;这种也称为字幕,如果想要将这些字符串显示到视频,需要将这些字符串做成位图进行显示,无法直接显示,freetype开源库就是将字符转化为位图的工具。

        做了几个freetype的项目之后总结的几个难点:

1.utf8或者gb2312等中文如何生成位图

        画布和freetype是无法处理中文编码的,像GB2312或UTF8等中文编码需要转换成unicode编码才能够被处理,显示;字符串的编码转换可以使用iconv库进行编码转换,想要了解更多iconv库的详细情况,关注我后期持续更新。

2.生成的位图如何显示到画布上;(核心点,最难点)

        首先明确一点:freetype只是将字符做成位图的工具,不涉及位图在画布显示相关的配置;具体如何将位图显示到LCD(嵌入式称为画布)?

        利用c/c++的话术来说就是将保存位图的缓存内容拷贝到画布的缓存上即可。但是不仅仅是简单的字符拷贝,在拷贝的过程中还要考虑到LCD的像素格式(RGB888,RGB555等),不同的像素格式,单个像素所占的内存大小是不一样的,就导致拷贝时的内存偏移是不同的;下面代码进行跟明确的解释:

//这里LCD的像素格式为ARGB8888,即一个像素占四个字节,A:透明度(8bit),R:红色(8bit),G:绿色(8bit),B:蓝色(8bit)
void Manage::lcd_put_pixel(int x, int y, unsigned int pixel, unsigned int color)
{
    /*
    *Get_Canvas_Addr():画布的地址;
    *(32 / 8):一个像素占多少字节;
    *Get_Stride():垂直步长,和像素格式有关,假如画布的分辨率为:1920*1080;像素格式为ARGB8888,则垂直步长为1920*4
    *              很好理解:画布水平有1920个像素点,每个像素点占四个字节;
    */
    unsigned char *pen_8 = (Get_Canvas_Addr() + x * (32 / 8) + y * Get_Stride());//画布显示位置在画布缓存中的地址偏移
    unsigned int *pen_16;
    unsigned int red = 0, green = 0xff, blue = 0;

    pen_16 = (unsigned int *)pen_8;
    //pixel:代表像素点的值
    if (pixel != 0)
    { 
        //一个像素由RGB组成,而像素格式占四个字节,所以将unsigned char类型的缓存转换成unsigned int类型进行赋值,代表整个像素点
        pixel = color;
    }
    else
    {
        //没有像素点说明是空白区域,以白色填充
        *pen_16 = 0x0000;
    }
    //将像素值拷贝到画布
    *pen_16 = pixel;
}

        如果对于画布的坐标偏移很难理解,参考下下图:

        其中坐标点就是位图想要在画布上显示的坐标点,颜色相同的四个方块代表一个像素点,一个方块代表一个字节,则坐标点在画布的缓存中的地址位置为:y*(1920*4)+x*4; 这样就很清楚明了了吧!

        这个模块就是将生成好的位图数据显示到LCD画布的过程,在实际的项目开发中画布的坐标,画布的分辨率,画布的像素格式,位图的坐标,位图的各种参数都是非常重要的考虑项;想要了解更多关注我后续持续更新;

3.LCD坐标和笛卡尔坐标在实际项目中如何应用

        lcd坐标:就是LCD在做图像显示时的坐标,以左上角为原点,y轴与笛卡尔坐标相反向下为正,x轴与笛卡尔坐标一样;

        笛卡尔坐标:就是我们上学时学到坐标轴;

        为什么要说这两个坐标的?因为如果坐标与freetype接口相关的话就会涉及到笛卡尔坐标,因为freetype内部使用的时笛卡尔坐标,需要与LCD坐标进行转换。

        具体分析图如下:

        在进行位图渲染时,freetype是按照红点为原点进行坐标设置的,而LCD(画布)是按照绿色原点进行设置的,因此如果坐标使用freetype进行设置,那么y坐标要使用LCD的高减去想要的y值才是我们想要的坐标;

        如上图,想要让位图显示在LCD(100,100)的坐标处,但是使用freetype时y坐标就不能设置为100,而要设置为h-100;x都是一样的,不用考虑x的转换。

        有如下代码:

//该代码是从实际项目中摘录,删去了无用代码,导致可能无法编译,仅表示位图生成过程
int Manage::FreeType_Generate_Bitmap(uint32_t h, uint32_t w, std::string color)
{
    FT_Library library;
    FT_Face face;
    FT_GlyphSlot slot;
    FT_Error error;
    unsigned int co = 0;

    // 初始化 FreeType 库
    error = FT_Init_FreeType(&library);
    if (error)
    {
        printf("Failed to initialize FreeType library\n");
        return 1;
    }

    // 加载字体文件
    error = FT_New_Face(library, "/mmc_data/msyh.ttf", 0, &face);
    if (error == FT_Err_Unknown_File_Format)
    {
        printf("Unsupported font file format\n");
        return 1;
    }
    else if (error)
    {
        printf("Failed to load font file\n");
        return 1;
    }
    slot = face->glyph;
    FT_Select_Charmap(face, FT_ENCODING_UNICODE);

    // // 设置字体大小,后面两个参数是长宽,如果其中一个为0,则默认与另一个参数相同
    FT_Set_Pixel_Sizes(face, 0, 48);

    // 只使用灰度位图
    FT_Render_Mode render_mode = FT_RENDER_MODE_NORMAL;

    // 设置字符串
    const char *text = "hello";

    // 计算字符串在画布的中间位置
    int string_width = 0;
    int string_height = 0;
    //计算将整个字符串转换为位图后,位图的总长度和总高度
    for (int i = 0; i < strlen(text); i++)
    {
        FT_Load_Char(face, text[i], FT_LOAD_RENDER);

        // string_width += face->glyph->bitmap.width;
        //计算总长度时要使用水平步长(face->glyph->advance.x),不要使用字符位图宽度(face->glyph->bitmap.width),因为位图是按照
        //水平步长或者垂直步长进行偏移的,两者的区别请参考我的文章:
        string_width += (face->glyph->advance.x >> 6);

        if (face->glyph->bitmap.rows > string_height)
        {
            string_height = face->glyph->bitmap.rows;
        }
    }

    // 逐字符渲染并绘制到位图
    //pen_x,pen_y就是我们想要设置的LCD坐标
    int pen_x = (w - string_width) / 2;
    int pen_y = string_height - slot->bitmap_top;
    FT_Vector pen;
    //使用freetype时要乘以64,因为freetype内部是1/64像素
    pen.x = pen_x * 64;
    pen.y = pen_y * 64;
    printf("pen_x : %d, pen_y : %d, top : %d\n", pen_x, pen_y, slot->bitmap_top);
    co = Get_Int_Color(color);
    for (int i = 0; i < strlen(text); i++)
    {
        //使用FT_Set_Transform接口将pen_x,pen_y转化为freetype坐标
        FT_Set_Transform(face, 0, &pen);
        error = FT_Load_Char(face, text[i], FT_LOAD_RENDER);
        if (error)
        {
            printf("Failed to load glyph\n");
            continue;
        }
        //FT_Set_Transform转化之后x坐标为slot->bitmap_left;y坐标为slot->bitmap_top
        int x = slot->bitmap_left;    // 字形位图的左边界偏移
        int y = h - slot->bitmap_top; // 字形位图的上边界偏移,这就是上面说到的坐标转换,再将freetype笛卡尔坐标转换为LCD坐标
        FT_Int x_max = x + slot->bitmap.width;
        FT_Int y_max = y + slot->bitmap.rows;
        //下面就是将位图渲染到LCD的过程,参考上面第二小节
        for (int i = x, p = 0; i < x_max; i++, p++)
        {
            for (int j = y, q = 0; j < y_max; j++, q++)
            {
                if (i < 0 || j < 0 || i >= w || j >= h)
                    continue;
                lcd_put_pixel(i, j, slot->bitmap.buffer[q * slot->bitmap.width + p], co);
            }
        }

        pen.x += slot->advance.x;
        // pen.y += slot->advance.y;
    }

    // 释放资源
    FT_Done_Face(face);
    FT_Done_FreeType(library);

    return 0;
}

        当然,如果你觉得坐标的相互转换很迷惑,我这有一种方可可以只考虑LCD坐标,不考虑笛卡尔坐标,也就是坐标不经过freetype;具体方法关注我,后期会出一篇详解freetype及使用技巧的文章;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1224410.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

OpenGL_Learn13(材质)

1. 材质 cube.vs #version 330 core layout (location 0) in vec3 aPos; layout (location 0 ) in vec3 aNormal;out vec3 FragPos; out vec3 Normal;uniform mat4 model; uniform mat4 view; uniform mat4 projection;void main() {FragPosvec3(model*vec4(aPos,1.0));Norma…

各类软件docker安装

docker Docker 要求 CentOS 系统的内核版本高于 3.10 &#xff0c;通过 uname -r 命令查看你当前的内核版本&#xff1a; uname -r 3.10.0-1062.1.2.el7.x86_64 安装 Docker&#xff1a; 安装 Docker&#xff1a;yum -y install dockerkafka和zookeeper docker pull wurstmei…

基于springboot实现私人健身与教练预约管理系统项目【项目源码+论文说明】

基于springboot实现私人健身与教练预约管理系统演示 摘要 随着信息技术和网络技术的飞速发展&#xff0c;人类已进入全新信息化时代&#xff0c;传统管理技术已无法高效&#xff0c;便捷地管理信息。为了迎合时代需求&#xff0c;优化管理效率&#xff0c;各种各样的管理系统应…

基于libcurl+libopenssl开源库编译出curl下载工具及代码集成curl功能

准备素材&#xff1a; 1. openssl的版本&#xff1a; openssl-1.1.1w.tar.gz 2.curl的版本&#xff1a;curl-8.4.0.tar.gz 目标&#xff1a; 1.编译出openssl库&#xff1b; 2.编译出curl可执行文件及库&#xff1b; 步骤一&#xff1a;先解压压缩包 tar -zxvf openssl-1…

【Linux从入门到放弃】环境变量

&#x1f9d1;‍&#x1f4bb;作者&#xff1a; 情话0.0 &#x1f4dd;专栏&#xff1a;《Linux从入门到放弃》 &#x1f466;个人简介&#xff1a;一名双非编程菜鸟&#xff0c;在这里分享自己的编程学习笔记&#xff0c;欢迎大家的指正与点赞&#xff0c;谢谢&#xff01; 文…

mongodb使用简单文档

1、mongodb安装与卸载 1.1、安装 python -m pip install pymongo 或 pip install pymongo如果要安装指定版本&#xff1a; python -m pip install pymongo3.5.1对已有的版本进行升级&#xff1a; python -m pip install --upgrade pymongo1.2、卸载 pip uninstall pymongo…

【MATLAB】史上最全的5种数据插值算法全家桶

有意向获取代码&#xff0c;请转文末观看代码获取方式~ 大家吃一顿火锅的价格便可以拥有5种数据插值算法&#xff0c;绝对不亏&#xff0c;知识付费是现今时代的趋势&#xff0c;而且都是我精心制作的教程&#xff0c;有问题可随时反馈~也可单独获取某一算法的代码&#xff08…

使用vant list实现订单列表,支持下拉加载更多

在公司项目开发时&#xff0c;有一个需求是实现可以分页的订单列表&#xff0c;由于是移动端项目&#xff0c;所以最好的解决方法是做下拉加载更多。 1.在页面中使用vant组件 <van-listv-model"loading":finished"finished"finished-text"没有更…

kubernetes|云原生| 如何优雅的重启和更新pod---pod生命周期管理实务

前言&#xff1a; kubernetes的管理维护的复杂性体现在了方方面面&#xff0c;例如&#xff0c;&#xff50;&#xff4f;&#xff44;的管理&#xff0c;服务的管理&#xff0c;用户的管理&#xff08;&#xff32;&#xff22;&#xff21;&#xff23;&#xff09;&#xf…

RT-DETR算法优化改进:SCConv,空间和通道重建卷积 | CVPR2023 | 卷积变体大作战

💡💡💡本文改进:SCConv(空间和通道重建卷积),一个即插即用的架构单元,可以直接用来替代各种卷积神经网络中的标准卷积。 1)放入Neck RepC3后面; RT-DETR魔术师专栏介绍: https://blog.csdn.net/m0_63774211/category_12497375.html ✨✨✨魔改创新RT-DETR �…

98.qt qml-使用曲线图综合示例、支持多种鼠标交互、支持百万数据显示(已适配黑白风格)

在上章我们只是简单实现了曲线图和折线图的显示: 79.qt qml-如何在QML中使用QCustomPlot之曲线/折线示例(已适配黑白风格)_qml 折线图_诺谦的博客-CSDN博客 所以本章实现综合示例、并添加多种功能如下所示: 详细显示:鼠标任意移动显示具体值内容鼠标右击: 弹出菜单栏,支持…

华夏ERP打包手册

Maven安装及环境配置 1.下载 浏览器搜索maven点击apache Maven 2.选择安装目录&#xff0c;注意不能有中文 3.环境变量配置 点击计算机右键属性>高级系统设置>环境变量 新建系统变量 MAVEN_HOME 变量值是安装目录 进入path点击新建点击编辑&#xff0c;写入% MAVEN_H…

【Unity】单例模式及游戏声音管理类应用

【Unity】单例模式及游戏声音管理类应用 描述 在日常游戏项目开发中&#xff0c;单例模式是一种常用的设计模式&#xff0c;它允许在应用程序的生命周期中只创建一个对象实例&#xff0c;并提供对该实例的全局访问点。通过使用单例模式&#xff0c;可以提高代码的可维护性和可…

人工智能轨道交通行业周刊-第65期(2023.10.30-11.19)

本期关键词&#xff1a;高铁自主创新、智慧城轨、调车司机、大模型垂直应用、大模型幻觉 1 整理涉及公众号名单 1.1 行业类 RT轨道交通人民铁道世界轨道交通资讯网铁路信号技术交流北京铁路轨道交通网上榜铁路视点ITS World轨道交通联盟VSTR铁路与城市轨道交通RailMetro轨道…

PaddlePaddle:开源深度学习平台

深度学习作为人工智能领域的重要分支&#xff0c;正在全球范围内得到广泛应用。而在构建和训练深度学习模型时&#xff0c;选择一个高效、易用且功能强大的开源平台是至关重要的。PaddlePaddle&#xff08;即飞桨&#xff09;作为国内领先的深度学习平台&#xff0c;一直以来都…

【代码随想录】算法训练计划23

1、669. 修剪二叉搜索树 题目&#xff1a; 给你二叉搜索树的根节点 root &#xff0c;同时给定最小边界low 和最大边界 high。通过修剪二叉搜索树&#xff0c;使得所有节点的值在[low, high]中。修剪树 不应该 改变保留在树中的元素的相对结构 (即&#xff0c;如果没有被移除&…

在 C# 程序中注入恶意 DLL

为什么 Windbg 附加到 C# 程序后&#xff0c;程序就处于中断状态了&#xff1f;它到底是如何实现的&#xff1f;其实简而言之就是线程的远程注入&#xff0c;这一篇就展开说一下。 实现原理 1. 基本思路 WinDbg 在附加进程的时候&#xff0c;会注入一个线程到 C# 进程 中&…

设计模式-行为型模式-责任链模式

一、什么是责任链模式 责任链模式是一种设计模式。在责任链模式里&#xff0c;很多对象由每一个对象对其下家的引用而连接起来形成一条链。请求在这个链上传递&#xff0c;直到链上的某一个对象决定处理此请求。发出这个请求的客户端并不知道链上的哪一个对象最终处理这个请求&…

RobotFramework之如何使用数据驱动(十二)

学习目录 引言 数据驱动是什么&#xff1f; 非驱动方式测试案例 通过添加Template模板的方式&#xff0c;实现数据驱动 将参数放在变量文件中&#xff0c;实现数据驱动 引言 大家平时在写接口或者UI自动化用例的时候&#xff0c;是否遇到这种情况&#xff1a; 写了很多条…

手搓哈希表、列表、队列,只为了用C语言快速求解华容道游戏,我不是大佬,只是一个游戏算法爱好者

背景 多年前曾经写过C语言求解华容道&#xff0c;当时没有用到哈希表&#xff0c;导致整个查重搜索数组过大&#xff0c;每次求解都得花上数分钟的时间&#xff0c;如今时过境迁&#xff0c;对数据结构和算法有了更深的理解&#xff0c;所以得把这一块补上了。(其实就是最近想…