在 UITableviewCell 中的气泡上显示图像

Posted 2023-02-24

【中文标题】在 UITableviewCell 中的气泡上显示图像

【英文标题】：Display image on bubble in UITableviewCell

【发布时间】：2015-10-02 04:52:41

【问题描述】：

当从图像选择器中的图像（见下面的代码示例）中选择一个图像作为消息气泡（见下面的屏幕截图）时，如何在UITableviewCell 中显示图像？

我正在使用 XMPPFramework 制作聊天应用程序。我已使用此Link 中的实现在“tableview”单元格中显示用于接收和发送消息的对话气泡。

当我选择图像或视频时，我想像在其他聊天应用程序中一样显示该图像。

这是UITableviewCell 的代码：

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

NSDictionary *s = (NSDictionary *) [messages objectAtIndex:indexPath.row];
NSLog(@"s:-%@",s);

static NSString *CellIdentifier = @"MessageCellIdentifier";

SMMessageViewTableCell *cell = (SMMessageViewTableCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil)

    //cell = [[SMMessageViewTableCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] ;
    cell=[[SMMessageViewTableCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];


NSString *sender = [s objectForKey:@"sender"];
NSString *message = [s objectForKey:@"msg"];
//NSString *time = [s objectForKey:@"time"];

CGSize  textSize =  260.0, 10000.0 ;

CGSize size = [message sizeWithFont:[UIFont boldSystemFontOfSize:13]
                  constrainedToSize:textSize
                      lineBreakMode:NSLineBreakByWordWrapping];

size.width += (padding/2);

cell.messageContentView.text = message;
cell.accessoryType = UITableViewCellAccessoryNone;
cell.userInteractionEnabled = NO;
cell.backgroundColor=[UIColor clearColor];
UIImage *bgImage = nil;

if ([sender isEqualToString:@"you"])
 // left aligned
    bgImage = [[UIImage imageNamed:@"aqua.png"] stretchableImageWithLeftCapWidth:24  topCapHeight:15];

    [cell.messageContentView setFrame:CGRectMake(360 - size.width - padding,
                                                 padding*2,
                                                 size.width,
                                                 size.height+10)];

    UIImageView *imgview=[[UIImageView alloc]initWithFrame:CGRectMake(360 - size.width -padding, padding*2, size.width, size.height+10)];
    imgview.image=image;

    [cell.messageContentView addSubview:imgview];


    [cell.bgImageView setFrame:CGRectMake(cell.messageContentView.frame.origin.x - padding/10,cell.messageContentView.frame.origin.y - padding/10,size.width+padding,size.height+padding)];

else

    bgImage = [[UIImage imageNamed:@"orange.png"] stretchableImageWithLeftCapWidth:24  topCapHeight:15];

    [cell.messageContentView setFrame:CGRectMake(padding, padding*2, size.width, size.height+10)];

    [cell.bgImageView setFrame:CGRectMake(cell.messageContentView.frame.origin.x - padding/10,cell.messageContentView.frame.origin.y - padding/10,size.width+padding,size.height+padding)];


cell.bgImageView.image = bgImage;
//cell.senderAndTimeLabel.text = [NSString stringWithFormat:@"%@ %@", sender, time];
cell.senderAndTimeLabel.text = [self GetDateAndTime];

return cell;

【问题讨论】：

你能解释一下你的问题吗？我几乎无法理解你真正在问什么。我的理解是，你想发送多媒体，例如聊天中的图像，您想将其显示在对话气泡中吗？对吗？

@NSNoob 当我从图像选择器中选择图像时，我想在 tableview 中显示该 iamge。

您是说您正在构建一个消息应用程序并希望将选定的图像从一台设备发送到另一台设备的表格视图？如果是，那么您需要通过网络传输图像并在其他设备上接收它。收到后，保存并重新加载您的表格视图。在您的 cellForRowAtIndexPath: 中提供从存储的图像加载图像的规定。

【参考方案1】：

在您的消息对象中，引入一个标志来确定消息类型。假设您将其命名为 isText。将文本设置为“是”，但将媒体消息设置为“否”（您可以在uiimagepicker 委托方法中执行此操作。现在在您的cellForRowAtIndexPath 中，您可以检查媒体类型。如果为“否”，则应插入@ 987654324@ 作为单元格中的子视图以显示该图像。确保在该子视图的边界留出边距，以便它正确地包含在对话气泡中。 为了确保对话气泡相应地调整自己的大小，现在您还必须编辑您的heightForRowAtIndexPath 方法。在第一行中，您正在那里获取消息对象，再次检查标志。如果为 NO，则将单元格的高度返回为 msgImage.frame.size.height+（父视图的上边距）+（父视图的下边距）。左右边距将通过将此 imageView 居中到其父视图的中心来固定，即语音气泡。

【讨论】：

希望这可以解释您所面临的问题。希望我可以为您编写代码，但我在工作，所以我真的不能。收起失败，因为我一定已经落后了，但这是帮助您实现预期结果的主要逻辑。

正确。详细例子可以参考这个大控制器：JSQMessagesViewController

请做。如果它解决了您的问题，您可能希望将其标记为正确答案，以帮助可能面临相同问题的其他人。完成后，您还可以添加编码实现。