Shuffle the positions of a row of buttons in a UIView - iphone

Question

I have a word,depending on its length,I create buttons assigning a character from the word randomly.I am presenting the shuffled character button arrangement in a row.Now I would like to sort the positions of those buttons,i.e. 1st to 3rd,3rd to 5th and so on.Please note that the number of buttons are not fixed,they vary depending on word length.Here is the sample code snippet for an understanding of how I create buttons.
-(void)buttonsCreation:(int)noOfButtons
{
NSMutableArray *charactersArray = [NSMutableArray array];
self.wordButtons = [[NSMutableArray alloc]initWithCapacity:30];
BOOL record = NO;
int randomNumber;
self.jumbledWord = [jumbledWord stringByReplacingOccurrencesOfString:#" " withString:#""];
for (int i=0; [charactersArray count] < jumbledWord.length; i++) //Loop for generate different random values
{
randomNumber = arc4random() % jumbledWord.length;//generating random number
if(i==0)
{
[charactersArray addObject:[NSNumber numberWithInt:randomNumber]];
}
else
{
for (int j=0; j<= [charactersArray count]-1; j++)
{
if (randomNumber ==[[charactersArray objectAtIndex:j] intValue])
record = YES;
}
if (record == YES)
record = NO;
else
[charactersArray addObject:[NSNumber numberWithInt:randomNumber]];
}
}
int arrayValue;
float x;
float y;
if ([jumbledWord length]>11)
{
int remainingWordslength = [jumbledWord length]-11;
x = ((475/2) - (38.0 *(11/2.0))) + 8;
y = ((475/2) - (38.0 *(remainingWordslength/2.0))) + 8;
}
else
{
x = ((475/2) - (38.0 *([jumbledWord length]/2.0))) + 8;
}
for(int i=0;i<[jumbledWord length];i++)
{
CGFloat translation = 0.0;
if(i>=0 && i<11)
{
arrayValue = [[charactersArray objectAtIndex:i] intValue];
UIButton *characterButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
characterButton.frame = CGRectMake(x,160.0, 35.0, 35.0);
x = x + 38;
if (jumbledWord.length>=1 && jumbledWord.length<5)
{
translation = (self.view.frame.size.width - characterButton.frame.size.width)+65.0;
}
if (jumbledWord.length>=5 && jumbledWord.length<11)
{
translation = (self.view.frame.size.width - characterButton.frame.size.width)+160.0;
}
characterButton.transform = CGAffineTransformMakeTranslation(translation, 0);
[UIView animateWithDuration:1.30f
delay:0.7
options:UIViewAnimationOptionTransitionFlipFromRight
animations:^{
characterButton.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished) {
}];
[wordButtons addObject:characterButton];
NSString *characterValue = [NSString stringWithFormat:#"%c",[jumbledWord characterAtIndex:arrayValue]];
[characterButton setTitle:characterValue forState:UIControlStateNormal];
[characterButton addTarget:self action:#selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];
if (arrayValue==0)
{
arrayValue = 100;
}
[characterButton setTag:arrayValue*100];
[self.view addSubview:characterButton];
}
else if(i>=11 && i<20)
{
arrayValue = [[charactersArray objectAtIndex:i] intValue];
UIButton *characterButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
characterButton.frame = CGRectMake(y,200.0, 35.0, 35.0);
y = y + 38;
if (jumbledWord.length>=11 && jumbledWord.length<15)
{
translation = (self.view.frame.size.width - characterButton.frame.size.width)+70.0;
}
if (jumbledWord.length>=15 && jumbledWord.length<=20)
{
translation = (self.view.frame.size.width - characterButton.frame.size.width)+150.0;
}
characterButton.transform = CGAffineTransformMakeTranslation(translation, 0);
[UIView animateWithDuration:1.30f
delay:0.7
options:UIViewAnimationOptionTransitionFlipFromRight
animations:^{
characterButton.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished) {
}];
[wordButtons addObject:characterButton];
NSString *characterValue = [NSString stringWithFormat:#"%c",[jumbledWord characterAtIndex:arrayValue]];
[characterButton setTitle:characterValue forState:UIControlStateNormal];
[characterButton addTarget:self action:#selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];
if (arrayValue==0)
{
arrayValue = 100;
}
[characterButton setTag:arrayValue*100];
[self.view addSubview:characterButton];
}
}
}
I do acknowledge the ideal choice would be to assign the frame i.e. "x" positions for buttons,but how do I do this.The other option being exchanging the index positions and I tried it too,i.e.:
-(void)shuffleButtons
{
for (UIButton *characterButton in wordButtons)
{
id sortObject1 = [self.wordButtons objectAtIndex:0];
id sortObject1 = [self.wordButtons objectAtIndex:1];
id sortObject1 = [self.wordButtons objectAtIndex:2];
[self.wordButtons removeObjectAtIndex:0];
[self.wordButtons removeObjectAtIndex:1];
[self.wordButtons insertObject:characterButton atIndex:1];
[self.wordButtons insertObject:characterButton atIndex:0];
[self.wordButtons removeObjectAtIndex:2];
[self.wordButtons insertObject:characterButton atIndex:1];
}
}
OOPS and it crashes,any one please guide me a way.I need to accomplish because there is an option for user to shuffle the jumbled arrangement of a word.
Thanks in advance :)

Answer 1

I've already developed a sample project for this.
Take a look at DragME source over github.

Answer 2

Since we are having all the buttons in wordButtons array,we can make use of those index locations and exchange their places with a little animation ;) ,i.e.
- (void)exchangeButtons
{
UIButton *firstButton = self.wordButtons[0];
UIButton *lastButton = self.wordButtons[self.wordButtons.count - 1];
UIButton *secondButton = self.wordButtons[1];
UIButton *thirdButton = self.wordButtons[2];
[self exchangeButton:firstButton withAnother:lastButton];
[self exchangeButton:secondButton withAnother:thirdButton];
}
//Animate buttons while interchanging positions
- (void)exchangeButton:(UIButton *)firstButton withAnother:(UIButton *)secondButton
{
CGRect firstButtonFrame = firstButton.frame; [UIView animateWithDuration:1.0f animations:^{ firstButton.frame = secondButton.frame; secondButton.frame = firstButtonFrame; }];
}
Please note that the exchange button code may vary,it all depends on the length of word i.e. number of buttons.So you may place conditions like if(wordButtons.count >= 6) or >=10 etc. before you exchange the button indices.
P.S. -- A more effective and non-hard coded solution
Let's store the frame of the button while creating a row of buttons and use that to interchange the button positions i.e. while creation assign our button frame to declared CGRect object,i.e.
CGRect originalFrameArray[16]; --> **Global variable**
originalFrameArray[i] = characterButton.frame;
Now let's create 2 arrays,one for shuffling the word and storing the character buttons indices,other for modifying the buttons array and then start exchanging the buttons with little animation :)
- (void)exchangeButtons
{
NSMutableArray *charactersArray = [NSMutableArray array];
NSMutableArray *copyOfButtons = [NSMutableArray arrayWithArray:wordButtons];
BOOL record = NO;
int randomNumber;
for (int i=0; [charactersArray count] < jumbledWord.length; i++) //Loop for generate different random values
{
randomNumber = arc4random() % jumbledWord.length;//generating random number
if(i==0)
{
[charactersArray addObject:[NSNumber numberWithInt:randomNumber]];
}
else
{
for (int j=0; j<= [charactersArray count]-1; j++)
{
if (randomNumber ==[[charactersArray objectAtIndex:j] intValue])
record = YES;
}
if (record == YES)
record = NO;
else
[charactersArray addObject:[NSNumber numberWithInt:randomNumber]];
}
}
int arrayValue;
for(int i=0;i<[jumbledWord length];i++)
{
arrayValue = [[charactersArray objectAtIndex:i] intValue];
[wordButtons replaceObjectAtIndex:arrayValue withObject:[copyOfButtons objectAtIndex:i]];
}
for(int i=0; i < [jumbledWord length]; i++)
{
UIButton *characterButton = [wordButtons objectAtIndex:i];
[self shiftButtonToFrame:characterButton :originalFrameArray[i]];
}
}
//Animate the buttons while they exchange positions
- (void) shiftButtonToFrame:(UIButton *) characterButton :(CGRect) frame
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:1.0];
[characterButton setFrame:frame];
[UIView commitAnimations];
}
Hope it helps some one.Thanks and happy coding :)