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

A render target (adopting the IINKIRenderTarget protocol) represents the platform “view” where the drawing operations will occur.

Canvas

A canvas object provides a platform implementation of the drawing commands called by iink SDK to render content (defined by the IINKICanvas protocol).

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.

Layer

For performance reasons, the renderer works on different layers.

The reference rendering implementation implements these layers for you. However, you may sometimes need to interact with them.

The supported layers are:

  • A background layer, corresponding for instance to the guides of a Text Document.
  • A model layer, corresponding to everything in the model that was already processed by the engine (strokes, images, typeset text),
  • A temporary layer, corresponding to temporary elements (for instance items selected during a drag and drop operation),
  • 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 others, so that it is not needed to redraw everything, for instance when moving a selection over existing content.

Reference implementation

To make it easy to build applications, MyScript provides in its examples repository a default rendering implementation.

It is released as a library, under a permissive license and can be reused as-is or modified should you feel the need. As an integrator, you just have to link against it and do a bit of plumbing:

  1. Instantiate an EditorViewController object, either in the code or in a storyboard. It is a ready-to-use implementation of a render target, with layered rendering and integrated canvas for drawing operations.
  2. Initialize it by setting its engine property.

Back to the example

For the rendering part of the calculator, you can just reuse the reference implementation coming with the MyScript iink code examples.

Once the reference implementation has been integrated with your project, all you have to do is the corresponding plumbing:

- (void)viewDidLoad
{
  [super viewDidLoad];

  self.editorViewController = self.childViewControllers[0];
  self.editorViewController.engine = [self engine];
}

If you compile and run the application at this point, you will notice that the view currently shows nothing, as you have not added any content to the model yet. This is the goal of the next step of this guide.

We use cookies to ensure that we give you the best experience on our website Read the privacy policy