Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Collapse]WinForms Controls
  Prerequisites
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Collapse]Data Grid
   [Expand]Getting Started
   [Expand]Binding to Data
   [Expand]Grid View
   [Collapse]View Technology
    [Expand]Banded Grid Views
    [Expand]Card View
    [Collapse]Layout View
      Layout View
      Card Layouts
      Stretching Cards to the View
      Card Alignment
      Scrolling
    [Expand]Tile View
    [Expand]WinExplorer View
     View Hierarchy
   [Expand]Grouping
   [Expand]Sorting
   [Expand]Summaries
   [Expand]Data Editing
   [Expand]Filtering and Locating Rows
   [Expand]Focus and Selection Handling
   [Expand]Processing Rows
   [Expand]Formatting Cell Values
   [Expand]Master-Detail Relationships
   [Expand]Asynchronous Image Load
   [Expand]Export and Printing
   [Expand]Appearance and Conditional Formatting
   [Expand]Batch Modifications
   [Expand]Hit Information
   [Expand]Hints
   [Expand]Popup Menus
   [Expand]Saving and Restoring Layouts
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]Examples
   [Expand]End-User Capabilities
    Included Components
  [Expand]Vertical Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Chart Control
  [Expand]Diagrams
  [Expand]Gauges
  [Expand]Map Control
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]Printing-Exporting
  [Expand]PDF Viewer
   Reporting
  [Expand]Snap
  [Expand]TreeMap Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Card Layouts

The LayoutView supports multiple card layouts, which can be selected using the LayoutViewOptionsView.ViewMode property of the LayoutView.OptionsView object.

  • Single Card
  • Row
  • Column
  • Multi Row
  • Multi Column
  • Carousel

An end-user can switch between display modes by clicking the corresponding button within the Header Panel. You can prevent a specific mode from being activated by disabling the corresponding Enable...Button option (available using the LayoutView.OptionsHeaderPanel property).

Expanded Single Card

In this mode, cards are displayed one at a time.

Expanded Row Layout

Cards arranged in one row.

By default, the Layout View simultaneously displays as many cards in a row as possible. You can limit that number using the LayoutViewOptionsMultiRecordMode.MaxCardColumns option (available using the LayoutView.OptionsMultiRecordMode property).

Expanded Column Layout

Cards arranged in one column.

In this mode, you can limit the number of simultaneously displayed cards using the LayoutViewOptionsMultiRecordMode.MaxCardRows option.

Expanded Multi Row Layout

Cards arranged in multiple rows (they are displayed across then down; by default, the scroll bar's orientation in this mode is horizontal).

Orienting a scroll bar vertically by setting the LayoutViewOptionsMultiRecordMode.MultiRowScrollBarOrientation property to Vertical.

Limiting the number of simultaneously displayed cards using the LayoutViewOptionsMultiRecordMode.MaxCardColumns and LayoutViewOptionsMultiRecordMode.MaxCardRows properties.

Expanded Multi Column Layout

Cards arranged in multiple columns (they are displayed down, then across; in this mode, the scroll bar is oriented vertically by default).

Changing the scroll bar's orientation by setting the LayoutViewOptionsMultiRecordMode.MultiColumnScrollBarOrientation property to Horizontal.

Limiting the number of simultaneously displayed cards using the LayoutViewOptionsMultiRecordMode.MaxCardColumns and LayoutViewOptionsMultiRecordMode.MaxCardRows properties.

Expanded Carousel Layout

Cards arranged along an ellipse path; however, you can customize the ellipse's settings, so that it looks like a line or a circle (the focused card in carousel mode is distinctly visible, while the neighboring cards are displayed scaled down, with a transparency effect).

Accessing the ellipse's parameters, along with card view options using the LayoutView.OptionsCarouselMode property (for instance, these include the pitch and roll angles of the ellipse).

An example of the Carousel Mode where the ellipse is customized, so all cards are projected onto a line.

An illustration of the same Layout View with another value of the pitch angle.

How would you rate this topic?​​​​​​​