iMessage Extension App

最近產(chǎn)品大人有需求準(zhǔn)備把iMessage Extension的功能集成進(jìn)公司app中前硫,當(dāng)然我個人對這些東西也非常感興趣疟丙,遂研究了兩天。參考鏈接如下:
iOS10中Messages獨立應(yīng)用與擴(kuò)展插件詳析
使用 Xcode 8 為 Message 構(gòu)建一個 Sticker App Extension
趁熱來一波昭卓,WWDC 2016 iMessage App開發(fā)
摘要 在iOS10系統(tǒng)中黍特,開發(fā)者可以為自己的項目添加表情擴(kuò)展包或者iMessages插件,也可以獨立于應(yīng)用之外薪丁,開發(fā)獨立的Message應(yīng)用或表情包遇西。 iMessage App 的載體是iOS系統(tǒng)的Message應(yīng)用,通過iMessage App严嗜,用戶可以發(fā)送更加豐富的消息內(nèi)容粱檀,享受更具交互性的會話體驗。

iMessage App入口

蘋果在系統(tǒng)的Message應(yīng)用中新增了iMessage Extension插件的入口漫玄,蘋果甚至為應(yīng)用擴(kuò)展添加了新的appStore茄蚯,在Message appStore中,可以設(shè)置應(yīng)用支持iMessage Extension的話自動或者手動添加到Message應(yīng)用抽屜睦优。

iMessageAppEntrance.png

iMessage AppStore用來干什么的呢第队?
1、顯示iMessage App;
2刨秆、為未安裝應(yīng)用的用戶提供安裝途徑(Inline App Attribution);
3凳谦、提供iap,Apple Pay和訪問相機(jī)功能衡未。

iMessage App只能在iOS(10+)系統(tǒng)運行尸执,iWatch和mac可以收到消息,但是不能解析缓醋。iWatch可以發(fā)送Stickers如失。
iMessage App本身是一個Extension,但是它可以獨立開發(fā)送粱,不依賴任何Container App褪贵。我們也可以在現(xiàn)有的項目中添加iMessage App,系統(tǒng)會自動將其添加到Messages App Store抗俄。如果不想創(chuàng)建Container App脆丁,在Xcode 8中,直接創(chuàng)建一個Messages Application
(****File->New->Project->Application->Messages Application****)动雹;在現(xiàn)有項目中添加iMessage App槽卫,可以通過添加Extension的方式添加
(****File->New->Target->Application Extension->Messages Extension****)。

iMessage 新增三種會話類型:
1胰蝠、Stickers
2歼培、Interactive Messages
3震蒋、可以發(fā)送圖片,音視頻躲庄,文本查剖,鏈接等等
具體效果見下圖:(.gif圖制作工具:licecap)

effect.gif

Sticker Pack表情包

無論是使用系統(tǒng)提供的默認(rèn)模板還是自定義模板在上面參考鏈接中已經(jīng)有詳細(xì)的說明,親測可用噪窘,這里不再贅述梗搅。

在現(xiàn)有工程內(nèi)集成iMessage App插件

我們在現(xiàn)有工程中按照
****File->New->Target->Application Extension->Messages Extension****添加Message Extension后Xcode會自動創(chuàng)建 MessageExtension文件夾,并且在該文件夾內(nèi)創(chuàng)建了MessagesViewController : MSMessagesAppViewController :UIViewController控制器效览,并且iOS 10中新增的Message.framework框架已經(jīng)自動被添加到工程中无切。Message.framework框架中新增的主要關(guān)鍵類如下:
MSMessageAppViewController:這個類Messages App的基礎(chǔ)視圖控制器類,其繼承自UIViewController丐枉,但其中添加了許多Messages App相關(guān)的聲明周期方法哆键。
MSConversation:描述一個會話實例。
MSSticker:表情貼圖實例瘦锹。
MSMessage:在Messages App之間進(jìn)行傳遞的消息實體籍嘹。
MSMessageLayout:抽象類,其并沒有實現(xiàn)任何方法弯院,有子類實現(xiàn)辱士。
MSMessageTemplateLayout:用于對消息實體MSMessage進(jìn)行布局排版。
MSStickerBorwserViewController:用于創(chuàng)建表情包視圖控制器听绳。
MSStickerBorwserView:表情包視圖容器颂碘,類似CollectionView。
MSStickerView:表情承載視圖椅挣。

MSMessageAppViewController

****Xcode自動生成的MessagesViewController類头岔,這個類就是此iMessages App的主界面視圖控制器。需要注意鼠证,iMessages App的視圖控制器都分為兩種狀態(tài)峡竣,分別為Compact(緊湊的)和Expanded(擴(kuò)寬的)。并且在這兩種狀態(tài)進(jìn)行切換時量九,視圖的底部的工具欄和頭部的導(dǎo)航欄也會交替出現(xiàn)适掰,所以在進(jìn)行模式切換的時候需要對界面做布局處理****。
目前所支持的模式系統(tǒng)提供了一個枚舉

typedef NS_ENUM(NSUInteger, MSMessagesAppPresentationStyle) {
    MSMessagesAppPresentationStyleCompact, //緊湊模式
    MSMessagesAppPresentationStyleExpanded //擴(kuò)寬模式
} NS_ENUM_AVAILABLE_IOS(10_0);

緊湊模式

圖片.png

擴(kuò)寬模式

圖片.png

需要注意的是系統(tǒng)提供了相關(guān)的API方便在兩種模式之間進(jìn)行切換

/*!
 @method     requestPresentationStyle:
 @abstract   Requests that Messages transition the extension to the specified presentation style.
 @param      presentationStyle   The presentation style to transition to.
 */
-(void)requestPresentationStyle:(MSMessagesAppPresentationStyle)presentationStyle;
MSConversation

MSMessageAppViewController類中已經(jīng)提供了一個當(dāng)前會話實例

/*!
 @property   activeConversation
 @abstract   Current active conversation.
 */
@property (nonatomic, strong, readonly, nullable) MSConversation *activeConversation;

MSConversation指當(dāng)前的會話荠列,即當(dāng)前的對話雙方場景类浪,我們可以通過MSConversation
“發(fā)送消息”(****這里的發(fā)送消息并不是真正的發(fā)送消息,只是把消息添加到輸入框中弯予,真正的消息發(fā)送是用戶點擊發(fā)送按鈕完成的****)戚宦,獲取會話的用戶信息等个曙。

MSMessage

MSMessage是消息實體锈嫩,創(chuàng)建消息實體的代碼如下

MSMessage * message = [[MSMessage alloc]initWithSession:_session];
message.URL = [NSURL URLWithString:@"http://www.baidu.com"];
message.accessibilityLabel = @"message";
message.summaryText = @"message";
MSMessageTemplateLayout * layout = [[MSMessageTemplateLayout alloc]init];
layout.caption = @"caption";
layout.subcaption = @"subcaption";
layout.trailingCaption = @"trailing";
layout.trailingSubcaption =@"subtrailing";
layout.image = [UIImage imageNamed:@"ic_common_wanglibank"];
NSURL *url = [[NSURL alloc] initFileURLWithPath:[[NSBundle mainBundle] pathForResource:@"ic_common_wanglibank" ofType:@"png"]];
layout.mediaFileURL = url;
layout.imageTitle = @"易黃金";
layout.imageSubtitle = @"易黃金";
message.layout = layout;
[self.activeConversation insertMessage:message completionHandler:nil];
圖片.png
iMessage App lifeCycle

啟動過程:
Message Extension啟動
- (void)didBecomeActiveWithConversation:(MSConversation *)conversation;
- (void)viewWillAppear:(BOOL)animated;
- (void)viewDidAppear:(BOOL)animated;

銷毀過程:
- (void)viewWillDisappear:(BOOL)animated;
- (void)viewDidDisappear:(BOOL)animated;
- (void)willResignActiveWithConversation:(MSConversation *)conversation;
Message Extension被系統(tǒng)銷毀
另外在MSMessageAppViewController在Compact和Expanded模式間進(jìn)行切換的時候受楼,該控制器中的方法會被回調(diào),我們需要在這里對界面進(jìn)行重新布局呼寸,VC在兩種模式中的可布局空間是不同的艳汽。

//視圖控制器的模式發(fā)生變化時進(jìn)行回調(diào),可以在這里根據(jù)模式修改布局
-(void)didTransitionToPresentationStyle:(MSMessagesAppPresentationStyle)presentationStyle {
    // Called after the extension transitions to a new presentation style.
    // Use this method to finalize any behaviors associated with the change in presentation style.
    if (presentationStyle == MSMessagesAppPresentationStyleCompact) {
        //緊湊的
        _topConstraint.constant = 0;
        _leftConstraint.constant = -15;
        _bottomConstraint.constant = -44;
        _rightConstraint.constant = -15;
    }else
    {
        //展開的
        _topConstraint.constant = -85;
        _leftConstraint.constant = -15;
        _bottomConstraint.constant = 0;
        _rightConstraint.constant = -15;
    }
    [self.view layoutIfNeeded];
}
關(guān)于控制器的跳轉(zhuǎn)

由于MSMessageAppViewController是繼承于 UIViewController的对雪,所以我理解也是可以正常進(jìn)行VC跳轉(zhuǎn)的河狐,嘗試了一下進(jìn)行跳轉(zhuǎn)

effect.gif

跳轉(zhuǎn)代碼同平時的一樣

//擴(kuò)展模式下 進(jìn)入子頁面
//MessageChildVC 是我創(chuàng)建的VC
[self presentViewController:[[MessageChildVC alloc] init] animated:YES completion:nil];

基本的頁面布局及邏輯跳轉(zhuǎn)弄清楚了,剩下的就等產(chǎn)品及設(shè)計天馬行空瑟捣,文章中很大一部分非原創(chuàng)馋艺,參考或者直接拷貝了所列鏈接作者的勞動,非常感謝各位的勞動迈套。
學(xué)習(xí)的過程中寫的HostIMessageExtensionApp Demo已經(jīng)上傳捐祠,想看或者懶得動手的小伙伴請移步gitHub。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末桑李,一起剝皮案震驚了整個濱河市踱蛀,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌贵白,老刑警劉巖率拒,帶你破解...
    沈念sama閱讀 222,590評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異禁荒,居然都是意外死亡猬膨,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,157評論 3 399
  • 文/潘曉璐 我一進(jìn)店門呛伴,熙熙樓的掌柜王于貴愁眉苦臉地迎上來寥掐,“玉大人,你說我怎么就攤上這事磷蜀≌僭牛” “怎么了?”我有些...
    開封第一講書人閱讀 169,301評論 0 362
  • 文/不壞的土叔 我叫張陵褐隆,是天一觀的道長污它。 經(jīng)常有香客問我,道長庶弃,這世上最難降的妖魔是什么衫贬? 我笑而不...
    開封第一講書人閱讀 60,078評論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮歇攻,結(jié)果婚禮上固惯,老公的妹妹穿的比我還像新娘。我一直安慰自己缴守,他們只是感情好葬毫,可當(dāng)我...
    茶點故事閱讀 69,082評論 6 398
  • 文/花漫 我一把揭開白布镇辉。 她就那樣靜靜地躺著,像睡著了一般贴捡。 火紅的嫁衣襯著肌膚如雪忽肛。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,682評論 1 312
  • 那天烂斋,我揣著相機(jī)與錄音屹逛,去河邊找鬼。 笑死汛骂,一個胖子當(dāng)著我的面吹牛罕模,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播帘瞭,決...
    沈念sama閱讀 41,155評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼手销,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了图张?” 一聲冷哼從身側(cè)響起锋拖,我...
    開封第一講書人閱讀 40,098評論 0 277
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎祸轮,沒想到半個月后兽埃,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,638評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡适袜,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,701評論 3 342
  • 正文 我和宋清朗相戀三年柄错,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片苦酱。...
    茶點故事閱讀 40,852評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡售貌,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出疫萤,到底是詐尸還是另有隱情颂跨,我是刑警寧澤,帶...
    沈念sama閱讀 36,520評論 5 351
  • 正文 年R本政府宣布扯饶,位于F島的核電站恒削,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏尾序。R本人自食惡果不足惜钓丰,卻給世界環(huán)境...
    茶點故事閱讀 42,181評論 3 335
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望每币。 院中可真熱鬧携丁,春花似錦、人聲如沸兰怠。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,674評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至尚揣,卻和暖如春涌矢,著一層夾襖步出監(jiān)牢的瞬間掖举,已是汗流浹背快骗。 一陣腳步聲響...
    開封第一講書人閱讀 33,788評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留塔次,地道東北人方篮。 一個月前我還...
    沈念sama閱讀 49,279評論 3 379
  • 正文 我出身青樓,卻偏偏與公主長得像励负,于是被迫代替她去往敵國和親藕溅。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,851評論 2 361

推薦閱讀更多精彩內(nèi)容