12

我正在开发一个使用 JSQMessagesViewController 库的项目。有没有人成功地为打字指示器设置动画，如果可以，他们可以分享他们的方法吗？

谢谢！

4

2 回答 2

1

我参加聚会迟到了，但因为这也需要我很多时间，而且我的帖子可以帮助其他人，所以我会列出我的工作解决方案。我使用 APNG（动画 PNG，可能具有透明背景）作为输入指示器，因此我使用 APNGKit，它提供了一个名为 APNGImageView 的 UIImageView 子类

  • 将 JSQMessagesTypingIndicatorFooterView.xib 从 Pods/Pods/JSQMessagesViewController/Resources 复制到您的源文件夹，将其重命名为 MyMessagesTypingIndicatorFooterView.xib（例如）

  • 创建一个名为 MyMessagesTypingIndicatorFooterView 的类，如下所示：

    class MyMessagesTypingIndicatorFooterView: JSQMessagesTypingIndicatorFooterView { @IBOutlet weak var animatedImageView: APNGImageView!

        override func draw(_ rect: CGRect) {
        super.draw(rect)

    }

    override func awakeFromNib() {
        super.awakeFromNib();
    }

    public override class func nib() -> UINib! {
        return UINib(nibName: "MyMessagesTypingIndicatorFooterView", bundle: Bundle.main)
    }

    override class func footerReuseIdentifier()->String{
        return "MyMessagesTypingIndicatorFooterView"
    }   
}

  • 在 MyMessagesTypingIndicatorFooterView.xib 中添加 APNGImageView 实例，引用自定义类 MyMessagesTypingIndicatorFooterView。将引用出口 animatedImageView 添加到 MyMessagesTypingIndicatorFooterView 类。 在此处输入图像描述 在此处输入图像描述

  • 在 JSQMessagesViewController 的子类中注册自定义页脚并覆盖 viewForSupplementaryElementOfKind

    class MyMessagesViewController: JSQMessagesViewController{ override func viewDidLoad() {
    self.collectionView.register(MyMessagesTypingIndicatorFooterView.nib(), forSupplementaryViewOfKind: UICollectionElementKindSectionFooter, withReuseIdentifier: "MyMessagesTypingIndicatorFooterView")}

    override func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView { if kind == UICollectionElementKindSectionFooter{ let footerView = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionFooter, withReuseIdentifier: "MyMessagesTypingIndicatorFooterView", for: indexPath) as! MyMessagesTypingIndicatorFooterView //footerView let image = APNGImage(named: "typing1.png") footerView.animatedImageView.image = image footerView.animatedImageView.startAnimating() return footerView } return super.collectionView(collectionView, viewForSupplementaryElementOfKind: kind, at: indexPath) } }

于 2018-03-16T14:32:25.710 回答
0

您将要查看JSQTypingIndicatorFooterView这里是文档。http://cocoadocs.org/docsets/JSQMessagesViewController/7.2.0/Classes/JSQMessagesTypingIndicatorFooterView.html

您可以设置ellipsisColor

messageBubbleColor它自己的气泡的颜色。

shouldDisplayOnLeft来决定它应该在左边还是右边。

collectionView它应该显示的集合视图。

于 2016-02-21T05:39:24.273 回答