Udostępnij przez


Renderowanie kart wewnątrz aplikacji

Karty adaptacyjne w aplikacji można łatwo renderować. Udostępniamy zestawy SDK dla wszystkich typowych platform, a także udostępniamy szczegółową specyfikację tworzenia własnego modułu renderowania kart adaptacyjnych.

  1. Zainstaluj zestaw SDK modułu renderowania — dla platformy docelowej.
  2. Utwórz instancję renderera — skonfigurowaną z użyciem stylu aplikacji, reguł oraz procedur obsługi zdarzeń.
  3. Renderuj kartę w natywnym interfejsie użytkownika — automatycznie stylizowana dla Twojej aplikacji.

Zestawy SDK kart adaptacyjnych

Platforma Instalowanie Zbuduj Dokumenty Stan
JavaScript Instalacja narzędzia npm Źródło Dokumenty Stan kompilacji
.NET WPF Instalacja narzędzia NuGet Źródło Dokumenty stan kompilacji
Kod HTML platformy .NET Instalacja narzędzia NuGet Źródło Dokumenty stan kompilacji
Windows UWP Instalacja narzędzia NuGet Źródło Dokumenty Stan kompilacji
WinUI 3 Instalacja narzędzia NuGet Źródło Dokumenty Stan kompilacji
Android Maven Central Źródło Dokumenty stan kompilacji
iOS CocoaPods Źródło Dokumenty stan kompilacji

Tworzenie wystąpienia modułu renderowania

Następnym krokiem jest utworzenie wystąpienia klasy AdaptiveCardRenderer.

Podłącz zdarzenia akcji

Domyślnie akcje będą renderowane jako przyciski na karcie, ale to od Twojej aplikacji zależy, czy będą one działać zgodnie z oczekiwaniami. Każdy zestaw SDK ma odpowiednie zdarzenie OnAction, które należy obsłużyć.

  • Action.OpenUrl - otwórz określony url.
  • Action.Submit — przyjmij wynik przesyłania i wyślij wynik do źródła. Sposób wysyłania go do źródła karty jest całkowicie do Ciebie.
  • Action.ShowCard — wywołuje okno dialogowe i renderuje kartę podrzędną w tym oknie dialogowym. Należy pamiętać, że należy to obsłużyć tylko wtedy, gdy ShowCardActionMode jest ustawione na popup.

Renderowanie karty

Po uzyskaniu ładunku karty po prostu wywołaj moduł renderowania i przekaż kartę. Otrzymasz z powrotem natywny obiekt interfejsu użytkownika składający się z zawartości karty. Teraz wystarczy umieścić ten interfejs użytkownika gdzieś w aplikacji.

Dostosowanie

Istnieje kilka sposobów dostosowywania renderowanych elementów.

Konfiguracja hosta

HostConfig to współużytkowany obiekt konfiguracji dla wielu platform, który kontroluje podstawowe style i zachowanie kart w aplikacji. Definiuje on elementy, takie jak rozmiary czcionek, odstępy między elementami, kolorami, liczbą obsługiwanych akcji itp.

Natywna stylizacja platformy

Większość struktur interfejsu użytkownika umożliwia stylizowanie renderowanej karty przy użyciu natywnej struktury interfejsu użytkownika. Na przykład w kodzie HTML można określić klasy CSS dla kodu HTML lub w języku XAML, możesz przekazać niestandardowy element ResourceDictionary w celu precyzyjnej kontroli danych wyjściowych.

Dostosowywanie renderowania poszczególnych elementów

Każdy zestaw SDK umożliwia zastąpienie renderowania dowolnego elementu, a nawet dodanie obsługi całkowicie nowych elementów, które definiujesz. Można na przykład zmienić Input.Date moduł renderujący, aby generować własną niestandardową kontrolkę, zachowując resztę danych wyjściowych modułu renderującego. Możesz też dodać obsługę niestandardowego elementu Rating , który definiujesz.