Bagikan melalui


Merender kartu di dalam aplikasi Anda

Mudah untuk merender Kartu Adaptif di dalam aplikasi Anda. Kami menyediakan SDK untuk semua platform umum, serta memberikan spesifikasi terperinci untuk membuat perender Kartu Adaptif Anda sendiri.

  1. Instal SDK perender - untuk platform target Anda.
  2. Buat instans perender - dikonfigurasi dengan gaya, aturan, dan penanganan aktivitas tindakan aplikasi Anda.
  3. Render kartu ke UI asli - ditata secara otomatis ke aplikasi Anda.

SDK Kartu Adaptif

Plattform Instalasi Membangun Dokumen Kedudukan
JavaScript penginstalan npm Sumber Docs Build Status
.NET WPF Penginstalan Nuget Sumber Docs Build statusBuild statusstatus Build
.NET HTML Penginstalan Nuget Sumber Docs Build statusBuild statusstatus Build
Windows UWP Penginstalan Nuget Sumber Docs Build Status
WinUI 3 Penginstalan Nuget Sumber Docs Build Status
Android Maven Central Sumber Docs Build statusBuild statusstatus Build
Ios CocoaPods Sumber Docs Build statusBuild statusstatus Build

Buat instans renderer

Langkah selanjutnya adalah membuat instance dari AdaptiveCardRenderer.

Menghubungkan peristiwa tindakan

Secara default, tindakan akan dirender sebagai tombol pada kartu, tetapi terserah aplikasi Anda untuk membuatnya bertingkah seperti yang Anda harapkan. Setiap SDK memiliki peristiwa yang setara dengan OnAction, yang harus Anda tangani.

  • Action.OpenUrl - buka URL yang ditentukanurl.
  • Action.Submit - ambil hasil kirim dan kirimkan ke sumbernya. Bagaimana Anda mengirimkannya ke sumber kartu sepenuhnya terserah Anda.
  • Action.ShowCard - memanggil dialog dan merender sub-kartu ke dalam dialog tersebut. Perhatikan bahwa Anda hanya perlu menangani ini jika ShowCardActionMode diatur ke popup.

Merender kartu

Setelah Anda memperoleh muatan kartu, cukup panggil perender dan berikan kartu. Anda akan mendapatkan kembali objek UI asli yang terdiri dari konten kartu. Sekarang cukup letakkan UI ini di suatu tempat di aplikasi Anda.

Kustomisasi

Ada beberapa cara untuk menyesuaikan hasil yang dirender.

HostConfig

HostConfig adalah objek konfigurasi lintas platform bersama yang mengontrol gaya dasar dan perilaku kartu di dalam aplikasi Anda. Ini mendefinisikan hal-hal seperti ukuran font, penspasian antara elemen, warna, jumlah tindakan yang didukung, dll.

Gaya bawaan platform

Sebagian besar kerangka kerja UI memungkinkan Anda untuk menata kartu yang dirender dengan menggunakan gaya kerangka kerja UI asli. Misalnya, dalam HTML Anda dapat menentukan kelas CSS untuk HTML, atau di XAML Anda dapat meneruskan ResourceDictionary kustom untuk kontrol output yang halus.

Menyesuaikan rendering setiap elemen

Setiap SDK memungkinkan Anda mengambil alih penyajian elemen apa pun, atau bahkan menambahkan dukungan untuk elemen yang sepenuhnya baru yang Anda tentukan. Misalnya, Anda dapat mengubah perender Input.Date untuk memancarkan kontrol kustom Anda sendiri sambil tetap mempertahankan sisa output perender. Atau Anda dapat menambahkan dukungan untuk elemen kustom Rating yang Anda tentukan.