1# Drawing TextBlobs (C/C++) 2 3 4## When to Use 5 6A TextBlob is a set of texts. Both a single text and a large text block can be drawn by using a TextBlob. 7 8This section focuses on the text drawing effect. In addition to the basic TextBlob drawing, you can add various drawing effects to the text. Common TextBlob drawing scenarios include [text stroke](#text-stroke) and [text gradient](#text-gradient). For more effects, see [Drawing Effects](drawing-effect-overview.md). 9 10 11## Basic TextBlob Drawing 12 13Use the OH_Drawing_CanvasDrawTextBlob() API to draw a TextBlob. The API accepts four parameters: canvas object, TextBlob object, and X-coordinate and Y-coordinate of the left endpoint of the text baseline. 14 15 16For details about the canvas object, see [Obtaining a Canvas and Displaying Drawing Results (C/C++)](canvas-get-result-draw-c.md). 17 18 19A TextBlob object can be created in multiple modes. For details, see [drawing_text_blob.h](../reference/apis-arkgraphics2d/drawing__text__blob_8h.md). 20 21 22The following uses the OH_Drawing_TextBlobCreateFromString() API as an example to describe how to create a TextBlob. The API accepts the following three parameters: 23 24 25- Text string to be displayed. 26 27- Pointer to the OH_Drawing_Font font object. OH_Drawing_Font is used to set and obtain font attributes, such as the font size, text style, font alignment mode, font rendering mode, and font stroke mode. For details about the APIs, see [draw_font](../reference/apis-arkgraphics2d/drawing__font_8h.md). 28 29- Text encoding mode. 30 31 32The following figure shows a simple example. 33 34 35```c++ 36// Create a font object. 37OH_Drawing_Font *font = OH_Drawing_FontCreate(); 38// Set the font scale. 39OH_Drawing_FontSetTextSize(font, 100); 40// Text to be drawn. 41const char *str = "Hello world"; 42// Create a TextBlob object. 43OH_Drawing_TextBlob *textBlob = 44 OH_Drawing_TextBlobCreateFromString(str, font, OH_Drawing_TextEncoding::TEXT_ENCODING_UTF8); 45// Draw a TextBlob. 46OH_Drawing_CanvasDrawTextBlob(canvas, textBlob, 200, 800); 47// Release the TextBlob object. 48OH_Drawing_TextBlobDestroy(textBlob); 49// Release the font object. 50OH_Drawing_FontDestroy(font); 51``` 52 53 54 55 56 57## Text Stroke 58 59You can also use a pen to implement the text stroke effect based on the basic TextBlob drawing. For details about the stroke effect, see [Stroke Effect](basic-drawing-effect-c.md#stroke-effect). 60 61The following figure shows a brief example of text strokes. 62 63```c++ 64// Create a pen. 65OH_Drawing_Pen *pen = OH_Drawing_PenCreate(); 66// Set the anti-aliasing function. 67OH_Drawing_PenSetAntiAlias(pen, true); 68// Set the stroke color. 69OH_Drawing_PenSetColor(pen, OH_Drawing_ColorSetArgb(0xFF, 0xFF, 0x00, 0x00)); 70// Set the stroke width. 71OH_Drawing_PenSetWidth(pen, 3); 72// Set the stroke effect. 73OH_Drawing_CanvasAttachPen(canvas, pen); 74// Create a font object. 75OH_Drawing_Font *font = OH_Drawing_FontCreate(); 76// Set the font scale. 77OH_Drawing_FontSetTextSize(font, 150); 78const char *str = "Hello world"; 79// Create a TextBlob object. 80OH_Drawing_TextBlob *textBlob = 81 OH_Drawing_TextBlobCreateFromString(str, font, OH_Drawing_TextEncoding::TEXT_ENCODING_UTF8); 82// Draw a TextBlob. 83OH_Drawing_CanvasDrawTextBlob(canvas, textBlob, 200, 800); 84// Remove the stroke effect. 85OH_Drawing_CanvasDetachPen(canvas); 86// Destroy various objects. 87OH_Drawing_TextBlobDestroy(textBlob); 88OH_Drawing_FontDestroy(font); 89OH_Drawing_PenDestroy(pen); 90``` 91 92 93 94 95## Text Gradient 96 97You can also use a shader to implement the text gradient effect. For details about the shader, see [Shader Effects](complex-drawing-effect-c.md#shader-effects). 98 99The following is a brief example and schematic diagram of adding a linear gradient shader effect to the text: 100 101```c++ 102// Start point 103OH_Drawing_Point *startPt = OH_Drawing_PointCreate(100, 100); 104To 105OH_Drawing_Point *endPt = OH_Drawing_PointCreate(900, 900); 106Color array. 107uint32_t colors[] = {0xFFFFFF00, 0xFFFF0000, 0xFF0000FF}; 108// Relative position array 109float pos[] = {0.0f, 0.5f, 1.0f}; 110// Create a linear gradient shader effect. 111OH_Drawing_ShaderEffect *colorShaderEffect = 112 OH_Drawing_ShaderEffectCreateLinearGradient(startPt, endPt, colors, pos, 3, OH_Drawing_TileMode::CLAMP); 113// Create a brush object. 114OH_Drawing_Brush *brush = OH_Drawing_BrushCreate(); 115// Set the shader effect based on the brush. 116OH_Drawing_BrushSetShaderEffect(brush, colorShaderEffect); 117// Set the brush filling effect. 118OH_Drawing_CanvasAttachBrush(canvas, brush); 119// Create a font object. 120OH_Drawing_Font *font = OH_Drawing_FontCreate(); 121// Set the font scale. 122OH_Drawing_FontSetTextSize(font, 150); 123const char *str = "Hello world"; 124// Create a TextBlob object. 125OH_Drawing_TextBlob *textBlob = 126 OH_Drawing_TextBlobCreateFromString(str, font, OH_Drawing_TextEncoding::TEXT_ENCODING_UTF8); 127// Draw a TextBlob. 128OH_Drawing_CanvasDrawTextBlob(canvas, textBlob, 200, 800); 129// Cancel the filling effect. 130OH_Drawing_CanvasDetachBrush(canvas); 131// Destroy various objects. 132OH_Drawing_TextBlobDestroy(textBlob); 133OH_Drawing_FontDestroy(font); 134OH_Drawing_BrushDestroy(brush); 135``` 136 137 138