iMessage APP學習筆記
iMessage App類別
1:Sticker pack app :單獨的表情包應用,不需要編寫任何程式碼,只需拖動圖片即可,包括靜態和動態表情
2:iMessage app :單獨的iMessage應用,要編寫程式碼,可以傳送表情包、文字、視訊、音訊。
上面兩個可單獨開發釋出也可以一個app的擴充套件嵌入到iMessage應用中。用於在“資訊”應用中訪問外部應用
巢狀iMessage APP到自己的APP
iMessage App本身是一個Extension,但是它可以獨立開發,不依賴任何Container App。我們也可以在現有的專案中新增iMessage App,系統會自動將其新增到Messages App Store。
- 在現有專案中新增iMessage App,可以通過新增Extension的方式新增(File->New->Target->Application Extension->Messages Extension)。
一、建立獨立的表情包應用(Sticker pack app ):
表情包限制(顯示在選擇列表時的大小,預設為Medium):
- Small :100 x 100 @3x scale (300 x 300 pixel image)
- Medium : 136 x 136 @3x scale (378 x 378 pixel image)
- Large : 206 x 206 @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:實現
< 1 > 建立Sticker Pack 工程
create a new Xcode project > iOS > Sticker Pack Application > Next
< 2 > 拖入圖片
選中Stickers.xcsstickers > 選中右邊的Sticker Pack資料夾 > 選中素材中的所有圖片 > 拖入Sticker Pack中
< 3 > 執行選擇message平臺
< 4 > 新增GIF動圖(下圖中最後兩個按鈕都為動圖,因為是截圖所以也看不到效果)
- 選中Sticker Pack資料夾 > 點選下方➕號 > 選擇New Sticker Sequence新增動態表情
- 拖入該動態圖片的各個幀圖片即可(拖入Frame1位置)
- 選中Sticker Sequence > 點選右皮膚中的屬性檢查器 > 設定Sticker Sequence分類下的Frame Per Second 設定時間
二:建立 iMessage 應用(iMessage app ):
< 1 > Create a new Xcode project > IOS > iMessage Application > Next
生成的目錄結構,主要是針對 MessageExtension 資料夾開發。
< 2 > 將圖片資源新增到工程中 。
< 3 > 在 MessagesAppViewController 中載入表情包資料,建立MSStickerBrowserViewController 實現MSStickerBrowserVie
wDataSource 代理資料 。
#import "MessagesViewController.h"
@interface MessagesViewController ()<MSStickerBrowserViewDataSource>
@property (nonatomic,strong) NSMutableArray *stickersArray;
@end
@implementation MessagesViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
// 初始化本地表情包
[self loadStickers];
// 建立本地表情包控制器
[self createStickerBrowserViewController];
}
//載入表情包,上面設定了資料來源,所以我們要載入圖片(資料)
- (void)loadStickers{
NSMutableArray *mArray = [NSMutableArray array];
for (int i = 1; i < 11; i++) {
// <span style="white-space:pre"> </span>//傳入對應的url
NSURL *url = [[NSBundle mainBundle] URLForResource:[NSString stringWithFormat:@"scoops%02d_sticker", i] withExtension:@"png"];
MSSticker *sticker = [[MSSticker alloc]initWithContentsOfFileURL:url localizedDescription:@"" error:nil];
[mArray addObject:sticker];
}
self.stickersArray = mArray;
}
// 要想顯示圖片表情,必須要初始化一個MSStickerBrowserViewController作為根檢視
- (void)createStickerBrowserViewController{
MSStickerBrowserViewController *browserVc = [[MSStickerBrowserViewController alloc]initWithStickerSize:MSStickerSizeSmall];
[self addChildViewController:browserVc];
[self.view addSubview:browserVc.view];
browserVc.stickerBrowserView.backgroundColor = [UIColor cyanColor];
//設定資料來源
browserVc.stickerBrowserView.dataSource = self;
browserVc.view.translatesAutoresizingMaskIntoConstraints = NO;
//自動佈局
[self.view.topAnchor constraintEqualToAnchor:browserVc.view.topAnchor].active = YES;
[self.view.bottomAnchor constraintEqualToAnchor:browserVc.view.bottomAnchor].active = YES;
[self.view.leftAnchor constraintEqualToAnchor:browserVc.view.leftAnchor].active = YES;
[self.view.rightAnchor constraintEqualToAnchor:browserVc.view.rightAnchor].active = YES;
}
#pragma mark - MSStickerBrowserViewDataSource 資料來源代理方法(必須實現)
// 一共有多少個
-(NSInteger)numberOfStickersInStickerBrowserView:(MSStickerBrowserView *)stickerBrowserView{
return self.stickersArray.count;
}
// 每一個要顯示什麼
- (MSSticker *)stickerBrowserView:(MSStickerBrowserView *)stickerBrowserView stickerAtIndex:(NSInteger)index{
return self.stickersArray[index];
}
三:在已有的專案中新增 iMessage APP 擴充套件,自定義ViewController可傳送圖片、音訊、視訊檔案
< 1 > 首先建立一個普通的工程,File->New->Target->Application Extension->Messages Extension
<2>執行 效果如下
<3>傳送自定義的表情,音訊,視訊等
主要程式碼
//傳送圖片
-(void)sendPhoto{
NSURL *url = [[NSBundle mainBundle] URLForResource:@"image" withExtension:@"png"];
[self sendMessageWithURL:url];
}
//傳送音樂
-(void)sendMusic{
NSURL *url = [[NSBundle mainBundle] URLForResource:@"blank" withExtension:@"mp3"];
[self sendMessageWithURL:url];
}
//傳送視訊
-(void)sendVideo{
NSURL *url = [[NSBundle mainBundle] URLForResource:@"moments" withExtension:@"mp4"];
[self sendMessageWithURL:url];
}
//傳送貼紙
-(void)sendStick{
[self requestPresentationStyle:MSMessagesAppPresentationStyleCompact];
NSURL *url = [[NSBundle mainBundle] URLForResource:@"sticker" withExtension:@"png"];
MSSticker *sticker = [[MSSticker alloc] initWithContentsOfFileURL:url localizedDescription:@"localizedDescription" error:nil];
[self.activeConversation insertSticker:sticker completionHandler:^(NSError * _Nullable error) {
if (error) {
NSLog(@"%@",error);
}
}];
}
//傳送自定義訊息
-(void)sendAlter{
[self requestPresentationStyle:MSMessagesAppPresentationStyleCompact];
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);
}
}];
}
// 通過 URL 傳送訊息
-(void)sendMessageWithURL:(NSURL *)url{
[self requestPresentationStyle:MSMessagesAppPresentationStyleCompact];
[self.activeConversation insertAttachment:url withAlternateFilename:nil completionHandler:^(NSError * _Nullable error) {
if (error) {
NSLog(@"%@",error);
}
}];
}
activeConversation 是 MSMessagesAppViewController 裡面的一個屬性,傳送音視訊檔案,都是通過這個方法。
有時候可能找不到對應的資原始檔, 可以再這裡檢視是否有加入的檔案,如果沒有加入,➕號加入該檔案即可。
Messages framework 說明
Apple在WWDC 2016上針對iOS提供的全新訊息框架(Messages framework)使得開發者能夠建立與Apple的“資訊”應用進行互動的應用擴充套件。
訊息框架包含一系列供開發者使用的基本類:
- MSMessageAppViewController:這個類為訊息擴充套件提供了主檢視控制元件,可用於呈現自定義使用者介面,管理擴充套件狀態,獲取當前對話,追蹤資訊的傳送等功能。
-
MSStickerBrowserViewController、MSStickerBrowserView和MSStickerBrowserViewDataSource:這些類可用於定製和呈現自定義或動態的貼紙瀏覽器(Sticker browser)。如果要為貼紙瀏覽器提供動態內容,可以實施自定義的MSStickerBrowserViewDataSource
。若要對預設貼紙瀏覽器的外觀進行定製,可以提供自己的MSStickerBrowserView
,並對瀏覽器尺寸、貼紙尺寸等內容進行定製。通過MSStickerView子類還可獲得進一步的定製能力。 - MSConversation:這個類負責呈現對話,將其插入訊息的輸入欄位即可用於傳送文字、貼紙、附件,或訊息物件。
- MSMessage:這個類可用於建立互動式訊息並可訪問訊息屬性,例如傳送人、訊息所述的會話,以及訊息所關聯的可選URL等
- MSSession:這個類可用於對訊息進行標識並進行後續更新,例如可將這一特性用於遊戲或協作應用中。
開發Messages App中的建議
1.確保應用是有用的並且易於理解。
2.功能要聚焦單一,不要組合多種功能在一起。
3.Messages通常用在雙人非正式的交談中,應從這裡入手,讓交流更加有趣。
4.Messages的最大兩點是分享,利用這一點出發開發Messages App。
5.插圖內容佈局要注意,系統會自動將內容變為圓角,不要把重要的資訊放在角落。
6.注意,在緊湊模式下,Messages App的介面是不允許水平滾動的。
7.同樣,在緊湊模式下,Messages App不允許鍵盤輸入
相關文章
- Appweb學習筆記APPWeb筆記
- 機器學習整合學習—Apple的學習筆記機器學習APP筆記
- 學習筆記:DOM之appendChild筆記APP
- Unity Application Block 1.2 學習筆記UnityAPPBloC筆記
- Flutter 學習筆記① 第一個 Flutter AppFlutter筆記APP
- Swift學習筆記之-Implicitly unwrapped optionalsSwift筆記APP
- numpy的學習筆記\pandas學習筆記筆記
- WinUI 3學習筆記(1)—— First Desktop AppUI筆記APP
- iOS學習筆記01 APP啟動相關iOS筆記APP
- JS學習筆記之call、apply的用法JS筆記APP
- Appium學習筆記4_元素定位方法APP筆記
- IT學習筆記筆記
- 學習筆記筆記
- 學習記錄APPAPP
- 【學習筆記】數學筆記
- 《JAVA學習指南》學習筆記Java筆記
- Elasticsearch學習筆記Elasticsearch筆記
- Scala學習筆記筆記
- MySql學習筆記MySql筆記
- jQuery 學習筆記jQuery筆記
- react學習筆記React筆記
- 學習筆記(4.3)筆記
- 學習筆記(4.4)筆記
- 學習筆記(3.29)筆記
- 學習筆記(4.1)筆記
- AOP學習筆記筆記
- AspectJ學習筆記筆記
- 學習筆記(3.27)筆記
- 學習筆記(4.2)筆記
- golang 學習筆記Golang筆記
- Zookeeper學習筆記筆記
- 學習筆記(3.24)筆記
- 學習筆記(3.25)筆記
- 學習筆記(3.21)筆記
- GitHub學習筆記Github筆記
- jest 學習筆記筆記
- typescript 學習筆記TypeScript筆記
- Echarts學習筆記Echarts筆記