March 19, 2024

SamTech 365

PowerPlatform, Power Apps, Power Automate, PVA, SharePoint, C#, .Net, SQL, Azure News, Tips ….etc

Adaptive Cards target mobile and desktop experience, they provide a nice, modern way of presenting data and interacting with the users.

You can use Adaptive cards for all kind of business logics, from just displaying some metrics, to having an entire business scenario implemented with ACs.

There are two types of views for the adaptive cards:

  • The adaptive cards (which can be shown in small or medium size),
  • Quick view, which are the equivalent of a pop up and can show additional information about your cards.

ACEs in SPFX:

  • Are just a new flavour SPFX extensions
  • Can have property pane for settings
  • Can render different views:
    • Card View:
      • Can have image, text, buttons
      • Can be medium or large size
    • Quick View
      • Rendered using Adaptive Cards JSON
      • Typically bound to a data source

Consuming SharePoint Online data in ACEs

In SPFx you can easily consume SPO data (lists and libraries)

  • Via SPFx context object
  • Using PnPjs fluent syntax
  • Via low-level REST requests

Regardless how you retrieve data

  • You can easily bind data in ACEs
  • Using the state property
  • Binding data to the Ul of CardView(s) and/or QuickView(s)

 

More about adaptive cards:

https://adaptivecards.io

1