Rendering

This page provides an introduction to the way iink SDK manages the rendering. You will learn how to use the reference implementation provided by MyScript and properly plug things together.

Key concepts

With these concepts, you will be able to better understand how to use the reference rendering implementation or build your own (not documented yet).

Render target

Canvas

Renderer

A renderer is a component in charge of deciding how to render content of each layer, knowing which area of the model needs to be refreshed, as well as parameters such as zoom factor or view offset. It will issue rendering commands, through a canvas object that will do the actual drawing operations.

Version 1.4 introduced a new rendering capacity for the renderer based on the drawing of offscreen surfaces. This increases the rendering speed and is even necessary for new features like math animation. So it is definitively our recommended choice.

Layer

For performance reasons, the renderer works on two different layers.

The two layers are:

• A model layer, corresponding to everything in the model that was already processed by the engine (guidelines, strokes, images, typeset text, ...),
• A capture layer, rendering the ink drawn on the screen but not yet processed by the engine.

Each layer can be refreshed independently from the other, so that it is not needed to redraw everything.

Ink prediction

An ink prediction mechanism is available that allows bridging part of the gap between the pen and the ink, but may trigger some visual artifacts. This mechanism is available with two configuration properties:

• a boolean renderer.prediction.enable (default value is false)
• a number renderer.prediction.duration that represents the targeted prediction duration in ms (default value is 16 ms, max is 200 ms). A 16 ms prediction corresponds to one rendered frame on a 60Hz device screen. Higher durations are possible but might reduce prediction accuracy or stability, depending on your device input sampling frequency or screen refresh rate. Value should be tuned to avoid unwanted visual artifacts and guarantee the best user experience.

By default, ink prediction is disabled in the SDK, but all Demo examples enable prediction duration at 16 ms, which is a good compromise to avoid visual artifacts. So, if you want to evaluate the ink prediction mechanism, you can draw on Demo examples to learn how to do it.

Additional brush implementation

The iink SDK supports additional brushes based on APIs that rely on OpenGL for advanced rendering styling, such as the Pencil brush.

Reference implementation

Canvas.h                 -> ICanvas implementation
Canvas.cpp
EditorListener.h         -> IEditorListener implementation
EditorListener.h
EditorWidget.h           -> Entry point: ready to use widget that comes with all the required plumbing
EditorWidget.cpp
FontMetricsProvider.h    -> See the conversion part of the guide
FontMetricsProvider.cpp
ImagePainter.h            -> Object to produce image data for some export options
ImagePainter.cpp
ImageLoader.h            -> Object used to manage an image cache
ImageLoader.cpp
LayerWidget.h            -> Ink layer implementation
Path.h                   -> IPath implementation (used by the canvas)
Path.cpp
RendererListener.h       -> IRendererListener implementation
SmartGuideWidget.h       -> Graphical widget to provide real-time recognition feedback
SmartGuideWidget.cpp

The goal of the next step of this guide is to explain how to add some content to the model.