Search code examples
titaniumtitanium-mobileimage-masking

Masking View using Titanium (Appcelerator)

I need to create a slot machine game using Titanium. The problem i'm facing is best explained using images:

base layout

This is my base layout. I put the images displayed in the machine in a 3x3 matrix, and on top i place the 'frame' of the machine. I would like to cut the top and bottom part of the images displayed under the frame of the machine, and achive a something like this:

enter image description here

If i could use a framework, which supports masking view(groups), then i could just put an image mask on top of the objects, i would like to cut like this, and the problem would have been solved:

enter image description here

But i can't do this in Titanium, the only thing, i can do is create masked images (Ti.UI.createMaskedImage).

I really don't want to create a version of all the little images cut in half from both directions.

Any help, or ideas solving this would be greatly appreciated!

Solution

  • Just create a view which is the machine's screen, and Put The images in it. Set the view's borderRadius to 0, which Will make It Clip its children.