How to program draggable tiles for a word game?

Question

I am an iOS programming newbie (reading several books on the subject simultaneously) and I would like to develop a (yet another) word game.

Coming from Flash/Flex programming background I was first expecting the tiles to be best bundled as gif or png assets.

But then I have taken a look (by using iFunbox) at the popular word games (Lexulous, Wordament, Words with Friends, Ruzzle, ...) and none of them is doing that:

That is none of the many apps I've looked at includes any letter pieces as images.

So my question is what would be the recommended approach (in Xcode 5 and with no additional SDKs like Cocos2d or Sparrow) to create a letter tile for a word game?

On a tile I'd like to have

• the center-aligned letter (obviously!),
• then an index in a corner displaying the letter value
• and then another index for a total word value

When touched I'd like to make the tile a bit larger and add a shadow underneath it.

Should my tile class be a UIView (can they be dragged around, grow and have shadows?)

Should I use a .nib file for the tile?

For dragging I have found a good suggestions already: Dragging an UIView inside UIScrollView

But what I really would like to know here is: if UIView would make a good tile (performance- and feature-wise) or should I go for another base class (like maybe some shapes)?

Answer 1

Yes UIView would be a good container. Create a subclass of UIView, say TileView, put in some labels, image view and a button over it, override buttons UIControlEventTouchDown, UIControlEventTouchUpInside, UIControlEventTouchDragInside events to help U navigate the view in its parent. Put the TileView in some container (your view controller view or where U would like it to be) and this is basically it.

-(void)btnPressed:(id)sender withEvent:(UIEvent *) event
{
    CGPoint point = [[[event allTouches] anyObject] locationInView:self.view];
    dx = 0;
    dy = 0;

    oldPoint = point;
}

-(void)btnRelesed:(id)sender
{
// stop moving code
}

-(void)btnDragged:(id)sender withEvent:(UIEvent *)event
{
    CGPoint point = [[[event allTouches] anyObject] locationInView:self.view];

    dx = point.x - oldPoint.x;
    dy = point.y - oldPoint.y;

    oldPoint = point;

    // set tile view center position using 
    CGPoint ptCenter;
    ptCenter = self.view.center;
    ptCenter.x = ptCenter.x + dx;
    ptCenter.y = ptCenter.y + dy;
    self.view.center = ptCenter;
}

self.view is your TileView and its self.view cause U have ovrriden UIView class ;)