iPhone SMS Chat Bubble Alignment

[tobyaherbert]

I am creating my first app and it is a bluetooth chat app. I decided to use sms style chat bubbles but am having some problems with the alignment. If you have any sent messages and then receive a message, all the messages change sides. This also happens the other way around. Any ideas? I am using a UITableView for this. Here is part of my .h file:

NSMutableArray *conversationArray;
	IBOutlet UITableView *tbl;
	IBOutlet UITextField *field;
	IBOutlet UIToolbar *toolbar;
	NSMutableArray *messages;
	UIImageView *balloonView;
	UILabel *label;
	UIImage *balloon;
	BOOL wasRecieved;
	BOOL wasSent;
}

@property (nonatomic, retain) GKSession *currentSession;
@property (nonatomic, retain) UITableView *tbl;
@property (nonatomic, retain) UITextField *field;
@property (nonatomic, retain) UIToolbar *toolbar;
@property (nonatomic, retain) NSMutableArray *messages;

- (IBAction)sendMessage:(id)sender;

And this is part of my .m file:

#pragma mark -
#pragma mark Table view methods

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return [messages count];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    static NSString *CellIdentifier = @"Cell";
	
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
		cell.selectionStyle = UITableViewCellSelectionStyleNone;
		tableView.separatorStyle = UITableViewCellSeparatorStyleNone;		
		
		balloonView = [[UIImageView alloc] initWithFrame:CGRectZero];
		balloonView.tag = 1;
		
		label = [[UILabel alloc] init];
		label.backgroundColor = [UIColor clearColor];
		label.tag = 2;
		label.numberOfLines = 0;
		label.lineBreakMode = UILineBreakModeWordWrap;
		label.font = [UIFont systemFontOfSize:14.0];
		
		UIView *message = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, cell.frame.size.width, cell.frame.size.height)];
		message.tag = 0;
		[message addSubview:balloonView];
		[message addSubview:label];
		
		message.autoresizingMask = UIViewAutoresizingFlexibleWidth;
		
		[cell.contentView addSubview:message];
		
		[balloonView release];
		[label release];
		[message release];
	}
	else
	{
		balloonView = (UIImageView *)[[cell.contentView viewWithTag:0] viewWithTag:1];
		label = (UILabel *)[[cell.contentView viewWithTag:0] viewWithTag:2];
	}
	
	NSString *text = [messages objectAtIndex:indexPath.row];
	CGSize size = [text sizeWithFont:[UIFont systemFontOfSize:14.0] constrainedToSize:CGSizeMake(240.0f, 480.0f) lineBreakMode:UILineBreakModeWordWrap];
	
	if (wasRecieved == YES) {
		balloonView.frame = CGRectMake(320.0f - (size.width + 28.0f), 2.0f, size.width + 28.0f, size.height + 15.0f);
		balloonView.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
		balloon = [[UIImage imageNamed:@"green.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
		label.frame = CGRectMake(307.0f - (size.width + 5.0f), 8.0f, size.width + 5.0f, size.height);
		label.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
	} else if (wasRecieved == NO) {
		balloonView.frame = CGRectMake(0.0, 2.0, size.width + 28, size.height + 15);
		balloonView.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
		balloon = [[UIImage imageNamed:@"grey.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
		label.frame = CGRectMake(16, 8, size.width + 5, size.height);
		label.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
	}
	
	balloonView.image = balloon;
	label.text = text;
	
    return cell;
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
	NSString *body = [messages objectAtIndex:indexPath.row];
	CGSize size = [body sizeWithFont:[UIFont systemFontOfSize:14.0] constrainedToSize:CGSizeMake(240.0, 480.0) lineBreakMode:UILineBreakModeWordWrap];
	return size.height + 15;
}

// Receive & send Controllers

- (void) mySendDataToPeers:(NSData *)data {
    if (currentSession) {
		NSLog(@"Data Sent!");
        [self.currentSession sendDataToAllPeers:data withDataMode:GKSendDataReliable error:nil];
		if(![field.text isEqualToString:@""])
		{
			wasSent = NO;
			[messages addObject:field.text];
			[tbl reloadData];
			
			field.text = @"";
			
			[self textFieldShouldReturn:nil];
			[field resignFirstResponder];
		}
	}
}

- (void) receiveData:(NSData *)data fromPeer:(NSString *)peer inSession:(GKSession *)session context:(void *)context {
	NSLog(@"Data Recieved!");
	NSString *str;
    str = [[NSString alloc] initWithData:data encoding:NSASCIIStringEncoding];
	if (vibration.on) {
		AudioServicesPlayAlertSound(kSystemSoundID_Vibrate);
	}
	if (alertTone.on) {
		[NSTimer scheduledTimerWithTimeInterval:0.0 target:self selector:@selector(audioService) userInfo:nil repeats:NO];
	}
	wasRecieved = YES;
		[messages addObject:str];
		[tbl reloadData];
	[str release];
	str = nil;
}

Thanks in advance!

[jagds]

Hey..
R u using UITableView as dynamic or not..?
Please tell me i am also trying to do that..
But it get crashed on this code

Code here :
if (wasReceived == YES)
{
chatimageView.frame = CGRectMake(320.0f - (size.width + 28.0f), 2.0f, size.width + 28.0f, size.height + 15.0f);
chatimageView.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
ballon = [[UIImage imageNamed:@"green.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
chatLabel.frame = CGRectMake(307.0f - (size.width + 5.0f), 8.0f, size.width + 5.0f, size.height);
chatLabel.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
}
else if (wasReceived == NO)
{
chatimageView.frame = CGRectMake(0.0f, 2.0f, size.width + 28.0f, size.height + 15.0f);
chatimageView.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
ballon = [[UIImage imageNamed:@"grey.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
chatLabel.frame = CGRectMake(16.0f, 8.0f, size.width + 5.0f, size.height);
chatLabel.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
}
chatimageView.image = ballon;
chatLabel.text = text;


Please tell me and suggest me...

[tobyaherbert]

Originally Posted by jagds

Hey..
R u using UITableView as dynamic or not..?
Please tell me i am also trying to do that..
But it get crashed on this code

Code here :
if (wasReceived == YES)
{
chatimageView.frame = CGRectMake(320.0f - (size.width + 28.0f), 2.0f, size.width + 28.0f, size.height + 15.0f);
chatimageView.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
ballon = [[UIImage imageNamed:@"green.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
chatLabel.frame = CGRectMake(307.0f - (size.width + 5.0f), 8.0f, size.width + 5.0f, size.height);
chatLabel.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
}
else if (wasReceived == NO)
{
chatimageView.frame = CGRectMake(0.0f, 2.0f, size.width + 28.0f, size.height + 15.0f);
chatimageView.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
ballon = [[UIImage imageNamed:@"grey.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
chatLabel.frame = CGRectMake(16.0f, 8.0f, size.width + 5.0f, size.height);
chatLabel.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
}
chatimageView.image = ballon;
chatLabel.text = text;


Please tell me and suggest me...

I dont Remember i think i used non-dynamic tableview not sure though.
Regards
Toby...