Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Collapse]ASP.NET WebForms Controls
  [Expand]Reporting
  [Expand]Chart Control
  [Expand]Grid View
  [Expand]Card View
  [Expand]Vertical Grid
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Image and Data Browsing
  [Expand]Docking and Popups
  [Expand]Site Navigation and Layout
  [Expand]File Management
  [Expand]Multi-Use Site Controls
  [Collapse]Scheduler
   [Expand]Product Information
    Getting Started
   [Expand]Fundamentals
   [Collapse]Concepts
    [Expand]Scheduler Elements
    [Expand]Appointments
    [Expand]Resources
    [Expand]Views
     Data Binding
    [Expand]Services
     Adaptivity
     Templates
     Client-Side Functionality
     Callback Commands
    [Expand]Reporting
     Time Zones
     Keyboard Shortcuts
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]Examples
   [Expand]End-User Capabilities
   [Expand]Member Tables
  [Expand]HTML Editor
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gauges
  [Expand]Data Editors
  [Expand]Spell Checker
  [Expand]Query Builder
 [Expand]ASP.NET MVC Extensions
 [Expand]Localization
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core 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]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Adaptivity

The ASPxScheduler control provides an adaptive UI allowing you to build page layouts that fit a browser window’s width. In adaptive mode, the scheduler can automatically resize or rearrange its elements based on the user's device type and page resolution.

Set the ASPxSchedulerOptionsAdaptivity.Enabled property to true to enable the adaptive layout.

View Selector

In adaptive mode, the view selector items are hidden to the drop-down list that is invoked by clicking the ellipse button on the right. To disable the view selector's adaptivity mode, use the ASPxViewSelectorOptionsAdaptivity.Enabled property.

View Visible Interval

In response to the browser window width change, the view visible interval reduces its width by showing the time interval in a more compact mode. To disable the view visible interval's Adaptivity mode, use the ASPxViewVisibleIntervalOptionsAdaptivity.Enabled property.

The following image illustrates the view visible interval and view selector layouts in adaptive mode.

Appointment Dialog

The appointment dialog is displayed as a modal window that arranges its content into one column when the browser window's inner width is less than or equal to 700 pixels.

View the Demo

Refer to the following online demos to see this mode in action.

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