将 JSQMessagesViewController 与 Parse.com 一起使用

Question

我遇到了一个看起来非常复杂且可自定义的库，对于任何想要内置消息传递系统的应用程序都非常有用。JSQMessagesViewController on Github。当我试图自己实现这个库时，我遇到了一些问题。一个我不太了解“协议”和“类”的术语（我对类有点了解）。第一个问题是我不能在 CollectionView 中使用 PFObjects，因为 JSQMessage 的实例需要通过大多数自定义方法传递。现在，我知道如何接收 PFObject 并从中获取属性，例如

self.eachMessage = [self.messages objectAtIndex:indexPath.row]; //each message
self.eachMessage[@"message"] //message from the PFObject
self.eachMessage[@"sender"] //sender from the PFObject

JSQMessage 类具有自定义属性，可以表示 PFObject 的属性，例如

JSQMessage *message = [[JSQMessage alloc] init]; //initialize it
message.senderId //could be the objectId of the user
message.senderDisplayName //the user's username
message.text //text of the message
message.date //time sent of the message

问题是，在自定义类 JSQMessage 中……所有这些属性都是只读的。我确信我可以进去改变它，这样我就可以将它们分配给我想要的东西，但这里一定有我遗漏的东西。我将在我的 .h 和 .m 文件中附加所有内容。 当我确实发送消息时，唯一通过的就是文本，我相信这是因为它来自 inputToolbar 上的 textView。

.h 文件

#import <UIKit/UIKit.h>
#import <JSQMessagesViewController/JSQMessages.h>
#import <Parse/Parse.h>
#import <JSQMessagesViewController/JSQMessagesBubbleImageFactory.h>


@interface ConvoViewController : JSQMessagesViewController 

@property (strong, nonatomic) NSMutableArray *messages;
@property (strong, nonatomic) PFUser *sender;
@property (strong, nonatomic) PFUser *receiver;
@property (strong, nonatomic) JSQMessage *eachMessage;
@property (strong, nonatomic) PFObject *aMessage;
@property (strong, nonatomic) JSQMessagesBubbleImageFactory *bubbleImage;

@end

.m 文件

- (void)viewDidLoad {
    [super viewDidLoad];
    //Color of the keyboard (Dark to match everything else)
    self.inputToolbar.contentView.textView.keyboardAppearance = UIKeyboardAppearanceDark;

    //Color the inputview background
    self.inputToolbar.backgroundColor = [UIColor colorWithWhite:0 alpha:0.9];

    //Delete the avatars appearing next to the messages
    self.collectionView.collectionViewLayout.incomingAvatarViewSize = CGSizeZero;
    self.collectionView.collectionViewLayout.outgoingAvatarViewSize = CGSizeZero;

    //Set the senderID
    self.senderId = self.sender.objectId;


}

- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear:YES];

    //Query for part of the messages
    PFQuery *messages1 = [PFQuery queryWithClassName:@"Messages"];
    [messages1 whereKey:@"sender" equalTo:self.sender];
    [messages1 whereKey:@"receiver" equalTo:self.receiver];

    //Query for other part of messages
    PFQuery *messages2 = [PFQuery queryWithClassName:@"Messages"];
    [messages2 whereKey:@"sender" equalTo:self.receiver];
    [messages2 whereKey:@"receiver" equalTo:self.sender];

    //Combine those queries
    PFQuery *allMessages = [PFQuery orQueryWithSubqueries:@[messages1, messages2]];
    [allMessages findObjectsInBackgroundWithBlock:^(NSArray *objects, NSError *error) {
        self.messages = [objects mutableCopy];
        [self.collectionView reloadData];
    }];

}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


#pragma mark - Send Button
- (void)didPressSendButton:(UIButton *)button withMessageText:(NSString *)text senderId:(NSString *)senderId senderDisplayName:(NSString *)senderDisplayName date:(NSDate *)date {
    [JSQSystemSoundPlayer jsq_playMessageSentSound];

    JSQMessage *message = [[JSQMessage alloc] initWithSenderId:self.sender.objectId
                                             senderDisplayName:self.sender.username
                                                          date:[NSDate date]
                                                          text:text];

    [self.messages addObject:message];
    NSLog(@"%@", text);

    [self finishSendingMessageAnimated:YES];


}

#pragma mark - JSQMessages Data Source methods

- (id<JSQMessageData>)collectionView:(JSQMessagesCollectionView *)collectionView messageDataForItemAtIndexPath:(NSIndexPath *)indexPath
{
    //Return the actual message at each indexpath.row
    return [self.messages objectAtIndex:indexPath.row];
}

- (id<JSQMessageBubbleImageDataSource>)collectionView:(JSQMessagesCollectionView *)collectionView messageBubbleImageDataForItemAtIndexPath:(NSIndexPath *)indexPath
{
    /**
     *  You may return nil here if you do not want bubbles.
     *  In this case, you should set the background color of your collection view cell's textView.
     *
     *  Otherwise, return your previously created bubble image data objects.
     */

    JSQMessage *message = [self.messages objectAtIndex:indexPath.item];
    if ([message.senderId isEqualToString:self.senderId]) {
        return [self.bubbleImage incomingMessagesBubbleImageWithColor:[UIColor orangeColor]];
    }

    return [self.bubbleImage outgoingMessagesBubbleImageWithColor:[UIColor grayColor]];
}



#pragma mark - Collection View

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    //Number of messages
    return self.messages.count;
}

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    //Number of sections
    return 1;
}


- (UICollectionViewCell *)collectionView:(JSQMessagesCollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    //Creating or initial cell for the number of index paths (number of messages)
    JSQMessagesCollectionViewCell *cell = (JSQMessagesCollectionViewCell *)[super collectionView:collectionView cellForItemAtIndexPath:indexPath];

    //Put our messages dictionaries into PFObject so we can put them into individual cells
    self.eachMessage = [self.messages objectAtIndex:indexPath.row];


    //Put the message object into the textView's text property
    cell.textView.text = self.eachMessage.text;

    //Setting the text color of the message bubble based upon the sender
    if ([self.eachMessage.senderId isEqualToString:self.senderId]) {
        cell.textView.textColor = [UIColor blackColor];
    } else {
        cell.textView.textColor = [UIColor whiteColor];
    }
    //Set the top label to the person who sent the message
    cell.cellTopLabel.text = [NSString stringWithFormat:@"@%@", self.eachMessage.senderId];

    //Format the bottom label to a readable date
    NSDateFormatter *dateFormatter = [[NSDateFormatter alloc] init];
    [dateFormatter setDateFormat:@"MM/dd/yy h:mm a"];
    cell.cellBottomLabel.text = [dateFormatter stringFromDate:self.eachMessage.date];

    //If there is a link of some sorts in the message
    cell.textView.linkTextAttributes = @{ NSForegroundColorAttributeName : cell.textView.textColor,
                                          NSUnderlineStyleAttributeName : @(NSUnderlineStyleSingle | NSUnderlinePatternSolid) };

    //What we return into the collectionview
    return cell;

}

Answer 1

这是我的代码的一部分。整个文件很大，如果我分享这些文件，我的老板不会高兴的。 :-)

这是我在DemoMessagesViewController 中加载 DemoData 的方式：

self.demoData = [[DemoModelData alloc] init];

self.demoData.users = @{self.senderId:self.senderDisplayName,
                        self.targetUserId:self.targetUserName};

UIImage *tempImg = [HTTPServerKaDost fetchImageFromUrlString:userProfile.profilePicUrl]; //replace with your code to load image

JSQMessagesAvatarImage *srcImage = [JSQMessagesAvatarImageFactory
                                    avatarImageWithImage:tempImg
                                    diameter:kJSQMessagesCollectionViewAvatarSizeDefault];

tempImg = [HTTPServerKaDost fetchImageFromUrlString:self.targetUserImageFullUrl];

JSQMessagesAvatarImage *destImage = [JSQMessagesAvatarImageFactory
                                     avatarImageWithImage:tempImg
                                     diameter:kJSQMessagesCollectionViewAvatarSizeDefault];

self.demoData.avatars = @{self.senderId:srcImage,
                          self.targetUserId:destImage};

[self.demoData loadMessages];

在loadMessages方法内（由我在DemoModelData类中添加），创建JSQMessage对象：

JSQMessage *msg = [[JSQMessage alloc] initWithSenderId:[msgDict valueForKey:@"sender"]
                                     senderDisplayName:[msgDict valueForKey:@"fname"]
                                                  date:dateT
                                                  text:[msgDict valueForKey:@"data"]];

[self.messages addObject:msg];

任何时候你想刷新聊天视图，都可以在DemoMessagesViewController 内调用：

[self finishReceivingMessageAnimated:YES];
[self scrollToBottomAnimated:YES];