Card Settings

  • 2 minutes to read

A Card View represents data as cards. Cards represent data records in a data source. A card arranges data source fields vertically, in a single column.

The image below highlights the major card settings:


Member Description
CardView.FixedSize Gets or sets a card's width (or height). By default, a card's size (its width or height depending on the layout) is automatically calculated to display its content in an optimal way. As a result, different cards can have different sizes. To avoid this, and specify the same size for all cards displayed within a view, use the FixedSize property.
CardView.MinFixedSize Specifies the minimum size to which cards can be resized by an end-user, or in code.
CardView.CardHeaderBinding Gets or sets the binding that specifies the content of card headers.
CardView.CardMargin Specifies the outer margin of a card.
CardView.CardHeaderTemplate Specifies the template that represents card headers.
CardView.CardTemplate Specifies the templates that represents cards.
CardView.CardStyle Specifies a card's style.

How to Bind Card Headers to Data

This example shows how to display product names within card headers. To do this, the CardView.CardHeaderBinding property is used.

The image below shows the result:


<dxg:GridControl x:Name="grid">
    <!-- -->
        <dxg:CardView CardHeaderBinding="{DXBinding 'RowData.Row.TrademarkName + ` ` + RowData.Row.Name'}"/>