iOS开发-iMessage App可发送贴纸、音频、视频

前言

iMessage app是iOS10中嵌入到Message内容的 iMessage apps，包含简单的表情包以及自定义的复杂界面。

iMessage APP可以分为2类：
- Sticker pack app：单独的表情包应用，不需要编写任何代码，只需拖动图片即可，包括静态和动态表情。
- iMessage app：单独的iMessage应用，要编写代码，可以发送表情包、文字、视频、音频。

上面两个也可以以一个APP扩展嵌入到iMessage 应用中。(比如美图秀秀)一个APP，在iMessage中又有扩展。卸载APP时就会把iMessage中的扩展也卸载掉。

本文图片大多来自官方例子
本文参考内容： Messages框架 、官方例子、iOS 10 创建iMessage App

创建Sticker pack app独立的表情包

表情包限制（只是建议，具体可以自己运行试试）
- Small: 100 x 100 pt @3x scale (300 x 300 pixel image)
- Medium: 136 x 136 pt @3x scale (378 x 378 pixel image)
- Large: 206 x 206 pt @3x scale (618 x 618 pixel image)

也有其他的一些限制, 表情包的大小:
- 文件中images不可以大于500kb;
- image不可以小于100 x 100 pt (300 x 300 pixels).
- image不可以大于206 x 206 pt (618 x 618 pixels).
- image格式必须是 PNG, APNG, JPEG, GIF ;

添加静态表情包

1.创建 Sticker pack工程

2.拖入图片

3.运行效果

完成了Sticker pack静态表情包。

添加动态表情包

1.选中Sticker Pack文件夹 点击下方➕号选择New Sticker Sequence添加动态表情。

2.拖入该动态图片的各个帧图片即可。

3.可设置动态表情包时间

4.运行效果

这就已经完成了Sticker pack app。

创建iMessage APP

个人理解有三种实现方式
1. 直接在MessagesAppViewController类中添加View。简单，复杂的View不好管理。
2. 创建MSStickerBrowserViewController。作为子类添加到MessagesAppViewController中，只需要实现贴纸界面可以选择这种方式比较简单。
3. 自定义一个ViewControlle，作为子类添加到MessagesAppViewController中。添加过后和普通APP开发基本没区别，但要注意View高度的变化，自动布局。

自定义贴纸布局

Messages框架有几个基础类：
MSMessagesAppViewController:iMessage APP程序入口，工程默认创建其子类MessagesAppViewController
MSSticker:表情。
MSStickerBrowserView:表情View。
MSStickerBrowserViewController:表情ViewController。
MSStickerBrowserViewDataSource:表情数据来源代理。
其实上面四个类就近似于UITableViewCell、UITableView、UITableViewController，UITableViewDataSource的关系（不过UITableViewCell是UIView子类，而MSSticker是NSObject子类）。

生成的目录结构，主要是针对MessageExtension文件夹开发。其中resource是自己加的图片数据。

在MessagesAppViewController中加载表情包数据，创建MSStickerBrowserViewController实现MSStickerBrowserViewDataSource代理数据。

#import "MessagesViewController.h"@interface MessagesViewController ()<MSStickerBrowserViewDataSource>@property (nonatomic,strong) NSMutableArray *stickers;@end@implementation MessagesViewController- (void)viewDidLoad {    [super viewDidLoad];    [self loadStickers];    [self createStickerBrowser];}//加载表情包- (void)loadStickers {    NSMutableArray *arrayM = [NSMutableArray array];    for (int i = 1; i < 11; i++) {        NSURL *url = [[NSBundle mainBundle] URLForResource:[NSString stringWithFormat:@"scoops%02d_sticker",i] withExtension:@"png"];        MSSticker *sticker = [[MSSticker alloc] initWithContentsOfFileURL:url localizedDescription:@"" error:nil];        [arrayM addObject:sticker];    }    self.stickers = arrayM;}-(void)createStickerBrowser{    MSStickerBrowserViewController *controller = [[MSStickerBrowserViewController alloc] initWithStickerSize:MSStickerSizeSmall];    [self addChildViewController:controller];    [self.view addSubview:controller.view];    controller.stickerBrowserView.backgroundColor = [UIColor greenColor];    controller.stickerBrowserView.dataSource = self;    controller.view.translatesAutoresizingMaskIntoConstraints = NO;    //自动布局    [self.view.topAnchor constraintEqualToAnchor:controller.view.topAnchor].active = YES;    [self.view.bottomAnchor constraintEqualToAnchor:controller.view.bottomAnchor].active = YES;    [self.view.leftAnchor constraintEqualToAnchor:controller.view.leftAnchor].active = YES;    [self.view.rightAnchor constraintEqualToAnchor:controller.view.rightAnchor].active = YES;}@end

这样就完成了在代码中添加贴图。

自定义ViewController可发送图片，音频，视频文件

我们可以像上面一样添加一个iMessage应用，也可以在一个普通APP中加入iMessage扩展(APP)。接下来我们在已有的项目中添加iMessage APP扩展。
点击➕添加iMessage扩展



点击finish，弹框选Yes。完成添加扩展生成的目录和创建的iMessage APP在MyMessage2Extension目录下是一样的。

发送图片、音视频文件。

activeConversation是MSMessagesAppViewController里面的一个属性。发送音视频文件，都是通过这个方法。

[self.activeConversation insertAttachment:url withAlternateFilename:nil completionHandler:^(NSError * _Nullable error) {    if (error) {        NSLog(@"%@",error);    }}];

传入对应文件的URL即可。

NSURL *url = [[NSBundle mainBundle] URLForResource:@"image" withExtension:@"png"];

有时候可能找不到对应的URL。可在这里查看是否有加入的文件，没有点击➕号加入该文件即可。

发送贴纸

发送贴纸通过这个方法，同理传入对应URL即可，注意贴纸尺寸问题。

MSSticker *sticker = [[MSSticker alloc] initWithContentsOfFileURL:url localizedDescription:@"localizedDescription" error:nil];[self.activeConversation insertSticker:sticker completionHandler:^(NSError * _Nullable error) {    if (error) {        NSLog(@"%@",error);    }}];

发送自定义消息

发送自定义消息主要是定义message的layout属性以及其他的相关属性。

MSMessageTemplateLayout *layout = [[MSMessageTemplateLayout alloc] init];layout.image = [UIImage imageNamed:@"image"];layout.imageTitle = @"老虎";MSMessage *message = [[MSMessage alloc] init];message.layout =layout;[self.activeConversation insertMessage:message completionHandler:^(NSError * _Nullable error) {    if (error) {        NSLog(@"%@",error);    }}];

参考内容：iOS 10 创建iMessage App、 Messages框架 、官方例子

如果能弄懂官方例子的话iMessage APP可以说基本掌握了。

附上自己写的Demo