Bagikan melalui

Kartu Adaptif untuk Pengembang Bot

  • Artikel

Kartu Adaptif sangat cocok untuk Bot. Mereka memungkinkan Anda menulis kartu sekali dan membuatnya render dengan indah di dalam beberapa aplikasi, seperti Microsoft Teams, situs web Anda sendiri, dan banyak lagi.

Catatan

Skype tidak didukung dalam pratinjau saat ini. Lihat halaman Status Mitra untuk yang terbaru.

Cobalah

Klik tautan berikut dan bicarakan dengan Bot Scuba kami. Katakanlah I'm looking for scuba dan itu akan membantu Anda memesan perjalanan scuba impian Anda.

Semua respons bot dibuat dengan Kartu Adaptif.

Cuplikan layar obrolan scuba

Dapatkan kode: kode sumber Contoso Scuba Bot lengkap dapat ditemukan di GitHub.

Integrasi Kerangka Kerja Bot

Dengan Bot Framework , Anda dapat menulis satu bot yang dapat mengobrol dengan pengguna di beberapa "saluran", seperti Skype, Microsoft Teams, Facebook Messenger, dll.

Walkthrough

Cukup mudah untuk menambahkan Kartu Adaptif ke bot Anda.

Langkah 0: Mulai dengan pesan dasar

Berikut adalah payload Bot Framework message standar yang dapat dikirimkan ke saluran apa pun dan menampilkan teks kepada pengguna.

{
   "type": "message",
   "text": "Plain text is ok, but sometimes I long for more..."
}

Langkah 1: Tambahkan Kartu Adaptif attachment

Untuk menambahkan beberapa kekayaan di luar sekadar teks, Bot Framework memiliki konsep attachments.

Mari kita lampirkan Kartu Adaptif yang menampilkan teks kustom.

Kartu adaptif dasar

{
  "type": "message",
  "text": "Plain text is ok, but sometimes I long for more...",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "content": {
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
          {
            "type": "TextBlock",
            "text": "Hello World!",
            "size": "large"
          },
          {
            "type": "TextBlock",
            "text": "*Sincerely yours,*"
          },
          {
            "type": "TextBlock",
            "text": "Adaptive Cards",
            "separation": "none"
          }
        ],
        "actions": [
          {
            "type": "Action.OpenUrl",
            "url": "http://adaptivecards.io",
            "title": "Learn More"
          }
        ]
      }
    }
  ]
}

Langkah 2: Buat kartu yang lebih kaya

Kartu Adaptif menawarkan lebih dari sekadar teks yang dapat disesuaikan.

Anda dapat:

  • Tambahkan Images ke kartu Anda
  • Mengatur konten Anda dengan Containers dan Columns
  • Menambahkan beberapa jenis Actions
  • Mengumpulkan Input dari pengguna Anda
  • Memiliki satu kartu show another card
  • Lihat penjelajah skema lengkapnya!

SDK Platform

Jika bot Anda dikembangkan menggunakan .NET atau NodeJS, kami memiliki pustaka untuk membuat pembuatan Kartu Adaptif lebih mudah.

Platform Instal Pelajari lebih lanjut
.NET Install-Package AdaptiveCards -IncludePrerelease Dokumen .NET Bot Framework
NodeJS npm install adaptivecards Dokumen NodeJS Kerangka Kerja Bot

Status saluran

Bot Framework memungkinkan Anda menerbitkan bot ke beberapa saluran. Kami bekerja sama dengan berbagai saluran untuk memberikan dukungan penuh untuk Kartu Adaptif. Lihat halaman Status Mitra untuk yang terbaru.

Menyelam di!

Kami baru saja menggaruk permukaan dalam tutorial ini, jadi silakan lihat tautan di bawah ini untuk menjelajahi lebih banyak cara bahwa Kartu Adaptif dapat meningkatkan bot Anda.