More than 5 years have passed since last update.

[iOS 10] メッセージ拡張「iMessage Application」でメッセージアプリを作ってみたよ♪

Posted at 2017-01-16

はじめに

こんにちわ！asuです（＾＾/

9月リリースのiOS 10から、拡張機能（Extension）メッセージアプリが出ましたが、まだ使っていなかったので簡単なアプリを作ってみました。

この拡張機能は、Messagesフレームワークを使い、「Sticker Pack Application」と「iMessage Application」の２種類があるうち、今回は「iMessage Application」を使いました。

プロジェクト作成

まず、上部メニューから、File -> New -> Projectと移動し、下図のiOSタブのiMessageからメッセージ拡張のプロジェクトを作成します。

ストーリーボードは、下図のようになっており、起動時のコントローラーは、MSMessagesAppViewControllerを継承したMessagesViewControllerになっています。

MessagesViewController

次に、MSMessagesAppViewControllerには、下図のようなコールバックメソッドが有り、このコールバックメソッドを実装することで、メッセージ拡張を作っていきます。

import UIKit
import Messages

class MessagesViewController: MSMessagesAppViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    // MARK: - Conversation Handling
    
    override func willBecomeActive(with conversation: MSConversation) {
        // Called when the extension is about to move from the inactive to active state.
        // This will happen when the extension is about to present UI.
        
        // Use this method to configure the extension and restore previously stored state.
    }
    
    override func didResignActive(with conversation: MSConversation) {
        // Called when the extension is about to move from the active to inactive state.
        // This will happen when the user dissmises the extension, changes to a different
        // conversation or quits Messages.
        
        // Use this method to release shared resources, save user data, invalidate timers,
        // and store enough state information to restore your extension to its current state
        // in case it is terminated later.
    }
   
    override func didReceive(_ message: MSMessage, conversation: MSConversation) {
        // Called when a message arrives that was generated by another instance of this
        // extension on a remote device.
        
        // Use this method to trigger UI updates in response to the message.
    }
    
    override func didStartSending(_ message: MSMessage, conversation: MSConversation) {
        // Called when the user taps the send button.
    }
    
    override func didCancelSending(_ message: MSMessage, conversation: MSConversation) {
        // Called when the user deletes the message without sending it.
    
        // Use this to clean up state related to the deleted message.
    }
    
    override func willTransition(to presentationStyle: MSMessagesAppPresentationStyle) {
        // Called before the extension transitions to a new presentation style.
    
        // Use this method to prepare for the change in presentation style.
    }
    
    override func didTransition(to presentationStyle: MSMessagesAppPresentationStyle) {
        // Called after the extension transitions to a new presentation style.
    
        // Use this method to finalize any behaviors associated with the change in presentation style.
    }

}

MSConversation

MSConversationクラスは、メッセージアプリでの会話を表現するクラスです。このクラスを利用すると、現在選択中のメッセージや会話についての各種オブジェクトにアクセスできます。参考：　API Reference MSConversation

使用する画像は、Assets.xcassetsに、追加しておきます(iconも設定)。

ストーリーボードで、デフォルトで置かれていたHello Worldのラベルを削除し、代わりにUIButtonを置き、imageを設定し、ButtonのActionを記述します。

MSConversationクラスのinsert(MSmessage)を使用して、画像やメッセージを含めたものを送信対象にします。MSMessageのレイアウトには、MSMessageTemplateLayoutを使用しています。

    @IBAction func send(_ sender: AnyObject) {
        let message = MSMessage()
        let template = MSMessageTemplateLayout()
        template.image = UIImage(named: "2")
        template.caption = "Hello! I'm rabbit!"
        template.subcaption = "How are you?"
        message.layout = template
        self.activeConversation?.insert(message, completionHandler: { (error) in
            print("insearted! error:\(error)")
            
        })
        dismiss()
    }

実行結果

上記を実行すると下記のようになりました。

さいごに

メッセージ機能が簡単に使えて、便利な機能を備えたアプリがどんどん出てきてますね、今後の展開が楽しみです（＾＾/

参考にさせていただいたリンク

iMessage + Apps API Reference Messages Framework iMessage Apps and Stickers, Part 1 iMessage Apps and Stickers, Part 2 SampleCode Ice Cream Builder: A simple Messages app extension