Add Support for WhatsApp Style Attachments

Example/Sources/Data Generation/SampleData.swift

@@ -43,6 +43,7 @@ final internal class SampleData {
     case Location
     case Url
     case Phone
+    case Attachment
     case Custom
     case ShareContact
     case System
@@ -233,6 +234,10 @@ final internal class SampleData {
       return MockMessage(text: "123-456-7890", user: user, messageId: uniqueID, date: date)
     case .Custom:
       return MockMessage(custom: "Someone left the conversation", user: system, messageId: uniqueID, date: date)
+    case .Attachment:
+      let image = messageImages.random()!
+      let randomSentence = Lorem.sentence()
+      return MockMessage(image: image, text: randomSentence, user: user, messageId: uniqueID, date: date)
     case .ShareContact:
       return MockMessage(contact: contactsToShare.random()!, user: user, messageId: uniqueID, date: date)
     case .System:

Example/Sources/Models/MockMessage.swift

@@ -167,6 +167,11 @@ internal struct MockMessage: MessageType {
     self.init(kind: .linkPreview(linkItem), user: user, messageId: messageId, date: date)
   }
 
+  init(image: UIImage, text: String, user: MockUser, messageId: String, date: Date) {
+    let mediaItem = ImageMediaItem(image: image)
+    self.init(kind: .attachment(text, mediaItem), user: user, messageId: messageId, date: date)
+  }
+
   // MARK: Internal
 
   var messageId: String

Example/Sources/View Controllers/ChatViewController.swift

@@ -277,6 +277,10 @@ extension ChatViewController: MessageCellDelegate {
   func didTapAccessoryView(in _: MessageCollectionViewCell) {
     print("Accessory view tapped")
   }
+
+  func didTapAttachment(in cell: AttachmentMessageCell) {
+    print("ImageView of Attachment tapped")
+  }
 }
 
 // MARK: MessageLabelDelegate

Example/Sources/View Controllers/SettingsViewController.swift

@@ -53,7 +53,8 @@ final internal class SettingsViewController: UITableViewController {
     "Url Messages",
     "Phone Messages",
     "ShareContact Messages",
-    "System Messages"
+    "System Messages",
+    "Attachment Messages"
   ]
 
   var messagesPicker = UIPickerView()

Sources/Controllers/MessagesViewController.swift

@@ -178,6 +178,10 @@ open class MessagesViewController: UIViewController, UICollectionViewDelegateFlo
       let cell = messagesCollectionView.dequeueReusableCell(SystemMessageCell.self, for: indexPath)
       cell.configure(with: message, at: indexPath, and: messagesCollectionView)
       return cell
+    case .attachment:
+      let cell = messagesCollectionView.dequeueReusableCell(AttachmentMessageCell.self, for: indexPath)
+      cell.configure(with: message, at: indexPath, and: messagesCollectionView)
+      return cell
     }
   }
 
@@ -271,6 +275,9 @@ open class MessagesViewController: UIViewController, UICollectionViewDelegateFlo
     case .text, .attributedText, .emoji, .photo:
       selectedIndexPathForMenu = indexPath
       return true
+    case .attachment(let text, _):
+      selectedIndexPathForMenu = indexPath
+      return !text.isEmpty
     default:
       return false
     }
@@ -303,6 +310,9 @@ open class MessagesViewController: UIViewController, UICollectionViewDelegateFlo
       pasteBoard.string = attributedText.string
     case .photo(let mediaItem):
       pasteBoard.image = mediaItem.image ?? mediaItem.placeholderImage
+    case .attachment(let text, let item):
+      pasteBoard.string = text
+      pasteBoard.image = item.image ?? item.placeholderImage
     default:
       break
     }

Sources/Extensions/CGRect+Extensions.swift

@@ -28,3 +28,24 @@ extension CGRect {
     self.init(x: x, y: y, width: w, height: h)
   }
 }
+
+extension CGSize {
+
+  func aspectFit(minWidth: CGFloat, maxWidth: CGFloat) -> CGSize {
+    if self.width > maxWidth {
+      let height = maxWidth * self.aspectRatio
+      return CGSize(width: maxWidth, height: height)
+    }
+
+    if self.width < minWidth {
+      let height = minWidth * self.aspectRatio
+      return CGSize(width: minWidth, height: height)
+    }
+
+    return self
+  }
+
+  var aspectRatio: CGFloat {
+    return self.height / self.width
+  }
+}

Sources/Layout/AttachmentMessageSizeCalculator.swift

@@ -0,0 +1,83 @@
+/*
+ MIT License
+ Copyright (c) 2017-2019 MessageKit
+ Permission is hereby granted, free of charge, to any person obtaining a copy
+ of this software and associated documentation files (the "Software"), to deal
+ in the Software without restriction, including without limitation the rights
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ copies of the Software, and to permit persons to whom the Software is
+ furnished to do so, subject to the following conditions:
+ The above copyright notice and this permission notice shall be included in all
+ copies or substantial portions of the Software.
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ SOFTWARE.
+ */
+
+import UIKit
+
+open class AttachmentMessageSizeCalculator: MessageSizeCalculator {
+
+  public var incomingMessageLabelInsets = UIEdgeInsets(top: 7, left: 18, bottom: 9, right: 14)
+  public var outgoingMessageLabelInsets = UIEdgeInsets(top: 7, left: 14, bottom: 9, right: 18)
+
+  public var messageLabelFont = UIFont.preferredFont(forTextStyle: .body)
+
+  internal func messageLabelInsets(for message: MessageType) -> UIEdgeInsets {
+    let dataSource = messagesLayout.messagesDataSource
+    let isFromCurrentSender = dataSource.isFromCurrentSender(message: message)
+    return isFromCurrentSender ? outgoingMessageLabelInsets : incomingMessageLabelInsets
+  }
+
+  open override func messageContainerMaxWidth(for message: MessageType, at indexPath: IndexPath) -> CGFloat {
+    let maxWidth = super.messageContainerMaxWidth(for: message, at: indexPath)
+    let textInsets = messageLabelInsets(for: message)
+    return maxWidth - textInsets.horizontal
+  }
+
+  open override func messageContainerSize(for message: MessageType, at indexPath: IndexPath) -> CGSize {
+    let maxWidth = messageContainerMaxWidth(for: message, at: indexPath)
+    let attributedText: NSAttributedString
+
+    guard case .attachment(let text, let item) = message.kind else {
+      fatalError("messageContainerSize received unhandled MessageDataType: \(message.kind)")
+    }
+    attributedText = NSAttributedString(string: text, attributes: [.font: messageLabelFont])
+
+    let labelInsets = self.messageLabelInsets(for: message)
+    let image = item.image ?? item.placeholderImage
+    let imageSize = image.size.aspectFit(minWidth: 250, maxWidth: maxWidth)
+    var labelSize = self.labelSize(for: attributedText, considering: imageSize.width - labelInsets.horizontal)
+
+    labelSize.height += labelInsets.vertical
+
+    let width = imageSize.width
+    let height = labelSize.height + imageSize.height
+
+    let size = CGSize(width: width, height: height)
+    return size
+  }
+
+  open override func configure(attributes: UICollectionViewLayoutAttributes) {
+    super.configure(attributes: attributes)
+    guard let attributes = attributes as? MessagesCollectionViewLayoutAttributes else { return }
+
+    let dataSource = messagesLayout.messagesDataSource
+    let indexPath = attributes.indexPath
+    let message = dataSource.messageForItem(at: indexPath, in: messagesLayout.messagesCollectionView)
+
+    attributes.messageLabelInsets = messageLabelInsets(for: message)
+    attributes.messageLabelFont = messageLabelFont
+  }
+
+  override func labelSize(for attributedText: NSAttributedString, considering maxWidth: CGFloat) -> CGSize {
+    let label = MessageLabel()
+    label.attributedText = attributedText
+    let size = label.sizeThatFits(CGSize(width: maxWidth, height: .greatestFiniteMagnitude))
+    return size
+  }
+}

Sources/Layout/MessagesCollectionViewFlowLayout.swift

@@ -71,6 +71,7 @@ open class MessagesCollectionViewFlowLayout: UICollectionViewFlowLayout {
   lazy open var typingIndicatorSizeCalculator = TypingCellSizeCalculator(layout: self)
   lazy open var linkPreviewMessageSizeCalculator = LinkPreviewMessageSizeCalculator(layout: self)
   lazy open var systemMessageSizeCalculator = SystemMessageSizeCalculator(layout: self)
+  lazy open var attachmentMessageSizeCalculator = AttachmentMessageSizeCalculator(layout: self)
 
   /// A method that by default checks if the section is the last in the
   /// `messagesCollectionView` and that `isTypingIndicatorViewHidden`
@@ -164,6 +165,8 @@ open class MessagesCollectionViewFlowLayout: UICollectionViewFlowLayout {
       return messagesLayoutDelegate.customCellSizeCalculator(for: message, at: indexPath, in: messagesCollectionView)
     case .system:
       return systemMessageSizeCalculator
+    case .attachment:
+      return attachmentMessageSizeCalculator
     }
   }
 
@@ -184,7 +187,8 @@ open class MessagesCollectionViewFlowLayout: UICollectionViewFlowLayout {
       audioMessageSizeCalculator,
       contactMessageSizeCalculator,
       linkPreviewMessageSizeCalculator,
-      systemMessageSizeCalculator
+      systemMessageSizeCalculator,
+      attachmentMessageSizeCalculator
     ]
   }
 

Sources/Models/MessageKind.swift

@@ -66,6 +66,9 @@ public enum MessageKind {
   /// A system message.
   case system(NSAttributedString)
 
+  /// A photo and text message
+  case attachment(String, MediaItem)
+
   // MARK: - Not supported yet
 
 //    case system(String)

Sources/Protocols/MessageCellDelegate.swift

@@ -157,6 +157,16 @@ public protocol MessageCellDelegate: MessageLabelDelegate {
   /// `indexPath(for: cell)` method. Then using the returned `IndexPath` with the `MessagesDataSource`
   /// method `messageForItem(at:indexPath:messagesCollectionView)`.
   func didStopAudio(in cell: AudioMessageCell)
+
+  /// Triggered when imageView of AttachmentMessageCell is tapped on
+  ///
+  /// - Parameters:
+  ///   - cell: The cell where the imageView was tapped on.
+  ///
+  /// You can get a reference to the `MessageType` for the cell by using `UICollectionView`'s
+  /// `indexPath(for: cell)` method. Then using the returned `IndexPath` with the `MessagesDataSource`
+  /// method `messageForItem(at:indexPath:messagesCollectionView)`.
+  func didTapAttachment(in cell: AttachmentMessageCell)
 }
 
 extension MessageCellDelegate {