# SDF Text Clipping

**URL:** <https://discourse.libcinder.org/t/sdf-text-clipping/1258>\
**Category:** Using Cinder\
**Created:** [August 15, 2018, 10:44am UTC](https://discourse.libcinder.org/t/sdf-text-clipping/1258 "2018-08-15T10:44:56Z")\
**Posts on this page:** 1\
**Showing post:** 6

<div class="post-metadata">

**Author:** ![paul.houx](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.libcinder.org/paul.houx/32/31_2.png) [@paul.houx](https://discourse.libcinder.org/u/paul.houx)\
**Post date:** [August 15, 2018, 9:55pm UTC](https://discourse.libcinder.org/t/sdf-text-clipping/1258/6 "2018-08-15T21:55:41Z")

</div>

Hi,

nice to hear you’re having fun with SDF text. Note that I have since abandoned that specific kind of SDF text rendering in favour of [multi-channel SDF](https://github.com/Chlumsky/msdfgen)’s. @chaoticbob created a cool [Cinder Block](https://github.com/chaoticbob/Cinder-SdfText) for it, to which I contributed a much improved [shader](https://discourse.libcinder.org/t/cinder-sdftext-initial-release-wip/171/15?u=paul.houx). If you find that you need even crispier text, have a look.

With that being said, let’s turn to the issue at hand. You may want to look into using the [stencil buffer](https://learnopengl.com/Advanced-OpenGL/Stencil-testing). This allows you to mask portions of your canvas. The upside is that this also works for non-rectangular areas and you don’t need to render to an Fbo, so your text stays crisp no matter what. The downside is that it is a boolean test, so it will be impossible to use an anti-aliased mask. This can be remedied using a post-process like [FXAA](https://github.com/paulhoux/Cinder-Samples/tree/master/FXAA) or [SMAA](https://github.com/paulhoux/Cinder-Samples/tree/master/SMAA), but I’ll not go into that in this post.

By default, the stencil buffer is disabled for performance and memory reasons. Enable it using:

```auto
CINDER_APP( YourApp, RendererGl( RendererGl::Options().stencil() ) )

```

Then, before drawing your text, render a mask to the stencil buffer. This is as simple as setting up OpenGL to render to the stencil buffer, then rendering the shape you want:

```auto
// Disable color and depth buffers.
gl::colorMask( GL_FALSE, GL_FALSE, GL_FALSE, GL_FALSE );
gl::depthMask( GL_FALSE );

// Prepare stencil buffer.
auto ctx = gl::context();
ctx->pushBoolState( GL_STENCIL_TEST, GL_TRUE );
ctx->pushStencilFunc( GL_ALWAYS, 1, 0xFF );
ctx->pushStencilOp( GL_KEEP, GL_KEEP, GL_REPLACE );
ctx->pushStencilMask( 0xFF );

gl::clear( GL_STENCIL_BUFFER_BIT );

// Now render your shape using polygons. No need to
// use a fragment shader, unless you want to do something
// fancy like `discard`-ing some pixels.

```

Next, setup OpenGL to render normally while enabling the stencil mask:

```auto
// Enable color and depth buffers.
gl::depthMask( GL_TRUE );
gl::colorMask( GL_TRUE, GL_TRUE, GL_TRUE, GL_TRUE );

// Enable stencil testing.
gl::stencilFunc( GL_EQUAL, 1, 0xFF );
gl::stencilMask( 0x00 );

// Render your text like you normally would.

```

Finally, restore the OpenGL state to no longer use the mask:

```auto
// Restore stencil buffer.
ctx->popStencilMask();
ctx->popStencilOp();
ctx->popStencilFunc();
ctx->popBoolState( GL_STENCIL_TEST );

```

-Paul

---

_[View the full topic](https://discourse.libcinder.org/t/sdf-text-clipping/1258)._
