Chat Message

Chat Message UIパターンを使用すると、通知またはチャット画面に会話の投稿を表示できます。写真、テキスト、画像、配信時間、ステータスなどのコンテンツを表示するために使用できます。

Chat Message UIパターンの使用方法

この例では、ユーザーが問い合わせを入力できるフォームがアプリにすでに含まれています。ユーザーがメッセージを送信すると、Chat Messageウィジェットを使用して会話の投稿としてメッセージが表示されます。

1. Service StudioのツールボックスでChat Messageを検索します。

   Chat Messageウィジェットが表示されます。

   

2. ツールボックスから、Chat Messageウィジェットをアプリケーション画面のメインコンテンツ領域にドラッグします。

   

   デフォルトで、Chat Messageウィジェットには［Image］、［Name］、［Content］、［Actions］の各プレースホルダが含まれています。

3. 関連するコンテンツをプレースホルダに追加します。

   • この例では、ユーザーがフォームに入力した名前が表示されるようにするため、［Name］プレースホルダをExpressionに変換して関連するロジックを入力しています。これを行うには、［Name］プレースホルダを右クリックして［Convert to Expression］を選択し、［Expression Value］ポップアップでNameアトリビュートに移動して［Done］をクリックします。

     

     

   • ユーザーがフォームに入力したメッセージが表示されるようにするため、［Content］プレースホルダをExpressionに変換して関連するロジックを入力しています。これを行うには、前の手順を繰り返しますが、今度はMessageアトリビュートに移動します。

     

4. ［Properties］タブで（オプションの）プロパティを設定し、Chat Messageのルックアンドフィールをカスタマイズできます。

   

これらの手順を実行してモジュールをパブリッシュした後、アプリでパターンをテストできます。

この例の結果は以下のようになります。