ASPxCardViewPagerSettings.SettingsBreakpointsLayout Property

Provides access to the Card View’s Breakpoint layout mode settings.

Assembly : DevExpress.Web.v25.2.dll

Declaration

C#
VB.NET

csharp

public CardViewBreakpointsLayoutSettings SettingsBreakpointsLayout { get; }

Public ReadOnly Property SettingsBreakpointsLayout As CardViewBreakpointsLayoutSettings

Property Value

Type	Description
CardViewBreakpointsLayoutSettings

A CardViewBreakpointsLayoutSettings object containing the Card View’s Breakpoint layout mode settings.

Property Paths

You can access this nested property as listed below:

Library	Object Type	Path to SettingsBreakpointsLayout
ASP.NET MVC Extensions	CardViewSettings

.SettingsPager .SettingsBreakpointsLayout

| | ASP.NET Web Forms Controls | ASPxCardView |

.SettingsPager .SettingsBreakpointsLayout

Remarks

Use the SettingsBreakpointsLayout property to access the Card View settings related to the Breakpoints layout mode (the ASPxCardViewSettings.LayoutMode property is set to Layout.Breakpoints).

The following example illustrates how to implement three different layout scenarios for different browser sizes (Small, Medium, Large):

csharp

CardView.Settings.LayoutMode = Layout.Breakpoints;
CardView.SettingsAdaptivity.BreakpointsLayoutSettings.CardsPerRow = 5;

CardView.SettingsAdaptivity.BreakpointsLayoutSettings.Breakpoints.AddRange(new List<CardViewBreakpoint>() {
    new CardViewBreakpoint() { DeviceSize = BreakpointsLayoutDeviceSizes.Small, CardsPerRow = 3 },
    new CardViewBreakpoint() { DeviceSize = BreakpointsLayoutDeviceSizes.Custom, MaxWidth = 1300, CardsPerRow = 4 },   
});

Concept

Adaptivity

Online Demo

Card View - Adaptive Layout