Touch Support in Syncfusion WPF Controls
16 Jul 20214 minutes to read
Size mode
The SfSkinManager helps you to render in different size modes for both Syncfusion and Framework controls using the SizeMode property, which will be available only in themes supported from theme studio.
The SizeMode enum contains the following values:
-
Default- The default size will be updated for control and its inner elements. -
Touch- The touch interactive size mode will be applied for control. In this mode, more space is added around the inner elements, to make them easier to tap.
NOTE
The default value is
SizeMode.Default.
<syncfusion:IntegerTextBox syncfusion:SfSkinManager.SizeMode="Touch">
</syncfusion:IntegerTextBox >Gesture
Gestures determine whether a finger or stylus has moved over a control or not. Syncfusion WPF controls support the following touch gestures: Tap, Swipe, Pinch, and Hold.
.
The following table shows the gesture mappings for each control.
| Category | Control | Swipe | Pinch | Tap | Hold |
|---|---|---|---|---|---|
| GRIDS | Cell Grid | - | - | - | - |
| Data Grid | Selection, Scrolling, and Drag-Drop | - | Click and Select | Right-Click | |
| Tree Grid | Selection, Scrolling, and Drag-Drop | - | Click and Select | Right-Click | |
| Property Grid | - | - | Click | - | |
| Spreadsheet | Scrolling and Resizing | Zoom in & Zoom out | Click and Selection | Right-Click | |
| DATA VISUALIZATION | Charts | Panning, Scrolling, Annotation resizing, dragging | Zooming | ToolTip, Series selection, Segment selection, Annotation text editing, Annotation selection | - |
| Sunburst Chart | - | - | Click and Select | - | |
| Smith Chart | - | - | Click | - | |
| Kanban | Panning/Scrolling, Dragging | - | Column collapse/expand | Hold to select the card for dragging | |
| Diagramming | Diagram: Pan/Scroll, MultipleSelect, Drop, Zoom, Connect. Stencil: Drag & Drop. Node and Annotation: Drag, Resize, Rotate, Connect. Connector: Segment editing, Connect. Port: Drag, Connect. |
Zoom | Select | Context Menu | |
| Maps | - | Pan | Click and Select | - | |
| Treemap | - | - | Click | - | |
| Scheduler | View swiping, Scrolling and Dragging | - | Tap support for the Cell selection, Appointment selection, and Double-tap support to the appointment editor. | By default, the cell context menu will be opened when you hold down any timeslot or month cell. The appointment context menu will be opened by holding, only if the appointments' drag and drop is disabled using the property. | |
| Linear Gauge | - | - | - | - | |
| Digital Gauge | - | - | - | - | |
| Radial Gauge | - | - | - | - | |
| Bullet Graph | - | - | Click | - | |
| Gantt | Selection, drag and drop | - | Click and Select | Select | |
| Range Navigator | Scroll | - | Range selection | - | |
| Sparkline | - | - | Click | - | |
| Surface Chart | - | - | Click | - | |
| Barcode | NA | NA | NA | NA | |
| Heat Map | Pan/Scroll | - | - | - | |
| DATA SCIENCE | Predictive Analytics | NA | NA | NA | NA |
| LAYOUT | Ribbon | Swipe | - | Click | Context Menu |
| Docking Manager | Swipe to rearrange Tab order in Tabbed and Document state windows. | - | Tap to select the active window of DockingManager. Double tap to float the active window |
Hold any docking window header Context menu opened | |
| Document Container | Swipe to rearrange TDI mode Items | - | Tap to select the active document window | Hold any document window header Context menu opened | |
| Tile View | Swipe to reorder the tile items | - | Tap to select the item | - | |
| Carousel | To view the next or previous items | - | Click and select the item | - | |
| Tab Splitter | Swipe to move the splitter | - | Tap to select the item | Hold on TabBarSplitterItem to open the context menu | |
| Chromeless Window | Move | - | Select | - | |
| Card View | - | - | Click and Select | - | |
| Accordion | - | - | Tap to select the accordion item and expand or collapse item | - | |
| Grid Splitter | Swipe to move the splitter horizontally or vertically | - | - | - | |
| EDITORS | Autocomplete | Scroll | - | Select | - |
| Textbox | Move | - | double tap to select the word | Hold to open the default context menu | |
| Currency Textbox | Move | - | double tap to select the word | Hold to open the default context menu | |
| Double Textbox | Move | - | double tap to select the word | Hold to open the default context menu | |
| Integer Textbox | Move | - | double tap to select the word | Hold to open the default context menu | |
| Date Picker | Swipe to change the dates | - | click to select the date | - | |
| Time Picker | Swipe to change the dates | - | click to select the date | - | |
| Date Time Editor | Swipe | - | Select | - | |
| Button Adv | - | - | Click | - | |
| Masked Textbox | - | - | Click and Select | Context Menu | |
| Percent Textbox | - | - | double tap to select the word | Hold to open the default context menu | |
| RichTextBox | Swipe left/right to scroll the pages horizontally. Swipe up/down to scroll the pages vertically |
Zoom in/out | Click and select | - | |
| Timespan Editor | - | - | - | - | |
| Numeric Updown | Selection | - | Tap up down button to change the values | Hold to open the default context menu | |
| Domain Updown | - | - | Tap up down button to change the values | - | |
| Combobox | Swipe | - | Click and Select | - | |
| Range Slider | Swipe horizontally or vertically to change the minimum and maximum range values | - | Tap to increase or decrease the values based on the step value. | -< | |
| Radial Slider | Swipe to change the slider positions | - | Tap to update the selected value | - | |
| Color Picker | - | - | Click | - | |
| Color Palette | Swipe | - | Select | - | |
| Color Picker Palette | Swipe | - | Click | - | |
| Calculator | - | - | Tap to enter the values in text area | - | |
| Rating | Swipe to change the rating values | - | Tap to increase or decrease the rating values | - | |
| Checked Listbox | Scrolling | - | Tap to select the item | - | |
| Dropdown Button | - | - | Dropdown open | - | |
| Split Button | Click | - | Select | - | |
| Multicolumn Drop-Down | Scrolling | - | Click and Select | Right Click | |
| Calendar | Swipe to change the month view | - | Tap to select the date | - | |
| Syntax Editor | - | - | tap to set the cursor index. double-tab to select the current word of the cursor-placed index |
Hold to open Context menu | |
| NAVIGATION | Tree View | Swipe | - | Click | Context Menu, Drag-drop |
| Menu | - | - | Click | - | |
| Toolbar | - | - | Click | ToolTip | |
| Hierarchical Navigator | - | - | Tab to navigate the next item | - | |
| Groupbar | - | - | Tap to select the groupbar item. Expand or collapse the item. |
Hold to open the Context menu | |
| Tabs | Change the tab index positions | - | Tap to select the item | Hold to open the Context menu | |
| Tab Navigation | Scroll | - | Tap to navigate the next or previous view | - | |
| Taskbar | - | - | Tap to expand or collapse the task bar item | - | |
| Radial Menu | Swipe to rotate the radial menu items | - | Tap to expand or collapse the radial menu item | Indicates the selected item | |
| Tree Navigator | - | - | Tap to navigate the item | - | |
| Navigation Drawer | To open the primary or secondary drawers | - | - | - | |
| NOTIFICATION | Busy Indicator | - | - | - | - |
| Notify Icon | - | - | Tap to close the notification icon pop-up | - | |
| Hub Tile | - | - | Tap to perform the scale animation based on tile pressed direction | - | |
| FILE FORMAT LIBRARY | Excel | NA | NA | NA | NA |
| NA | NA | NA | NA | ||
| Word | NA(Non UI Component) | NA(Non UI Component) | NA(Non UI Component) | NA(Non UI Component) | |
| PDF Viewer | Scroll | Zoom | Button click | - | |
| PowerPoint | NA | NA | NA | NA | |
| REPORTING | Report Viewer | Scrolling | - | Click and Select | - |
| Report Writer | NA (Non UI component) | NA (Non UI component) | NA (Non UI component) | NA (Non UI component) | |
| Report Designer | Scrolling, Resizing | - | Click and select | Right click | |
| BUSINESS INTELLIGENCE | Olap Grid | Drag and drop, expand and collapse, and resize | - | Click, hyperlink, and selection | Right click and tooltip |
| Olap Chart | Drag and drop, expand and collapse, and resize | Zooming and panning | - | Right-click, tooltip, and context menu | |
| Olap Client | Drag and drop, expand and collapse, and resize | Zooming and panning | Click, hyperlink, and selection | Right-click, tooltip, and context menu | |
| Olap Gauge | - | - | - | Tooltip | |
| Pivot Grid | Drag and drop, expand and collapse, and resize | - | Click, hyperlink, and selection | Right-click, context menu, and tooltip | |
| MISCELLANEOUS | SpellChecker | - | - | Tap to perform the spell check operations in spell check dialog window | Hold to open the suggestion context menu |
| Wizard | - | - | Click | - | |
| Calculate | NA (Non UI component) | NA (Non UI component) | NA (Non UI component) | NA (Non UI component) | |
| Diagram(classic) | Diagram: Pan/Scroll, MultipleSelect, Drop, Zoom, Connect. Stencil: Drag & Drop. Node and Annotation: Drag, Resize, Rotate, Connect Connector: Segment editing, Connect Port: Drag, Connect |
Zoom | Select | Context Menu | |
| GridTreeControl | Scrolling, Drag and drop, and resize | - | Click and Selection | Right click | |
| Spreadsheet(classic) | - | - | - | - | |
| GridDataControl | Scrolling, Drag and drop, and resize | - | Click and Selection | Right click | |
| Chart(classic) | Panning, Scrolling, Dragging | Zooming | ToolTip, Series selection, Segment selection | - | |
| TabControlExt | Swipe to move the tabitem | - | Tab to change the SelectedItem | Hold to open TabItemExt ContextMenu | |
| SfMaskEdit | Select | - | Tap to place the cursor | Hold to open the context menu | |
| ColorEdit | Select the color | - | Tap to select the color, Tap on ColorCode Editor box to place the cursor | Hold on ColorCode Editor to open the ContextMenu | |
| SfCircularGauge | - | - | - | - | |
| PinnableListBox | - | - | Click and selection | Right click |