Condividi tramite


Eseguire il rendering delle schede all'interno dell'applicazione

È facile eseguire il rendering delle schede adattive all'interno dell'applicazione. Forniamo SDK per tutte le piattaforme comuni, oltre a fornire una specifica dettagliata per la creazione di un renderer di schede adattive personalizzato.

  1. Installare un SDK del renderer per la piattaforma di destinazione.
  2. Creare un'istanza del renderer : configurata con lo stile, le regole e i gestori eventi di azione dell'app.
  3. Eseguire il rendering di una scheda nell'interfaccia utente nativa , con stile automatico per l'app.

SDK per carte adattive

Piattaforma Installare Costruire Documentazione stato
JavaScript npm install Fonte Documenti Stato compilazione
WPF .NET Installazione di NuGet Fonte Documenti Stato della compilazione
.NET HTML Installazione di NuGet Fonte Documenti Stato della compilazione
Windows UWP Installazione di NuGet Fonte Documenti Stato compilazione
WinUI 3 Installazione di NuGet Fonte Documenti Stato compilazione
Androide Maven Central Fonte Documenti Stato della compilazione
Ios CocoaPods Fonte Documenti Stato della compilazione

Creare un'istanza del renderizzatore

Il passaggio successivo consiste nel creare un'istanza di un oggetto AdaptiveCardRenderer.

Collegare eventi di azioni

Per impostazione predefinita, le azioni eseguiranno il rendering come pulsanti sulla scheda, ma spetta all'app farli comportarsi come previsto. Ogni SDK ha l'equivalente di un OnAction evento che è necessario gestire.

  • Action.OpenUrl : aprire l'oggetto specificato url.
  • Action.Submit : accetta il risultato dell'invio e lo invia all'origine. Il modo in cui lo invii all'origine della carta è interamente per te.
  • Action.ShowCard : richiama una finestra di dialogo ed esegue il rendering della sottocartella in tale finestra di dialogo. Si noti che è necessario gestire questa operazione solo se ShowCardActionMode è impostata a popup.

Eseguire il rendering di una scheda

Dopo aver acquisito un payload della scheda, è sufficiente chiamare il renderer e passare la scheda. Si otterrà un oggetto dell'interfaccia utente nativo costituito dal contenuto della scheda. Ora è sufficiente inserire l'interfaccia utente in un punto qualsiasi dell'app.

Personalizzazione

Esistono diversi modi per personalizzare il rendering di ciò che viene visualizzato.

HostConfig

HostConfig è un oggetto di configurazione multipiattaforma condiviso che controlla lo stile e il comportamento di base delle schede all'interno dell'app. Definisce elementi come dimensioni del carattere, spaziatura tra elementi, colori, numero di azioni supportate e così via.

Stile nativo della piattaforma

La maggior parte dei framework dell'interfaccia utente consente di applicare uno stile alla scheda sottoposta a rendering utilizzando lo stile nativo del framework dell'interfaccia utente. Ad esempio, in HTML puoi specificare classi CSS per il codice HTML o in XAML puoi passare un ResourceDictionary personalizzato per il controllo granulare dell'output.

Personalizzare il rendering per elemento

Ogni SDK consente di eseguire l'override del rendering di qualsiasi elemento o persino di aggiungere il supporto per elementi completamente nuovi definiti dall'utente. Ad esempio, è possibile modificare il Input.Date renderer per generare un controllo personalizzato mantenendo comunque il resto dell'output del renderer. In alternativa, è possibile aggiungere il supporto per un elemento personalizzato Rating definito.