Template messageでリッチな操作体験を提供

ボタンや画像の配置などが定義されたデザインテンプレートを利用して，そこに任意の情報を詰め込んで送信できるTemplate messageというメッセージタイプがあります。ユーザーは，botから送信されたメッセージ中のボタンをタップするだけでbotとの対話を行えるので，使い勝手の良いbotを提供するためには利用したいメッセージタイプです。公式SDKでは，LINE::Bot::API::Builder::TemplateMessageを用いることで簡単にTemplate messageを送信できます。

Buttonsタイプで画像とボタンを組み合わせたUIを作る

図2のButtonsタイプでは，画像，タイトル，テキストを1つずつと，複数のボタンを送信できます。図2では「Open Browser」と「Remind me」と記された箇所がボタンになっています。リスト6はButtonsタイプのメッセージを構築するコードになっており，（1）のalt_messageにはTemplate message非対応端末で表示されるテキストを設定します。（2）のadd_message_actionメソッドはユーザーがボタンを押したときにtextの内容を自動的にチャットメッセージとしてユーザーが発言するボタンを表示します。（3）のadd_uri_actionメソッドはurlで指定したURLをブラウザで開くボタンを表示します。なお，LINE::Bot::API::Builder::TemplateMessageで作成したオブジェクトは$bot->reply_messageなどで直接送信ができないので，必ず（4）のとおりにLINE::Bot::API::Builder::SendMessageを使って送信オブジェクトを構築する必要があります。

my $buttons = LINE::Bot::API::Builder::TemplateMessage
->new_buttons(
  alt_text => 'this is a buttons template',    ―（1）
  image_url => 'https://example.com/bot/image.jpg',
  title => 'buttons',
  text => 'description',
)->add_message_action(    ―（2）
  label => 'message',
  text => 'message',
)->add_uri_action(    ―（3）
  label => 'uri',
  uri => 'http://example.com/',
);

my $messages = LINE::Bot::API::Builder::SendMessage
  ->new()    ―（4）
  ->add_template($buttons->build);
$bot->reply_message($reply_token, $messages->build);

Carouselタイプを使って複数個のテンプレートを横に並べる

図3のCarouselタイプは，基本的にはButtonsタイプのUI（User Interface）を横に複数個並べたテンプレートになっています。リスト7の（1）のnew_carouselメソッドでCarouselのビルダオブジェクトを作成し，LINE::Bot::API::Builder::TemplateMessage::Columnで作成したCarouselタイプのオブジェクトを（2）のadd_columnメソッドで登録していきます。

my $carousel = LINE::Bot::API::Builder::TemplateMessage
->new_carousel(    ―（1）
  alt_text => 'this is a carousel template',
);
for my $i (1..5) {
  my $col = LINE::Bot::API::Builder::TemplateMessage::Column
  ->new(
    image_url => 'https://example.com/bot/item.jpg',
    title => "carousel $i",
    text => "description $i",
  )->add_message_action(
    label => 'message',
    text => 'message',
  );
  $carousel->add_column($col->build);    ―（2）
}