Windows平台下Skia使用技巧四

2019-10-02

www.qt-ui.com 原创技术文章

前面我们介绍了单行,多行文字的处理方法,这里我们介绍富文本的绘制方法

富文本内容是相当对普通文本内容而言的,可以显示的内容更加多样,包括文字,图片,gif,表格等等。

首先我们绘制一个类关系对显示内容进行设计。

显示对象基类 UIGearsElement 显示对象子类 UIGearsText UIGearsPicture UIGearsTable分别用来显示文字,图片,表格

UIGearsElement是显示内容的基类,主要实现两个方法: 1、RenderElement绘制内容 2、ResizeElement计算显示内容内部对象的大小,比如字符内部单个字符的区域,用来实现框选功能

有了显示内容之后我们需要设计内存的段落和行。

这里我们可以参考GOF的《设计模式:可复用面向对象软件的基础》中的设计内容:

文档 -》 段落 -》 行 -》 显示对象

文档包含段落 段落包含行 行包含显示对象

按照这种包含关系进行开发。

以下是头文件定义

enum ElementType
    {
        ET_TEXT = 0,
        ET_PIC,
        ET_GIF,
        ET_TABLE,
        ET_OTHER
    };

    struct LineElement
    {
        UIGearsElement*     _obj;
        ElementType           _type;
        s32                         _startPos;
        s32                 _endPos;
    };

    class UIGLine
    {
    public:
        bool RenderElement(UIGearsRender::IUIGearsRenderDeivce* renderDevice);
        void ResizeElement();
    private:
        std::vector<LineElement*> _lineObjs;
    };

    class UIGParagraph
    {
    public:
        bool RenderElement(UIGearsRender::IUIGearsRenderDeivce* renderDevice);
        void ResizeElement();
    private:
        std::vector<UIGLine*> _lines;
    };

    class UIGDocument
    {
    public:
        bool RenderElement(UIGearsRender::IUIGearsRenderDeivce* renderDevice);
        void ResizeElement();
    private:
        std::vector<UIGParagraph*> _paragraphs;
    };

Qt商用模板项目

支持C++/Python语言,支持Windows\Linux\MacOS系统,支持X86\ARM\MIPS架构

img02

Qt Stock Exchange Sys

View more

Qt股票交易系统

Qt Stock Exchange System

img02

Qt Robot

View more

QtRobot 视频高清机器人控制系统

Qt Robot System

img02

Qt LED Editor

View more

Qt LED 灯效编辑器

Qt LED Editor

img02

Qt IOT Bike

View more

Qt IOT 物联网自行车

Qt IOT Bike

img02

Qt ECG Monitor

View more

Qt嵌入式床旁心电监护仪

Qt ECG Monitor

img02

Qt AutoDashboard

View more

Qt汽车仪表盘系统

Qt Auto Dashboard

img02

Qt DataMonitor

View more

Qt数据监控系统

Qt Data Monitor

img02

Qt Conference

View more

Qt会议终端系统

Qt Conference System

img02

Qt Video Player

View more

Qt视频播放器

Qt Video Player

img02

Qt NetDisk

View more

Qt网盘系统

Qt SkyDrive

img02

Qt IM

View more

Qt即时通讯系统

Qt IM

img02

Qt Cashier

View more

Qt便利店收银系统

Qt CashierSystem

产品文档

0基础赋能高级Qt界面开发

author

使用视频教程

author

New Qt Designer使用文档

author

Qt控件库 API

author

模板项目文档



Copyright © 2018-2021 www.qt-ui.com
鄂ICP备20004169号