MaterialCard

November 4, 2023 · View on GitHub

MaterialCard display content and actions about a single subject.
View Material Design documentation

Example

<material3:MaterialCard
    Type="Elevated"
    CornerRadius="16,16,0,16">
    <material3:MaterialLabel
        Text="Elevated type card" />
</material3:MaterialCard>

Documentation

Property Type:

Gets or sets card type.

Property Command:

Gets or sets a Command to be executed when card is tapped.

Property CommandParameter:

Gets or sets a parameter to be passed to command when card is tapped.

Property Animation:

Gets or sets animation to be executed when card is tapped.

Property AnimationParameter:

Gets or sets a parameter to be passed to animation when card is tapped.

Property CustomAnimation:

Gets or sets a custom animation to be executed when card is tapped.

Property HasShadow:

Gets or sets if card has shadow. Applies only to Custom type.

Property ShadowColor:

Gets or sets shadow color. Applies only to Custom or Elevated type.

Property HasBorder:

Indicates if card has border. Applies only to Custom or Outlined type.

Property BorderColor:

Gets or sets border color. Applies only to Custom or Outlined type.

Property BorderWidth:

Gets or sets border width. Applies only to Custom or Outlined type.

Gets or sets corner radius. Can be set as uniform radius value (ie. 8) or individual radius values (topLeft, topRight, bottomLeft, bottomRight) (ie. 8,8,0,0 for upper rounded corners and lower plain ones).