how to dynamically mask a group display object

I am creating a horizontal alpha value slider.
The shape is a horizontal rounded rectangle.
I want to fill the rounded rect with a checker pattern image - then use the ‘paintAlpha’ (below) fill to create the alpha value. Here’s my simple code for the rounded rect so far:

local paintAlpha = {
type = “gradient”,
color1 = { 0,0,0,0 },
color2 = { 0,0,0,1},
direction = “right”
_rectAlpha = display.newRoundedRect( 0, 0, width, height, height/2 );
_rectAlpha.fill = paintAlpha;
_rectAlpha.strokeWidth = 3;
_rectAlpha:setStrokeColor( 0, 0, 0, 1 );

This works fine for the alpha.

I know how to add a checker image:
_checkImg = display.newImage(“checker.png”)

But, how do I mask my checker image so it is only visible inside my rounded rect?
I don’t want checker pattern outside the rounded corners of my slider.

The easiest way to make them the same height. No masks no problem. :slightly_smiling_face:

you can read about masks here: