Question

我需要创建一个简单的聊天视图，在其中我可以像任何消息应用程序一样显示来自两端（发送方和接收方）的消息。

我到目前为止所做的是，创建了UITableView，A UIButton和UITextField。在UIButton上，我将UITextField文本添加到数组中，现在我需要第二个端点，就像我们的Messaging应用程序（发送方）一样。

左侧是接收方，右侧是发送方。

我的应用程序到现在为止

这是我的代码：

 - (UITableViewCell *)tableView:(UITableView *)tableView
     cellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @"Cell";

messageLabel = nil;

UITableViewCell *cell = [tableView
                         dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

    cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];

    messageLabel = [[UILabel alloc] init];
    messageLabel.tag = 101;
    [cell.contentView addSubview: messageLabel];

      } else {


    messageLabel = (UILabel*)[cell.contentView viewWithTag: 101];

      }    //---calculate the height for the label---
int labelHeight = [self labelHeight:[listOfMessages objectAtIndex:indexPath.row]];
labelHeight -= bubbleFragment_height;
if (labelHeight<0) labelHeight = 0;

messageLabel.frame =
CGRectMake(bubble_x + 10, bubble_y + 5,
           (bubbleFragment_width * 3) - 25,
           (bubbleFragment_height * 2) + labelHeight - 10);

messageLabel.font = [UIFont systemFontOfSize:15];
messageLabel.textAlignment = NSTextAlignmentCenter;
messageLabel.textColor = [UIColor darkTextColor];
messageLabel.backgroundColor = [UIColor greenColor];
messageLabel.numberOfLines = 0;
messageLabel.layer.cornerRadius = 8;
messageLabel.layer.masksToBounds = YES;

messageLabel.text = [listOfMessages objectAtIndex:indexPath.row];
[cell setSelectionStyle:UITableViewCellSelectionStyleNone];

return cell;
}

-(void) sendAction:(id) sender {
[listOfMessages addObject:field.text];

[chatTable reloadData];
field.text = @"";

[field resignFirstResponder];
 }

Answer 1

您可以为发件人提供两个不同的自定义单元格，为收件人提供一个自定义单元格，如下所示：

for Sender

for Receiver

现在，在您的应用中，必须有登录和注册过程，因为它是一个聊天应用，并且会有与您的应用相关联的服务器来保存数据。

您可以做的是，当您发送消息时，还要发送消息的名称并将其存储在您的数据库中。

现在，在聊天视图中，获取所有消息数据以及接收者名称。

获取登录过程中当前登录的userName。

您可以在cellForRowAtIndexPath:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{

    NSString *myArrayElement = [arr_receiverUserName objectAtIndex:indexPath.row];

    //do something useful with myArrayElement

    if(![myArrayElement isEqualToString:userName])
    {
         /// These are my messages.
         //// Pop up 'mycell' here 

            UILabel *lbl_myText = [[UILabel alloc]initWithFrame:CGRectZero];
            [lbl_myText setLineBreakMode:NSLineBreakByWordWrapping];
            lbl_myText.minimumScaleFactor = FONT_SIZE;
            [lbl_myText setNumberOfLines:0];
            lbl_myText.textAlignment = NSTextAlignmentRight;
            [lbl_myText setFont:[UIFont systemFontOfSize:FONT_SIZE]];

            NSString *text = [arr_text objectAtIndex:indexPath.row];

            CGSize size = [text sizeWithFont:[UIFont systemFontOfSize:FONT_SIZE]];

            // Checks if text is multi-line
            if (size.width > lbl_myText.bounds.size.width)
            {
                CGSize constraint = CGSizeMake(CELL_CONTENT_WIDTH - (CELL_CONTENT_MARGIN * 2), 20000.0f);

                CGSize size = [text sizeWithFont:[UIFont systemFontOfSize:FONT_SIZE] constrainedToSize:constraint lineBreakMode:NSLineBreakByWordWrapping];

                [lbl_myText setText:text];
                [lbl_myText setFrame:CGRectMake(CELL_CONTENT_MARGIN, CELL_CONTENT_MARGIN, CELL_CONTENT_WIDTH - cell.imgv_myImage.frame.size.width -(CELL_CONTENT_MARGIN * 2), MAX(size.height, 44.0f))];
            }

            else
            {
                lbl_myText.frame = CGRectMake(10, 0, cell.frame.size.width - cell.imgv_myImage.frame.size.width - 18,18);
                lbl_myText.textAlignment = NSTextAlignmentRight;
                [lbl_myText setText:text];
            }

            //lbl_myText.backgroundColor = [UIColor greenColor];

            [cell.contentView addSubview:lbl_myText];

    }

    else
    {
        //// These are the messages sent by some one else

       /// Pop up `someonecell` here

        UILabel *lbl_myText = [[UILabel alloc]initWithFrame:CGRectZero];
        [lbl_myText setLineBreakMode:NSLineBreakByWordWrapping];
        lbl_myText.minimumScaleFactor = FONT_SIZE;
        [lbl_myText setNumberOfLines:0];
        lbl_myText.textAlignment = NSTextAlignmentLeft;
        [lbl_myText setFont:[UIFont systemFontOfSize:FONT_SIZE]];

        NSString *text = [arr_text objectAtIndex:indexPath.row];

        CGSize size = [text sizeWithFont:[UIFont systemFontOfSize:FONT_SIZE]];

        // Checks if text is multi-line
        if (size.width > lbl_myText.bounds.size.width)
        {
            CGSize constraint = CGSizeMake(CELL_CONTENT_WIDTH - (CELL_CONTENT_MARGIN * 2), 20000.0f);

            CGSize size = [text sizeWithFont:[UIFont systemFontOfSize:FONT_SIZE] constrainedToSize:constraint lineBreakMode:NSLineBreakByWordWrapping];

            [lbl_myText setText:text];
            [lbl_myText setFrame:CGRectMake(cell.imgv_someoneImage.frame.size.width+8, CELL_CONTENT_MARGIN, CELL_CONTENT_WIDTH - cell.imgv_someoneImage.frame.size.width -(CELL_CONTENT_MARGIN * 2), MAX(size.height, 44.0f))];
        }

        else
        {
            lbl_myText.frame = CGRectMake(10, 0, cell.frame.size.width - cell.imgv_someoneImage.frame.size.width - 18,18);
            lbl_myText.textAlignment = NSTextAlignmentLeft;
            [lbl_myText setText:text];
        }

        //lbl_myText.backgroundColor = [UIColor greenColor];

        [cell.contentView addSubview:lbl_myText];

    }

你可以为图像和音频做类似的事情。

细胞的动态高度：

要根据UILabels制作单元格的高度，请参阅Increase the main tableview row height according to the custom cell

Answer 2

您需要使用不同的CellIdentifier For Example创建多个单元格。 Cell用于发送者和接收者。您可以将其细分为文本，音频，视频，图像等类别。

从here下载示例ChatUI演示（Objective-C＆amp; Swift）

让我们举例说明文字聊天。

首先，您需要在Storyboard或XIB中使用不同的CellIdentifier创建2个单元格原型，例如＆＃34; cellSender＆＃34;和＆＃34; cellReceiver＆＃34;。

在单元格内取UILabel或UITextView，并使cellSender左对齐，cellReceiver使对齐正确，以便为发送方和接收方制作不同的布局。

然后您可以使用以下代码...

  - (UITableViewCell *)tableView:(UITableView *)tableView
         cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    BOOL sender = NO;

// Check for the sender or receiver 
    <code for checking message is from sender or receiver>

    static NSString *CellIdentifier = sender?@"cellSender":@"cellReceiver";

    messageLabel = nil;

    UITableViewCell *cell = [tableView
                             dequeueReusableCellWithIdentifier:CellIdentifier];

    if (cell == nil) {

        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];

        messageLabel = [[UILabel alloc] init];
        messageLabel.tag = 101;
        [cell.contentView addSubview: messageLabel];

          } else {


        messageLabel = (UILabel*)[cell.contentView viewWithTag: 101];

          }    //---calculate the height for the label---
    int labelHeight = [self labelHeight:[listOfMessages objectAtIndex:indexPath.row]];
    labelHeight -= bubbleFragment_height;
    if (labelHeight<0) labelHeight = 0;

    messageLabel.frame =
    CGRectMake(bubble_x + 10, bubble_y + 5,
               (bubbleFragment_width * 3) - 25,
               (bubbleFragment_height * 2) + labelHeight - 10);

    messageLabel.font = [UIFont systemFontOfSize:15];
    messageLabel.textAlignment = NSTextAlignmentLeft;
    messageLabel.textColor = [UIColor darkTextColor];
    messageLabel.backgroundColor = sender? [UIColor greenColor]: [UIColor lightGrayColor];
    messageLabel.numberOfLines = 0;
    messageLabel.layer.cornerRadius = 8;
    messageLabel.layer.masksToBounds = YES;

    messageLabel.text = [listOfMessages objectAtIndex:indexPath.row];
    [cell setSelectionStyle:UITableViewCellSelectionStyleNone];

    return cell;
    }

修改

在ios中创建一个简单的聊天视图

2 个答案: