diff --git a/wpf/TreeGrid/Clipboard-Operations.md b/wpf/TreeGrid/Clipboard-Operations.md index adf54cff2..6c6257f03 100644 --- a/wpf/TreeGrid/Clipboard-Operations.md +++ b/wpf/TreeGrid/Clipboard-Operations.md @@ -1,15 +1,15 @@ --- layout: post -title: Clipboard Operations in WPF SfTreeGrid | Syncfusion® -description: Clipboard Operations in SfTreeGrid enables copy, cut, and paste actions with configurable settings, events, and custom clipboard behavior. +title: Clipboard Operations in WPF TreeGrid | Syncfusion® +description: Clipboard Operations in TreeGrid enables copy, cut, and paste actions with configurable settings, events, and custom clipboard behavior. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Clipboard Operations in WPF SfTreeGrid +# Clipboard Operations in WPF TreeGrid -SfTreeGrid provides support to the clipboard operations such as cut, copy, and paste the data within control and between other applications such as Notepad and Excel. The clipboard operations of copy and paste are enabled by default. You can copy selected nodes/cells from tree grid by clicking `Ctrl+C` and paste the content from the [Clipboard](https://learn.microsoft.com/en-us/dotnet/api/system.windows.clipboard?view=windowsdesktop-7.0&viewFallbackFrom=net-5.0&redirectedfrom=MSDN) to tree grid by clicking `Ctrl+V`. +WPF TreeGrid provides support to the clipboard operations such as cut, copy, and paste the data within control and between other applications such as Notepad and Excel. The clipboard operations of copy and paste are enabled by default. You can copy selected nodes/cells by clicking `Ctrl+C` and paste the content from the [Clipboard](https://learn.microsoft.com/en-us/dotnet/api/system.windows.clipboard?view=windowsdesktop-7.0&viewFallbackFrom=net-5.0&redirectedfrom=MSDN) by clicking `Ctrl+V`. ## Copy @@ -17,9 +17,9 @@ The copy operation works based on the [GridCopyOption](https://help.syncfusion.c The GridCopyOption property provides the following options: -* [None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables copy in tree grid. +* [None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables copy in TreeGrid. -* [CopyData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html):Enables copy in tree grid. +* [CopyData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html):Enables copy in TreeGrid. * [IncludeHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Copies the column header along with data. @@ -48,7 +48,7 @@ this.treeGrid.GridCopyOption = GridCopyOption.CopyData | GridCopyOption.IncludeH {% endhighlight %} {% endtabs %} -![Copy to Clipboard in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-copy.jpeg) +![Copy to Clipboard](Clipboard-Operations_images/wpf-treegrid-clipboard-copy.jpeg) N> `IncludeHiddenColumn` is not supported when **SelectionUnit** is [Cell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html). @@ -58,9 +58,9 @@ The paste operation works based on the [GridPasteOption](https://help.syncfusion The GridPasteOption property provides the following options: -* [None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Disables paste in tree grid. +* [None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Disables paste in TreeGrid. -* [PasteData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Enables paste in tree grid. When an incompatible value is pasted into a record/cell, the pasting operation is skipped for that particular record/cell. +* [PasteData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Enables paste in TreeGrid. When an incompatible value is pasted into a record/cell, the pasting operation is skipped for that particular record/cell. * [ExcludeFirstLine](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Pastes the data copied with [IncludeHeader](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html) copy option. @@ -89,7 +89,7 @@ this.treeGrid.GridPasteOption = GridPasteOption.PasteData | GridPasteOption.Excl {% endhighlight %} {% endtabs %} -![Paste Clipboard Content in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-paste.jpeg) +![Paste Clipboard Content](Clipboard-Operations_images/wpf-treegrid-clipboard-paste.jpeg) ## Cut @@ -97,9 +97,9 @@ The cut operation works based on the [GridCopyOption](https://help.syncfusion.co The GridCopyOption property provides the following options: -* [None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables cut in tree grid. +* [None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables cut in TreeGrid. -* [CutData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Enables cut in tree grid. +* [CutData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Enables cut in TreeGrid. * [IncludeHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Copies column header also along with data. @@ -124,13 +124,13 @@ this.treeGrid.GridCopyOption = GridCopyOption.CutData | GridCopyOption.IncludeHe {% endhighlight %} {% endtabs %} -![Cut to Clipboard in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-cut.jpeg) +![Cut to Clipboard](Clipboard-Operations_images/wpf-treegrid-clipboard-cut.jpeg) ## Events ### CopyContent -The [CopyContent](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when copy/cut the cells in tree grid. The [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information to the `CopyContent` event. You can cancel the copy operation by handling this event. +The [CopyContent](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when copy/cut the cells in TreeGrid. The [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information to the `CopyContent` event. You can cancel the copy operation by handling this event. {% tabs %} {% highlight c# %} @@ -146,7 +146,7 @@ private void TreeGrid_CopyContent(object sender, GridCopyPasteEventArgs e) ### PasteContent -The [PasteContent](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when paste the clipboard value into tree grid. The [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information to the PasteContent event. You can cancel paste operation by handling this event. +The [PasteContent](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when paste the clipboard value into TreeGrid. The [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information to the PasteContent event. You can cancel paste operation by handling this event. {% tabs %} {% highlight c# %} @@ -170,7 +170,7 @@ The [CopyGridCellContent](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml. * [RowData](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyPasteCellEventArgs.html#Syncfusion_UI_Xaml_Grid_GridCopyPasteCellEventArgs_RowData): Returns the corresponding RowData of a cell. -* [OriginalSender](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridEventArgs.html#Syncfusion_UI_Xaml_Grid_GridEventArgs_OriginalSender): Returns SfTreeGrid. +* [OriginalSender](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridEventArgs.html#Syncfusion_UI_Xaml_Grid_GridEventArgs_OriginalSender): Returns TreeGrid. You can change the text copied to the clipboard by changing the ClipBoardValue. @@ -185,7 +185,7 @@ private void TreeGrid_CopyCellContent(object sender, TreeGridCopyPasteCellEventA {% endhighlight %} {% endtabs %} -The following code example changes the clipboard value to 100 instead of cell value 1094 in tree grid. +The following code example changes the clipboard value to 100 instead of cell value 1094 in TreeGrid. {% tabs %} {% highlight c# %} @@ -197,7 +197,7 @@ private void TreeGrid_CopyCellContent(object sender, TreeGridCopyPasteCellEventA {% endhighlight %} {% endtabs %} -![Copy to Clipboard based on Cell Value in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-copy-based-on-cell-value.jpeg) +![Copy to Clipboard based on Cell Value](Clipboard-Operations_images/wpf-treegrid-clipboard-copy-based-on-cell-value.jpeg) The following code example demonstrates how to handle the copy operation when MappingName of a column is Id. @@ -211,7 +211,7 @@ private void TreeGrid_CopyCellContent(object sender, TreeGridCopyPasteCellEventA {% endhighlight %} {% endtabs %} -![Copy to Clipboard based on Mapping Name in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-copy-based-on-mapping-name.jpeg) +![Copy to Clipboard based on Mapping Name](Clipboard-Operations_images/wpf-treegrid-clipboard-copy-based-on-mapping-name.jpeg) N> When [GridCopyOption](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_GridCopyOption) with [IncludeHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCopyOption.html) (CopyData, IncludeHeaders / CutData, IncludeHeaders), the `CopyGridCellContent` event also fires for header rows, causing e.RowData to be `null`. With CopyData or CutData (without headers), the event fires only for data rows, and RowData is populated correctly. @@ -228,7 +228,7 @@ The [PasteGridCellContent](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml * [OriginalSender](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridEventArgs.html#Syncfusion_UI_Xaml_Grid_GridEventArgs_OriginalSender): Returns SfTeeGrid. -You can paste the text to tree grid by changing the ClipBoardValue. +You can paste the text to TreeGrid by changing the ClipBoardValue. {% tabs %} {% highlight c# %} @@ -253,7 +253,7 @@ private void TreeGrid_PasteCellContent(object sender, TreeGridCopyPasteCellEvent {% endhighlight %} {% endtabs %} -![Paste Clipboard Content based on Cell Value in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-paste-based-on-cell-value.jpeg) +![Paste Clipboard Content based on Cell Value](Clipboard-Operations_images/wpf-treegrid-clipboard-paste-based-on-cell-value.jpeg) The following code example demonstrates how to handle the paste operation when MappingName of column is Id. @@ -267,13 +267,13 @@ private void TreeGrid_PasteCellContent(object sender, TreeGridCopyPasteCellEvent {% endhighlight %} {% endtabs %} -![Paste Clipboard Content based on Mapping Name in WPF TreeGrid](Clipboard-Operations_images/wpf-treegrid-clipboard-paste-based-on-mapping-name.jpeg) +![Paste Clipboard Content based on Mapping Name](Clipboard-Operations_images/wpf-treegrid-clipboard-paste-based-on-mapping-name.jpeg) ## Handle the clipboard operations programmatically ### Copy the node -You can copy the selected nodes or cells in tree grid using the [Copy](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +You can copy the selected nodes or cells in TreeGrid using the [Copy](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html). {% tabs %} {% highlight c# %} @@ -295,7 +295,7 @@ this.treeGrid.TreeGridCopyPaste.Copy(); {% endhighlight %} {% endtabs %} -Copy the multiple records by selecting a group of records using the SelectRows method and [Copy](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Copy the multiple records by selecting a group of records using the SelectRows method and [Copy](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -304,7 +304,7 @@ this.treeGrid.TreeGridCopyPaste.Copy(); {% endhighlight %} {% endtabs %} -Copy the multiple cells by selecting group of cells using **SelectCells** method and `Copy` method in `GridCopyPaste` of tree grid. +Copy the multiple cells by selecting group of cells using **SelectCells** method and `Copy` method in `GridCopyPaste` of TreeGrid. {% tabs %} {% highlight c# %} @@ -313,9 +313,9 @@ this.treeGrid.TreeGridCopyPaste.Copy(); {% endhighlight %} {% endtabs %} -### Paste to tree grid +### Paste to TreeGrid -Paste the clipboard value into tree grid using the [Paste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Paste) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Paste the clipboard value into TreeGrid using the [Paste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Paste) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html). {% tabs %} {% highlight c# %} @@ -323,7 +323,7 @@ this.treeGrid.TreeGridCopyPaste.Paste(); {% endhighlight %} {% endtabs %} -Paste the clipboard value into the selected record by selecting a record using the MoveCurrentCell method and `Paste` method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Paste the clipboard value into the selected record by selecting a record using the MoveCurrentCell method and `Paste` method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -335,9 +335,9 @@ this.treeGrid.TreeGridCopyPaste.Paste(); {% endhighlight %} {% endtabs %} -### Cut from tree grid +### Cut from TreeGrid -Cut the selected records/cells in the tree grid using the [Cut](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Cut) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Cut the selected records/cells in the TreeGrid using the [Cut](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Cut) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html). {% tabs %} {% highlight c# %} @@ -345,7 +345,7 @@ this.treeGrid.TreeGridCopyPaste.Cut(); {% endhighlight %} {% endtabs %} -Cut the entire record in tree grid by selecting the whole tree grid using the [SelectAll](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridBaseSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridBaseSelectionController_SelectAll) method and `Cut` method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Cut the entire records in TreeGrid by selecting all using the [SelectAll](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridBaseSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridBaseSelectionController_SelectAll) method and `Cut` method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html). {% tabs %} {% highlight c# %} @@ -354,7 +354,7 @@ this.treeGrid.TreeGridCopyPaste.Cut(); {% endhighlight %} {% endtabs %} -Cut the entire column in tree grid by using **SelectCells** method and `Cut` method in `GridCopyPaste` of SfTreeGrid. +Cut the entire column in TreeGrid by using **SelectCells** method and `Cut` method in `GridCopyPaste`. {% tabs %} {% highlight c# %} @@ -367,7 +367,7 @@ this.treeGrid.TreeGridCopyPaste.Cut(); ## Customize the copy and paste behaviors -The tree grid processes the clipboard operations in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. You can customize the default copy paste behaviors by overriding the TreeGridCutCopyPaste class and set it to `SfTreeGrid.TreeGridCopyPaste`. +The TreeGrid processes the clipboard operations in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. You can customize the default copy paste behaviors by overriding the TreeGridCutCopyPaste class and set it to `SfTreeGrid.TreeGridCopyPaste`. {% tabs %} {% highlight c# %} @@ -390,7 +390,7 @@ public MainWindow() ### Paste a cell into many cells in WPF TreeGrid -By default, you can copy one cell and paste it into another cell when Cell Selection is enabled in SfTreeGrid. The below code shows how to copy one cell and paste it into all the selected cells by overriding [PasteCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteCell_System_Object_Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_System_Object_) method in [GridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCutCopyPaste.html) class. +By default, you can copy one cell and paste it into another cell when Cell Selection is enabled in TreeGrid. The below code shows how to copy one cell and paste it into all the selected cells by overriding [PasteCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteCell_System_Object_Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_System_Object_) method in [GridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridCutCopyPaste.html) class. {% tabs %} {% highlight c# %} @@ -482,7 +482,7 @@ public class CustomCopyPaste : TreeGridCutCopyPaste ### Select the pasted records -By default, after pasting the clipboard value to tree grid, the selection is maintained in previously selected records. The following code demonstrates how to select the pasted records after the paste operation by overriding the [PasteToRow](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteRow_System_Object_System_Object_) method in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. +By default, after pasting the clipboard value to TreeGrid, the selection is maintained in previously selected records. The following code demonstrates how to select the pasted records after the paste operation by overriding the [PasteToRow](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteRow_System_Object_System_Object_) method in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. {% tabs %} {% highlight c# %} @@ -505,7 +505,7 @@ public class CustomCopyPaste : TreeGridCutCopyPaste ### Create new records while pasting -By default, when pasting the clipboard value to tree grid, it changes the values of the already existing records. The following code example demonstrates how to add the copied records as new rows in the tree grid by overriding the [PasteRows](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteRows_System_Object_) method in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. +By default, when pasting the clipboard value to TreeGrid, it changes the values of the already existing records. The following code example demonstrates how to add the copied records as new rows in the TreeGrid by overriding the [PasteRows](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteRows_System_Object_) method in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. {% tabs %} {% highlight c# %} @@ -590,7 +590,7 @@ public class CustomCopyPaste : TreeGridCutCopyPaste ### Copy the column and paste it as a new column -You can copy a column and paste it into a new position using the context menu option in tree grid. +You can copy a column and paste it into a new position using the context menu option in TreeGrid. {% tabs %} {% highlight xaml %} @@ -639,13 +639,13 @@ private static void OnPasteColumn(object obj) **Copy the ID column using context menu** -![WPF TreeGrid displays Copy ContextMenu](Clipboard-Operations_images/wpf-treegrid-copy-context-menu.jpeg) +![displays Copy ContextMenu](Clipboard-Operations_images/wpf-treegrid-copy-context-menu.jpeg) **Paste the ID column after ReportsTo column** -![WPF TreeGrid displays Paste ContextMenu](Clipboard-Operations_images/wpf-treegrid-paste-context-menu.jpeg) +![displays Paste ContextMenu](Clipboard-Operations_images/wpf-treegrid-paste-context-menu.jpeg) You can download the [sample](https://github.com/SyncfusionExamples/how-to-copy-a-column-and-paste-it-as-a-new-column-in-wpf-treegrid). -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Column-Sizing.md b/wpf/TreeGrid/Column-Sizing.md index ec2fb6162..700846a31 100644 --- a/wpf/TreeGrid/Column-Sizing.md +++ b/wpf/TreeGrid/Column-Sizing.md @@ -1,15 +1,15 @@ --- layout: post -title: Column Sizing in WPF SfTreeGrid | Syncfusion® -description: Column Sizing in SfTreeGrid adjusts column widths automatically or manually using the ColumnSizer property. +title: Column Sizing in WPF TreeGrid | Syncfusion® +description: Column Sizing in TreeGrid adjusts column widths automatically or manually using the ColumnSizer property. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Column Sizing in WPF SfTreeGrid +# Column Sizing in WPF TreeGrid -SfTreeGrid allows you to set the column widths based on certain logic using [SfTreeGrid.ColumnSizer](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ColumnSizer) or [TreeGridColumn.ColumnSizer](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_ColumnSizer) property. +WPF TreeGrid allows you to set the column widths based on certain logic using [SfTreeGrid.ColumnSizer](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ColumnSizer) or [TreeGridColumn.ColumnSizer](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_ColumnSizer) property. Below is the list of predefined column sizing options available. @@ -100,14 +100,14 @@ Below code, applies `GridLengthUnitType.Star` to equally set width for `SfTreeGr {% endhighlight %} {% endtabs %} -![Column Sizing in WPF TreeGrid](ColumnSizer_images/wpf-treegrid-column-size.png) +![Column Sizing](ColumnSizer_images/wpf-treegrid-column-size.png) N> The `TreeGridColumn.ColumnSizer` takes higher priority than the `SfTreeGrid.ColumnSizer`. ## Refreshing ColumnSizer at runtime You can refresh the `ColumnSizer` at runtime by calling [SfTreeGrid.TreeGridColumnSizer.Refresh](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumnSizer.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumnSizer_Refresh) method. -SfTreeGrid support to recalculates the column auto width by calling reset methods of `TreeGridColumnSizer`. [TreeGridColumnSizer.ResetAutoCalculationforAllColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_ResetAutoCalculationforAllColumns) method reset widths to all columns. [TreeGridColumnSizer.ResetAutoCalculation](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_ResetAutoCalculation_Syncfusion_UI_Xaml_Grid_GridColumnBase_) method reset the width to particular column. +TreeGrid support to recalculates the column auto width by calling reset methods of `TreeGridColumnSizer`. [TreeGridColumnSizer.ResetAutoCalculationforAllColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_ResetAutoCalculationforAllColumns) method reset widths to all columns. [TreeGridColumnSizer.ResetAutoCalculation](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_ResetAutoCalculation_Syncfusion_UI_Xaml_Grid_GridColumnBase_) method reset the width to particular column. N> The `TreeGridColumnSizer.ResetAutoCalculationforAllColumns` or `TreeGridColumnSizer.ResetAutoCalculation` methods applicable for Auto, FillColumn, AutoFillColumn, SizeToCells types. @@ -141,7 +141,7 @@ this.treeGrid.TreeGridColumnSizer.Refresh(); ### Customizing built-in column sizing logic -SfTreeGrid process column sizing operations in [TreeGridColumnSizer](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumnSizer.html) class. You can customize the column sizing operations by overriding `GridColumnSizer` and set it to `SfTreeGrid.TreeGridColumnSizer`. +TreeGrid process column sizing operations in [TreeGridColumnSizer](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumnSizer.html) class. You can customize the column sizing operations by overriding `GridColumnSizer` and set it to `SfTreeGrid.TreeGridColumnSizer`. {% tabs %} {% highlight c# %} @@ -186,7 +186,7 @@ this.treeGrid.TreeGridColumnSizer.SortIconWidth = 20; {% endhighlight %} {% endtabs %} -#### Changing Font settings for SfTreeGrid +#### Changing Font settings for TreeGrid You can change the `font settings` for column width calculation by setting [TreeGridColumnSizer.FontSize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_FontSize), [TreeGridColumnSizer.FontFamily](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_FontFamily) and [TreeGridColumnSizer.Margin](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.ColumnSizerBase-1.html#Syncfusion_UI_Xaml_Grid_ColumnSizerBase_1_Margin) properties. This settings will be considered for all columns. @@ -327,7 +327,7 @@ Below code uses the `ColumnRatio` to apply the defined star width for each colum {% endhighlight %} {% endtabs %} -![Customizing Column Size in WPF TreeGrid](ColumnSizer_images/wpf-treegrid-column-size-customization.png) +![Customizing Column Size](ColumnSizer_images/wpf-treegrid-column-size-customization.png) ### Change the width of TreeGridComboBoxColumn based on it's ItemsSource @@ -375,4 +375,4 @@ public class CustomColumnSizer : TreeGridColumnSizer {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Column-Type.md b/wpf/TreeGrid/Column-Type.md index ab54ac0b1..c8e97f7b4 100644 --- a/wpf/TreeGrid/Column-Type.md +++ b/wpf/TreeGrid/Column-Type.md @@ -1,16 +1,16 @@ --- layout: post -title: Column Types in WPF SfTreeGrid | Syncfusion® -description: Column Types in SfTreeGrid provides built-in and custom column types to display, edit, format, and customize data effectively. +title: Column Types in WPF TreeGrid | Syncfusion® +description: Column Types in TreeGrid provides built-in and custom column types to display, edit, format, and customize data effectively. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Column Types in WPF SfTreeGrid +# Column Types in WPF TreeGrid -SfTreeGrid provides support for various built-in column types. Each column has its own properties and renderer to handle different types of data. +WPF TreeGrid provides support for various built-in column types. Each column has its own properties and renderer to handle different types of data. You can also add or override existing columns and renderers as you need. @@ -139,7 +139,7 @@ Use to display the custom template-specified content. ## TreeGridColumn -TreeGridColumn is an abstract class provides base functionalities for all the column types in SfTreeGrid. +TreeGridColumn is an abstract class provides base functionalities for all the column types in TreeGrid. ### Mapping column to particular property @@ -168,7 +168,7 @@ You can use `DisplayBinding` property to format the column in display, by settin In the below screenshot, `Salary` column display value is formatted to currency by setting `DisplayBinding` property. -![WPF TreeGrid Column with Currency Values](ColumnTypes_images/wpf-treegrid-with-currency-value.png) +![Column with Currency Values](ColumnTypes_images/wpf-treegrid-with-currency-value.png) ### CellTemplate in TreeGridColumn @@ -215,7 +215,7 @@ In the below code snippet, `TreeGridCurrencyColumn` is loaded with `ProgressBar` {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with ProgressBar](ColumnTypes_images/wpf-treegrid-with-progressbar.png) +![Column with ProgressBar](ColumnTypes_images/wpf-treegrid-with-progressbar.png) `CellTemplate` is not support by [TreeGridHyperlinkColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridHyperlinkColumn.html) and [TreeGridCheckBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCheckBoxColumn.html) columns. @@ -260,7 +260,7 @@ You can use the same [DataTemplate](https://docs.microsoft.com/en-us/uwp/api/Win {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with CellTemplate](ColumnTypes_images/wpf-treegrid-cell-template.png) +![Column with CellTemplate](ColumnTypes_images/wpf-treegrid-cell-template.png) #### Setting CellTemplate based on custom logic using TemplateSelector @@ -338,7 +338,7 @@ In the below code, the custom template selector set to `TreeGridColumn.CellTempl N> Non-Editable columns does not support `CellTemplate`. -![WPF TreeGrid Column with Cell Template Selector](ColumnTypes_images/wpf-treegrid-cell-template-selector.png) +![Column with Cell Template Selector](ColumnTypes_images/wpf-treegrid-cell-template-selector.png) #### Binding ViewModel properties with CellTemplate @@ -585,7 +585,7 @@ private void TreeGrid_AutoGeneratingColumn(object sender, TreeGridAutoGenerating {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Formatting](ColumnTypes_images/wpf-treegrid-format.png) +![Column with Formatting](ColumnTypes_images/wpf-treegrid-format.png) ### Styling TreeGridColumn @@ -642,7 +642,7 @@ private void TreeGrid_AutoGeneratingColumn(object sender, TreeGridAutoGenerating {% endhighlight %} {% endtabs %} -![Customizing Column Style in WPF TreeGrid](ColumnTypes_images/wpf-treegrid-style-customization.png) +![Customizing Column Style](ColumnTypes_images/wpf-treegrid-style-customization.png) #### Styles based on custom logic @@ -738,7 +738,7 @@ private void TreeGrid_AutoGeneratingColumn(object sender, TreeGridAutoGenerating {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Conditional Formatting](ColumnTypes_images/wpf-treegrid-with-conditional-format.png) +![Column with Conditional Formatting](ColumnTypes_images/wpf-treegrid-with-conditional-format.png) ### UI Interaction @@ -807,7 +807,7 @@ TreeGridColumn allows you to change the alignment of `TreeGridCell` and `TreeGri {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Text Trimming and Text Wrapping Settings](ColumnTypes_images/wpf-treegrid-text-trim-and-wrap.png) +![Column with Text Trimming and Text Wrapping Settings](ColumnTypes_images/wpf-treegrid-text-trim-and-wrap.png) ## TreeGridTextColumn @@ -862,7 +862,7 @@ this.treeGrid.Columns.Add(new TreeGridNumericColumn() { MappingName = "Salary" } {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Numeric column](ColumnTypes_images/wpf-treegrid-numeric-column.png) +![Numeric column](ColumnTypes_images/wpf-treegrid-numeric-column.png) ### Data formatting @@ -899,7 +899,7 @@ this.treeGrid.Columns.Add(new TreeGridNumericColumn() { MappingName = "Salary" } {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Formatting](ColumnTypes_images/wpf-datagrid-column-formatting.png) +![Column Formatting](ColumnTypes_images/wpf-datagrid-column-formatting.png) ## TreeGridCurrencyColumn @@ -963,7 +963,7 @@ this.treeGrid.Columns.Add(new TreeGridCurrencyColumn() { MappingName = "Salary", {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Currency Column](ColumnTypes_images/wpf-treegrid-currency-column.png) +![displays Currency Column](ColumnTypes_images/wpf-treegrid-currency-column.png) ## TreeGridPercentColumn @@ -1031,7 +1031,7 @@ this.treeGrid.Columns.Add(new TreeGridPercentColumn() { MappingName = "Hike", He {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Percent Column](ColumnTypes_images/wpf-treegrid-percent-column.png) +![displays Percent Column](ColumnTypes_images/wpf-treegrid-percent-column.png) ## TreeGridDateTimeColumn @@ -1253,7 +1253,7 @@ treeGrid.Columns.Add(new TreeGridCheckBoxColumn() { MappingName = "AvailabilityS {% endtabs %} -![WPF TreeGrid Column with CheckBox](ColumnTypes_images/wpf-treegrid-checkbox.png) +![Column with CheckBox](ColumnTypes_images/wpf-treegrid-checkbox.png) `TreeGridCheckBoxColumn` allows you to customize check box state and its alignment. @@ -1341,7 +1341,7 @@ You can allow `UIElement` loaded inside `CellTemplate` or `EditTemplate` to hand You can allow `UIElement` loaded inside `CellTemplate` to handle keyboard interaction by setting [FocusManagerHelper.WantsKeyInput](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.FocusManagerHelper.html#Syncfusion_UI_Xaml_Grid_FocusManagerHelper_WantsKeyInputProperty) attached property to `TreeGridColumn`. You can use this when loading edit element in CellTemplate. -In this case SfTreeGrid handles the below key operations and other keys are handled by UIElement loaded inside `CellTemplate`. +In this case TreeGrid handles the below key operations and other keys are handled by UIElement loaded inside `CellTemplate`. * Tab * Enter @@ -1556,7 +1556,7 @@ In the below code, custom template selector set to `TreeGridTemplateColumn.EditT {% endhighlight %} {% endtabs %} -![Cell and Edit Template in WPF TreeGrid Column](ColumnTypes_images/wpf-treegrid-cell-edit-template.png) +![Cell and Edit Template](ColumnTypes_images/wpf-treegrid-cell-edit-template.png) ## TreeGridComboBoxColumn @@ -1586,13 +1586,13 @@ treeGrid.Columns.Add(new TreeGridComboBoxColumn() { MappingName = "City", ItemsS {% endhighlight %} {% endtabs %} -SfTreeGrid triggers, [CurrentCellDropDownSelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html) event, when the SelectedValue is changed. [CurrentCellDropDownSelectionChangedEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.CurrentCellDropDownSelectionChangedEventArgs.html) of [CurrentCellDropDownSelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html) event provides the information about the changed cell value. +TreeGrid triggers, [CurrentCellDropDownSelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html) event, when the SelectedValue is changed. [CurrentCellDropDownSelectionChangedEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.CurrentCellDropDownSelectionChangedEventArgs.html) of [CurrentCellDropDownSelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html) event provides the information about the changed cell value. `SelectedIndex` property returns the index of selected item. `SelectedItem**`** property returns the selected item from drop down list. -![WPF TreeGrid Column with ComboBox](ColumnTypes_images/wpf-treegrid-combobox.png) +![Column with ComboBox](ColumnTypes_images/wpf-treegrid-combobox.png) ### Keep the dropdown to be opened @@ -1716,9 +1716,9 @@ public class ItemsSourceSelector : IItemsSourceSelector The following screenshot illustrates the different ShipCity ItemsSource bound to each row of the ComboBox based on the Country Name. -![WPF TreeGrid Column with ComboBox](ColumnTypes_images/wpf-treegrid-combobox-column.png) +![Column with ComboBox](ColumnTypes_images/wpf-treegrid-combobox-column.png) -![WPF TreeGrid Column with ComboBox](ColumnTypes_images/wpf-treegrid-combobox-specific-column.png) +![Column with ComboBox](ColumnTypes_images/wpf-treegrid-combobox-specific-column.png) You can download the sample from [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/ComboBoxColumnsDemo834486903.zip). @@ -1748,7 +1748,7 @@ this.treeGrid.Columns.Add(new TreeGridHyperlinkColumn() { MappingName = "CityDes {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Hyperlink](ColumnTypes_images/wpf-treegrid-hyperlink.png) +![Column with Hyperlink](ColumnTypes_images/wpf-treegrid-hyperlink.png) You can allow end-user to navigate the `Uri` when the cell value contains valid `Uri` address or using [CurrentCellRequestNavigate](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html) event. The `CurrentCellRequestNavigate` occurs when the current cell in `TreeGridHyperLinkColumn` is clicked for navigation. @@ -1821,7 +1821,7 @@ You can change the foreground color of `TreeGridHyperlinkColumn` by writing the {% endhighlight %} {% endtabs %} -![Customizing Hyperlink Column in WPF TreeGrid](ColumnTypes_images/wpf-treeegrid-hyperlink-customization.png) +![Customizing Hyperlink Column](ColumnTypes_images/wpf-treeegrid-hyperlink-customization.png) ## TreeGridMaskColumn @@ -1857,7 +1857,7 @@ this.treeGrid.Columns.Add(new TreeGridMaskColumn() { HeaderText = "Contact Numbe {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Mask Type](ColumnTypes_images/wpf-treegrid-mask.png) +![Column with Mask Type](ColumnTypes_images/wpf-treegrid-mask.png) Mask for numeric value not exceeds two digits to the left of the decimal point. @@ -1881,7 +1881,7 @@ In the below code snippet, `Mask` applied to format and validate the user input {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Formatting in Mask Column](ColumnTypes_images/wpf-treegrid-mask-formatting.png) +![Formatting in Mask Column](ColumnTypes_images/wpf-treegrid-mask-formatting.png) ### Specifying prompt character @@ -1919,11 +1919,11 @@ The `TreeGridMaskColumn.MaskFormat` property has the following format. ## Custom column support -SfTreeGrid allows you to create your own column by overriding predefined column type or creating a new custom column. +TreeGrid allows you to create your own column by overriding predefined column type or creating a new custom column. ### Creating column from existing column -You can create your own column by overriding the [predefined](https://help.syncfusion.com/wpf/treegrid/column-type) column types in SfTreeGrid. +You can create your own column by overriding the [predefined](https://help.syncfusion.com/wpf/treegrid/column-type) column types in TreeGrid. For example, the `TreeGridDateTimeColumn` loads the `DateTime` value by default. If you want to display [DateTimeOffset](https://docs.microsoft.com/en-us/dotnet/api/system.datetimeoffset?redirectedfrom=MSDN&view=net-5.0) value, you can create a new column by overriding the `TreeGridDateTimeColumn` class. @@ -2086,7 +2086,7 @@ this.treeGrid.Columns.Add(new TreeGridDateTimeOffsetColumn() { MappingName = "DO ### Customize column renderer -SfTreeGrid allows you to customize the column related operations like key navigation and UI related interactions by overriding the corresponding renderer associated with the column. Each column has its own renderer with set of virtual methods for handling the column level operations. +TreeGrid allows you to customize the column related operations like key navigation and UI related interactions by overriding the corresponding renderer associated with the column. Each column has its own renderer with set of virtual methods for handling the column level operations. Below table lists the available cell types for unbound row and its renderers.
@@ -2243,7 +2243,7 @@ public class TreeGridCellTextBoxRendererExt : TreeGridCellTextBoxRenderer {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Custom Renderer](ColumnTypes_images/wpf-treegrid-custom-renderer.png) +![Column with Custom Renderer](ColumnTypes_images/wpf-treegrid-custom-renderer.png) ### Create the renderer of existing column @@ -2451,7 +2451,7 @@ public class TreeGridComboBoxRendererExt : TreeGridVirtualizingCellRenderer You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Columns.md b/wpf/TreeGrid/Columns.md index 2ae81f353..d04435ffe 100644 --- a/wpf/TreeGrid/Columns.md +++ b/wpf/TreeGrid/Columns.md @@ -1,17 +1,17 @@ --- layout: post -title: Columns in WPF SfTreeGrid | Syncfusion® -description: Columns in SfTreeGrid supports auto-generated and custom columns, column types, resizing, reordering, freezing, and data binding. +title: Columns in WPF TreeGrid | Syncfusion® +description: Columns in TreeGrid supports auto-generated and custom columns, column types, resizing, reordering, freezing, and data binding. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Columns in WPF SfTreeGrid +# Columns in WPF TreeGrid -SfTreeGrid allows you to add or remove columns using [SfTreeGrid.Columns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) property. You can choose the columns to be added from built-in column types or you can create your own column and add to the `SfTreeGrid.Columns`. +WPF TreeGrid allows you to add or remove columns using [SfTreeGrid.Columns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) property. You can choose the columns to be added from built-in column types or you can create your own column and add to the `SfTreeGrid.Columns`. -Below are the built-in column types supported in SfTreeGrid. Each column has its own properties to handle different types of data. +Below are the built-in column types supported in TreeGrid. Each column has its own properties to handle different types of data.
@@ -106,7 +106,7 @@ Use to display the custom template-specified content. ## Defining Columns -You can let the SfTreeGrid to create columns or you can manually defined columns to de displayed. Below sections explains both ways, +You can let the TreeGrid to create columns or you can manually defined columns to de displayed. Below sections explains both ways, 1. Automatically generating columns 2. Manually define columns @@ -169,7 +169,7 @@ TreeGridCheckBoxColumn
-N> The order of columns in the collection will determine the order of that they will appear in SfTreeGrid. +N> The order of columns in the collection will determine the order of that they will appear in TreeGrid. #### AutoGenerateColumns with different modes @@ -277,7 +277,7 @@ private void TreeGrid_AutoGeneratingColumn(object sender, TreeGridAutoGenerating #### Changing column type -You can change the type of column adding to SfTreeGrid by setting the instance of column you want to add in `AutoGeneratingColumn` event. +You can change the type of column adding to TreeGrid by setting the instance of column you want to add in `AutoGeneratingColumn` event. In the below code, column type for `Salary` property is changed to `TreeGridTextColumn` by setting instance of TreeGridTextColumn to `Column` property. {% tabs %} @@ -355,12 +355,12 @@ private void TreeGrid_AutoGeneratingColumn(object sender, TreeGridAutoGenerating Below screenshot shows the customized header template loaded on the header of FirstName column. -![Customizing Header Template in WPF TreeGrid Column](Columns_images/wpf-treegrid-header-template.jpg) +![Customizing Header Template](Columns_images/wpf-treegrid-header-template.jpg) ### Data Annotations with AutoGenerateColumns -SfTreeGrid support to generate the columns based on built-in [Data Annotation Attributes](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel?view=dotnet-uwp-10.0&redirectedfrom=MSDN). Data Annotations ignored, when the `AutoGenerateColumns` is set to False. +TreeGrid support to generate the columns based on built-in [Data Annotation Attributes](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel?view=dotnet-uwp-10.0&redirectedfrom=MSDN). Data Annotations ignored, when the `AutoGenerateColumns` is set to False. #### Exclude column @@ -472,7 +472,7 @@ public string LastName The FirstName and LastName column rearranged based on specified order. -![Changing Columns Order of WPF TreeGrid](Columns_images/wpf-treegrid-columns-order.jpg) +![Changing Columns Order](Columns_images/wpf-treegrid-columns-order.jpg) #### Customizing data format @@ -501,7 +501,7 @@ public double? Salary ### Manually defining columns -SfTreeGrid control allows you to define the columns manually by adding desired column to the [SfTreeGrid.Columns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) collection. +TreeGrid control allows you to define the columns manually by adding desired column to the [SfTreeGrid.Columns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) collection. {% tabs %} {% highlight xaml %} @@ -591,7 +591,7 @@ treeGrid.Columns.RemoveAt(1); ## Resizing Columns -SfTreeGrid allows to resize the columns like in excel by resizing column header. This can be enabled or disabled by setting [SfTreeGrid.AllowResizingColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingColumns) or [TreeGridColumn.AllowResizing](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_AllowResizing) property. +TreeGrid allows to resize the columns like in excel by resizing column header. This can be enabled or disabled by setting [SfTreeGrid.AllowResizingColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingColumns) or [TreeGridColumn.AllowResizing](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_AllowResizing) property. N> Resizing considers MinWidth and MaxWidth of column. @@ -611,13 +611,13 @@ N> Resizing considers MinWidth and MaxWidth of column. You can change the column width by clicking and dragging the resizing cursor at the edge of column header. The resizing cursor appears when you hover the grid line exists between two columns. -![Resizing Columns in WPF TreeGrid](Columns_images/wpf-treegrid-column-resizing.jpeg) +![Resizing Columns](Columns_images/wpf-treegrid-column-resizing.jpeg) ### Hidden column resizing -SfTreeGrid shows indication for hidden columns in column header and also allows end-users to resize the hidden columns when setting [SfTreeGrid.AllowResizingHiddenColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingHiddenColumns) property to `true`. +TreeGrid shows indication for hidden columns in column header and also allows end-users to resize the hidden columns when setting [SfTreeGrid.AllowResizingHiddenColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingHiddenColumns) property to `true`. -![Resizing Hidden Column in WPF TreeGrid](Columns_images/wpf-treegtid-hidden-column-resizing.jpeg) +![Resizing Hidden Column](Columns_images/wpf-treegtid-hidden-column-resizing.jpeg) ### Disable resizing @@ -640,7 +640,7 @@ private void TreeGrid_ResizingColumns(object sender, ResizingColumnsEventArgs e) ### Identify resizing of the column gets completed -SfTreeGrid allows you to identify the progress of the resizing of columns through `ResizingColumnsEventArgs.Reason` property. You can get the width of the column after resizing completed by getting `ResizingColumnsEventArgs.Width` when `ResizingColumnsEventArgs.Reason` is `ColumnResizingReason.Resized` in `ResizingColumns` event. +TreeGrid allows you to identify the progress of the resizing of columns through `ResizingColumnsEventArgs.Reason` property. You can get the width of the column after resizing completed by getting `ResizingColumnsEventArgs.Width` when `ResizingColumnsEventArgs.Reason` is `ColumnResizingReason.Resized` in `ResizingColumns` event. {% tabs %} {% highlight c# %} @@ -674,7 +674,7 @@ You can allow end-users to rearrange the columns by drag and drop the column hea {% endhighlight %} {% endtabs %} -![Drag and Drop Column in WPF TreeGrid](Columns_images/wpf-treegrid-drag-and-drop.jpg) +![Drag and Drop Column](Columns_images/wpf-treegrid-drag-and-drop.jpg) You can enable or disable dragging on particular column using [TreeGridColumn.AllowDragging](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_AllowDragging) property. {% tabs %} @@ -740,11 +740,11 @@ this.treeGrid.FooterColumnCount = 2; {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Freezing Columns](Columns_images/wpf-treegrid-freeze-columns.png) +![displays Freezing Columns](Columns_images/wpf-treegrid-freeze-columns.png) ## Stacked Headers -SfTreeGrid supports additional unbound header rows known as `stacked header rows` that span across the TreeGrid columns using [StackedHeaderRows](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_StackedHeaderRows). You can group one or more columns under each stacked header. +TreeGrid supports additional unbound header rows known as `stacked header rows` that span across the TreeGrid columns using [StackedHeaderRows](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_StackedHeaderRows). You can group one or more columns under each stacked header. Each [StackedHeaderRow](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.StackedHeaderRow.html) contains the [StackedColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.StackedHeaderRow.html#Syncfusion_UI_Xaml_Grid_StackedHeaderRow_StackedColumns) where each [StackedColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.StackedColumn.html) contains a number of child columns. `StackedColumn.ChildColumns` property returns the columns which are grouped under the stacked header row. `StackedColumn.HeaderText` returns the text that displays in stacked header row. @@ -781,7 +781,7 @@ this.treeGrid.StackedHeaderRows.Add(stackedHeaderRow1); {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Stacked Headers](Columns_images/wpf-treegrid-stacked-headers.png) +![Stacked Headers](Columns_images/wpf-treegrid-stacked-headers.png) ### Adding ChildColumns @@ -847,7 +847,7 @@ private void TreeGrid_Loaded(object sender, RoutedEventArgs e) ## Binding column properties with ViewModel -SfTreeGrid provides MVVM support for binding `TreeGridColumn` properties with ViewModel properties. +TreeGrid provides MVVM support for binding `TreeGridColumn` properties with ViewModel properties. {% tabs %} {% highlight c# %} @@ -889,4 +889,4 @@ Below code, binds the `ViewModel.AllowEditing` property to `TreeGridColumn.Allow {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Conditional-Styling.md b/wpf/TreeGrid/Conditional-Styling.md index 602d16d2e..63b9e0cfa 100644 --- a/wpf/TreeGrid/Conditional-Styling.md +++ b/wpf/TreeGrid/Conditional-Styling.md @@ -1,15 +1,15 @@ --- layout: post -title: Conditional Styling in WPF SfTreeGrid | Syncfusion® -description: Conditional Styling in SfTreeGrid applies custom styles to cells, rows, and columns dynamically based on data values and conditions. +title: Conditional Styling in WPF TreeGrid | Syncfusion® +description: Conditional Styling in TreeGrid applies custom styles to cells, rows, and columns dynamically based on data values and conditions. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Conditional Styling in WPF SfTreeGrid +# Conditional Styling in WPF TreeGrid -You can style the treegrid and its inner elements conditionally based on data in three ways, +You can style the TreeGrid and its inner elements conditionally based on data in three ways, 1. Using Converter 2. Using Data Triggers @@ -50,7 +50,7 @@ It affects scrolling performance while styling more number of columns based on n -## Conditional Styling in WPF TreeGrid (SfTreeGrid) +## Conditional Styling in WPF TreeGrid ## Style cells using converter @@ -100,7 +100,7 @@ internal class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![WPF TreeGrid Conditional Cell Styling based on Data using Converter](Conditional-Styling_images/wpf-treegrid-conditional-styling.jpeg) +![Conditional Cell Styling based on Data using Converter](Conditional-Styling_images/wpf-treegrid-conditional-styling.jpeg) ## Style cells based on record using converter @@ -143,7 +143,7 @@ internal class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![WPF TreeGrid Conditional Cell Styling based on Record using Converter](Conditional-Styling_images/wpf-treegrid-conditional-style-for-record.jpeg) +![Conditional Cell Styling based on Record using Converter](Conditional-Styling_images/wpf-treegrid-conditional-style-for-record.jpeg) ## Style cells using triggers @@ -176,7 +176,7 @@ The record cells ([TreeGridCell](https://help.syncfusion.com/cr/wpf/Syncfusion.U {% endhighlight %} {% endtabs %} -![Customizing Cells Style using Triggers in WPF TreeGrid](Conditional-Styling_images/wpf-treegrid-cell-style-customization.jpeg) +![Customizing Cells Style using Triggers](Conditional-Styling_images/wpf-treegrid-cell-style-customization.jpeg) ## Style cells using style selector @@ -215,7 +215,7 @@ public class SelectorClass : StyleSelector {% endhighlight %} {% endtabs %} -![WPF TreeGrid Conditional Cell Styling based on Data using Style Selector](Conditional-Styling_images/wpf-treegrid-cell-style.jpeg) +![Conditional Cell Styling based on Data using Style Selector](Conditional-Styling_images/wpf-treegrid-cell-style.jpeg) ## Add image to cell @@ -249,11 +249,11 @@ public class StringToImageConverter : IValueConverter {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Image](Conditional-Styling_images/wpf-treegrid-with-image.jpeg) +![Column with Image](Conditional-Styling_images/wpf-treegrid-with-image.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-load-images-in-a-cell-in-wpf-and-uwp-treegrid/tree/master/WPF). -## Conditional Styling in WPF TreeGrid (SfTreeGrid) +## Conditional Styling in WPF TreeGrid ## Style rows using converter @@ -295,7 +295,7 @@ public class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![WPF TreeGrid Condition Row Styling based on Data using Converter](Conditional-Styling_images/wpf-treegrid-conditional-row-style.jpeg) +![Condition Row Styling based on Data using Converter](Conditional-Styling_images/wpf-treegrid-conditional-row-style.jpeg) ## Style rows using style selector @@ -329,9 +329,9 @@ public class SelectorClass : StyleSelector {% endhighlight %} {% endtabs %} -![WPF TreeGrid Condition Row Styling based on Data using Style Selector](Conditional-Styling_images/wpf-treegrid-row-style.jpeg) +![Condition Row Styling based on Data using Style Selector](Conditional-Styling_images/wpf-treegrid-row-style.jpeg) -## Conditional Styling in WPF TreeGrid (SfTreeGrid) +## Conditional Styling in WPF TreeGrid The appearance of row header ([GridRowHeaderCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowHeaderCell.html)) can be customized conditionally by changing its property value based on ‘cell value’ or ‘data object’ by using converter,where converter returns the value based on Underlying record. @@ -368,7 +368,7 @@ public class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![Customizing Row Header Style in WPF TreeGrid](Conditional-Styling_images/wpf-treegrid-row-style-customization.jpeg) +![Customizing Row Header Style](Conditional-Styling_images/wpf-treegrid-row-style-customization.jpeg) -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Data-Binding.md b/wpf/TreeGrid/Data-Binding.md index d8578a4a8..a2051ff0f 100644 --- a/wpf/TreeGrid/Data-Binding.md +++ b/wpf/TreeGrid/Data-Binding.md @@ -1,18 +1,18 @@ ---- +--- layout: post -title: Data Binding in WPF SfTreeGrid | Syncfusion® -description: Bind hierarchical and self-relational data to SfTreeGrid using ItemsSource, nested collections, and on-demand loading. +title: Data Binding in WPF TreeGrid | Syncfusion® +description: Bind hierarchical and self-relational data to TreeGrid using ItemsSource, nested collections, and on-demand loading. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Data Binding in WPF SfTreeGrid +# Data Binding in WPF TreeGrid -SfTreeGrid is designed to display the self-relational and hierarchical data in tree structure with columns. The data binding can be achieved by assigning the data source to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property directly through self-relational binding or nested collection or retrieving the parent and child nodes items dynamically using [RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) or [LoadOnDemandCommand](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LoadOnDemandCommand). -If the data source implements [INotifyCollectionChanged](https://learn.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?redirectedfrom=MSDN&view=net-5.0) interface, then SfTreeGrid control will automatically refresh the UI when item is added, removed or while list cleared. When you add, remove item in [ObservableCollection](https://learn.microsoft.com/en-us/dotnet/api/system.collections.objectmodel.observablecollection-1?redirectedfrom=MSDN&view=net-5.0)`, SfTreeGrid automatically refresh the UI as `ObservableCollection implements `INotifyCollectionChanged`. But when you do the same in [List](https://learn.microsoft.com/en-us/dotnet/api/system.collections.generic.list-1?redirectedfrom=MSDN&view=net-5.0), SfTreeGrid will not refresh the UI automatically. +WPF TreeGrid is designed to display the self-relational and hierarchical data in tree structure with columns. The data binding can be achieved by assigning the data source to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property directly through self-relational binding or nested collection or retrieving the parent and child nodes items dynamically using [RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) or [LoadOnDemandCommand](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LoadOnDemandCommand). +If the data source implements [INotifyCollectionChanged](https://learn.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?redirectedfrom=MSDN&view=net-5.0) interface, then control will automatically refresh the UI when item is added, removed or while list cleared. When you add, remove item in [ObservableCollection](https://learn.microsoft.com/en-us/dotnet/api/system.collections.objectmodel.observablecollection-1?redirectedfrom=MSDN&view=net-5.0)`, control automatically refresh the UI as `ObservableCollection implements `INotifyCollectionChanged`. But when you do the same in [List](https://learn.microsoft.com/en-us/dotnet/api/system.collections.generic.list-1?redirectedfrom=MSDN&view=net-5.0), Control will not refresh the UI automatically. -Below are the ways to bind the data source to SfTreeGrid. +Below are the ways to bind the data source to TreeGrid. * [Populate data using self-relational binding](https://help.syncfusion.com/wpf/treegrid/getting-started#binding-self-relational-data-in-sftreegrid) * [Populate data using nested collection](https://help.syncfusion.com/wpf/treegrid/getting-started#binding-nested-collection-with-sftreegrid) @@ -21,18 +21,18 @@ Below are the ways to bind the data source to SfTreeGrid. ## Binding with IEnumerable -SfTreeGrid control supports to bind any collection that implements the [IEnumerable](https://learn.microsoft.com/en-us/dotnet/api/system.collections.ienumerable?redirectedfrom=MSDN&view=net-5.0) interface. Data operations such as sorting is supported when you are binding collection derived from `IEnumerable`. +TreeGrid supports to bind any collection that implements the [IEnumerable](https://learn.microsoft.com/en-us/dotnet/api/system.collections.ienumerable?redirectedfrom=MSDN&view=net-5.0) interface. Data operations such as sorting is supported when you are binding collection derived from `IEnumerable`. ## Binding with dynamic data object -SfTreeGrid control supports to bind [dynamic data object](https://learn.microsoft.com/en-us/dotnet/api/system.dynamic?redirectedfrom=MSDN&view=net-5.0). Below are the limitations when you are binding dynamic data object, +TreeGrid supports to bind [dynamic data object](https://learn.microsoft.com/en-us/dotnet/api/system.dynamic?redirectedfrom=MSDN&view=net-5.0). Below are the limitations when you are binding dynamic data object, 1. In UWP, UI won’t get refreshed when you are changing the property value. This is limitation in UWP platform. -2. SfTreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. +2. TreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. ## Binding Complex properties -SfTreeGrid control provides support to bind complex property to its columns. To bind the complex property to `TreeGridColumn`, set the complex property path to `MappingName`. +TreeGrid provides support to bind complex property to its columns. To bind the complex property to `TreeGridColumn`, set the complex property path to `MappingName`. {% tabs %} {% highlight xaml %} @@ -53,11 +53,11 @@ SfTreeGrid control provides support to bind complex property to its columns. **Limitations when binding complex property:** -SfTreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. +TreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. ## Binding Indexer properties -SfTreeGrid control provides support to bind an indexer property to its columns. To bind an indexer property to `TreeGridColumn`, set the indexer property path to `MappingName`. +TreeGrid control provides support to bind an indexer property to its columns. To bind an indexer property to `TreeGridColumn`, set the indexer property path to `MappingName`. {% tabs %} {% highlight xaml %} @@ -78,11 +78,11 @@ this.treeGrid.Columns.Add(new TreeGridTextColumn() {MappingName="Marks[0]"}); **Limitations when binding indexer property:** -SfTreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. +TreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. ## AutoExpandMode -By setting [SfTreeGrid.AutoExpandMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoExpandMode) property, you can let the SfTreeGrid to expand the nodes while loading. +By setting [SfTreeGrid.AutoExpandMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoExpandMode) property, you can let the TreeGrid to expand the nodes while loading. @@ -313,7 +313,7 @@ You can collapse all the tree nodes or specific node and its child nodes. Here i {{'[CollapseAllNodes()](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CollapseAllNodes)'| markdownify }} @@ -337,7 +337,7 @@ Collapse the node at specific row index {{'[CollapseNode(TreeNode treeNode)](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CollapseNode_Syncfusion_UI_Xaml_TreeGrid_TreeNode_)'| markdownify }}
-Collapse all the nodes in SfTreeGrid +Collapse all the nodes in TreeGrid
-Collapse the specific node in SfTreeGrid +Collapse the specific node in TreeGrid
@@ -442,7 +442,7 @@ private void TreeGrid_NodeCollapsed(object sender, NodeCollapsedEventArgs e) ## Expand/Collapse a node based on mapping property -SfTreeGrid supports to expand/collapse the nodes based on the value of a boolean mapping property in the underlying data object by using [SfTreeGrid.ExpandStateMappingName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ExpandStateMappingName) property. TreeGrid expand/collapse the node when the specified property value in underlying data object gets changed. +TreeGrid supports to expand/collapse the nodes based on the value of a boolean mapping property in the underlying data object by using [SfTreeGrid.ExpandStateMappingName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ExpandStateMappingName) property. TreeGrid expand/collapse the node when the specified property value in underlying data object gets changed. {% tabs %} {% highlight xaml %} @@ -459,7 +459,7 @@ treeGrid.ExpandStateMappingName = "IsExpanded"; ## LiveNodeUpdateMode -SfTreeGrid listens and responds to the manipulation such as add, delete and data update (property change) at runtime. SfTreeGrid refreshes the sorting based on [SfTreeGrid.LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) property. If you set `LiveNodeUpdateMode` as `AllowDataShaping`, sorting will be refreshed on data manipulation and property change. +TreeGrid listens and responds to the manipulation such as add, delete and data update (property change) at runtime. TreeGrid refreshes the sorting based on [SfTreeGrid.LiveNodeUpdateMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) property. If you set `LiveNodeUpdateMode` as `AllowDataShaping`, sorting will be refreshed on data manipulation and property change. {% tabs %} {% highlight xaml %} @@ -483,7 +483,7 @@ treeGrid.LiveNodeUpdateMode = LiveNodeUpdateMode.AllowDataShaping; [SfTreeGrid.ItemsSourceChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSourceChanged) event occurs when the data source is changed by using [ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property. -This event receives two arguments namely sender that handles SfTreeGrid and `GridItemsSourceChangedEventArgs` as objects. +This event receives two arguments namely sender that handles TreeGrid and `GridItemsSourceChangedEventArgs` as objects. The `GridItemsSourceChangedEventArgs` object contains the following properties: * `OldItemsSource` - Gets the value of old data source @@ -491,9 +491,9 @@ The `GridItemsSourceChangedEventArgs` object contains the following properties ## View -SfTreeGrid has the [View](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_View) property of type [TreeGridView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html). `View` is responsible for maintaining and manipulating the nodes and other advanced operations like Sorting. When you bind Collection to `ItemsSource` property of SfTreeGrid or wire `RequestTreeItems` event, then `View` will be created and maintains the operations on nodes. +TreeGrid has the [View](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_View) property of type [TreeGridView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html). `View` is responsible for maintaining and manipulating the nodes and other advanced operations like Sorting. When you bind Collection to `ItemsSource` property or wire `RequestTreeItems` event, then `View` will be created and maintains the operations on nodes. -SfTreeGrid creates different types of views derived from TreeGridView based on data population methods. +TreeGrid creates different types of views derived from TreeGridView based on data population methods. [TreeGridSelfRelationalView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSelfRelationalView.html) - While populating data using self-relational binding @@ -566,7 +566,7 @@ treeGrid.View.EndInit(); {% endhighlight %} {% endtabs %} -N> View has properties (`EnableRecursiveChecking`, `LiveNodeUpdateMode` , `RecursiveCheckingMode`,..)that already defined in SfTreeGrid. It is recommended to set those properties via SfTreeGrid. +N> View has properties (`EnableRecursiveChecking`, `LiveNodeUpdateMode` , `RecursiveCheckingMode`,..)that already defined in TreeGrid. It is recommended to set those properties via TreeGrid. -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Data-Validation.md b/wpf/TreeGrid/Data-Validation.md index 7e81102fc..7a77dd693 100644 --- a/wpf/TreeGrid/Data-Validation.md +++ b/wpf/TreeGrid/Data-Validation.md @@ -1,16 +1,16 @@ --- layout: post -title: Data Validation in WPF SfTreeGrid | Syncfusion® -description: Validate user input in SfTreeGrid with built-in rules, IDataErrorInfo, and custom validation logic for accurate data. +title: Data Validation in WPF TreeGrid | Syncfusion® +description: Validate user input in TreeGrid with built-in rules, IDataErrorInfo, and custom validation logic for accurate data. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Data Validation in WPF SfTreeGrid +# Data Validation in WPF TreeGrid -SfTreeGrid allows you to validate the data and display hints in case of validation is not passed. In case of invalid data, error icon is displayed at the top right corner of [TreeGridCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCell.html). When mouse over the error icon, error information will be displayed in tooltip. +WPF TreeGrid allows you to validate the data and display hints in case of validation is not passed. In case of invalid data, error icon is displayed at the top right corner of [TreeGridCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCell.html). When mouse over the error icon, error information will be displayed in tooltip. ## Built-in validations @@ -22,7 +22,7 @@ Built-in validations through[IDataErrorInfo](https://learn.microsoft.com/en-us/d ## Built-in validation using IDataErrorInfo / INotifyDataErrorInfo -SfTreeGrid provides support to validate the data based on [IDataErrorInfo](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.idataerrorinfo?redirectedfrom=MSDN&view=net-5.0)/[INotifyDataErrorInfo](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.inotifydataerrorinfo?redirectedfrom=MSDN&view=net-5.0). +TreeGrid provides support to validate the data based on [IDataErrorInfo](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.idataerrorinfo?redirectedfrom=MSDN&view=net-5.0)/[INotifyDataErrorInfo](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.inotifydataerrorinfo?redirectedfrom=MSDN&view=net-5.0). ### Using IDataErrorInfo @@ -83,7 +83,7 @@ treeGrid.GridValidationMode = GridValidationMode.InView; {% endhighlight %} {% endtabs %} -![Data Validation in WPF TreeGrid using IDataErrorInfo](Data-Validation_images/wpf-treegrid-data-validation.png) +![Data Validation using IDataErrorInfo](Data-Validation_images/wpf-treegrid-data-validation.png) ### INotifyDataErrorInfo You can validate the data by implementing the [INotifyDataErrorInfo](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.inotifydataerrorinfo?redirectedfrom=MSDN&view=net-5.0) interface in model class. @@ -139,7 +139,7 @@ Enable built-in validation support by setting `SfTreeGrid.GridValidationMode` or {% endhighlight %} {% endtabs %} -![Data Validation in WPF TreeGrid using INotifyDataErrorInfo](Data-Validation_images/wpf-treegrid-validation.png) +![Data Validation using INotifyDataErrorInfo](Data-Validation_images/wpf-treegrid-validation.png) ## Built-in validation using Data Annotation @@ -210,7 +210,7 @@ public string CustomerID ## Custom validation through events -You can validate the cells and rows using [CurrentCellValidating](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) and [RowValidating](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) events. SfTreeGrid will not allow user to edit other cell / row if validation failed. +You can validate the cells and rows using [CurrentCellValidating](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) and [RowValidating](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) events. TreeGrid will not allow user to edit other cell / row if validation failed. ### Cell Validation @@ -380,7 +380,7 @@ You can change the validation error template shape of the `TreeGridCell` by ch {% endhighlight %} {% endtabs %} -![Data Validation Error Icon with Custom Color in WPF TreeGrid](Data-Validation_images/wpf-treegrid-data-validation-error-icon.png) +![Data Validation Error Icon with Custom Color](Data-Validation_images/wpf-treegrid-data-validation-error-icon.png) #### Change the color of error icon @@ -472,7 +472,7 @@ You can change the validation error template color of the `TreeGridCell` by cha {% endhighlight %} {% endtabs %} -![WPF TreeGrid - Error Tip Foreground and Background Customization](Data-Validation_images/wpf-treegrid-data-validation-error-tip-customization.png) +![Error Tip Foreground and Background Customization](Data-Validation_images/wpf-treegrid-data-validation-error-tip-customization.png) #### Change the cursor on error icon @@ -565,7 +565,7 @@ You can change the validation error template cursor of the `TreeGridCell` by c {% endhighlight %} {% endtabs %} -![Changing Cursor on Error Icon of WPF TreeGrid](Data-Validation_images/wpf-treegrid-cursor-style.png) +![Changing Cursor on Error Icon](Data-Validation_images/wpf-treegrid-cursor-style.png) ### Customizing error tip @@ -656,11 +656,11 @@ You can change the error tip background color by setting `Background` property o {% endhighlight %} {% endtabs %} -![Changing Error Tip Background Color in WPF TreeGrid](Data-Validation_images/wpf-treegrid-error-tip.png) +![Changing Error Tip Background Color](Data-Validation_images/wpf-treegrid-error-tip.png) ### Showing error details in RowHeader -SfTreeGrid supports to show the error icon in [TreeGridRowHeaderCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowHeaderCell.html) based on [IDataErrorInfo.Error](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.idataerrorinfo.error?redirectedfrom=MSDN&view=net-5.0#System_ComponentModel_IDataErrorInfo_Error) or [INotifyDataErrorInfo.HasErrors](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.inotifydataerrorinfo.haserrors?redirectedfrom=MSDN&view=net-5.0#System_ComponentModel_INotifyDataErrorInfo_HasErrors) property. +TreeGrid supports to show the error icon in [TreeGridRowHeaderCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowHeaderCell.html) based on [IDataErrorInfo.Error](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.idataerrorinfo.error?redirectedfrom=MSDN&view=net-5.0#System_ComponentModel_IDataErrorInfo_Error) or [INotifyDataErrorInfo.HasErrors](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.inotifydataerrorinfo.haserrors?redirectedfrom=MSDN&view=net-5.0#System_ComponentModel_INotifyDataErrorInfo_HasErrors) property. #### Using IDataErrorInfo @@ -683,7 +683,7 @@ public string Error {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Error Tip on Row Header](Data-Validation_images/wpf-treegrid-error-tip-on-row-header.png) +![displays Error Tip on Row Header](Data-Validation_images/wpf-treegrid-error-tip-on-row-header.png) #### Using INotifyDataErrorInfo @@ -706,11 +706,11 @@ public bool HasErrors {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Error Tip on Row Header using INotifyDataErrorInfo](Data-Validation_images/wpf-treegrid-error-tip-on-header-row.png) +![displays Error Tip on Row Header using INotifyDataErrorInfo](Data-Validation_images/wpf-treegrid-error-tip-on-header-row.png) ## Validation with CheckBox column -SfTreeGrid doesn’t support to validate the [TreeGridCheckBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCheckBoxColumn.html) through validating events. You can validate the check box column value by setting `TreeGridValidationHelper.IsCurrentCellValidated` and `TreeGridValidationHelper.IsCurrentRowValidated` static properties by calling [SetCurrentRowValidated](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentRowValidated_System_Boolean_) and [SetCurrentCellValidated](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentCellValidated_System_Boolean_) methods from [TreeGridValidationHelper](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html). +TreeGrid doesn’t support to validate the [TreeGridCheckBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCheckBoxColumn.html) through validating events. You can validate the check box column value by setting `TreeGridValidationHelper.IsCurrentCellValidated` and `TreeGridValidationHelper.IsCurrentRowValidated` static properties by calling [SetCurrentRowValidated](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentRowValidated_System_Boolean_) and [SetCurrentCellValidated](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentCellValidated_System_Boolean_) methods from [TreeGridValidationHelper](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html). {% tabs %} {% highlight c# %} @@ -758,7 +758,7 @@ void treeGrid_CurrentCellValueChanged(object sender, TreeGridCurrentCellValueCha {% endhighlight %} {% endtabs %} -![Data Validation with CheckBox in WPF TreeGrid](Data-Validation_images/wpf-treegrid-data-validation-checkbox.png) +![Data Validation with CheckBox](Data-Validation_images/wpf-treegrid-data-validation-checkbox.png) ## Limitations @@ -766,4 +766,4 @@ void treeGrid_CurrentCellValueChanged(object sender, TreeGridCurrentCellValueCha 2. [CurrentCellValidating](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentCellValidating) event will not triggered for [TreeGridTemplateColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridTemplateColumn.html). -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Editing.md b/wpf/TreeGrid/Editing.md index 394618f47..acf0863f0 100644 --- a/wpf/TreeGrid/Editing.md +++ b/wpf/TreeGrid/Editing.md @@ -1,15 +1,15 @@ ---- +--- layout: post -title: Editing in WPF SfTreeGrid | Syncfusion® -description: Enable cell editing in SfTreeGrid with support for custom editors, edit modes, and validation during data updates. +title: Editing in WPF TreeGrid | Syncfusion® +description: Enable cell editing in TreeGrid with support for custom editors, edit modes, and validation during data updates. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Editing in WPF SfTreeGrid +# Editing in WPF TreeGrid -SfTreeGrid provides support for editing and it can be enabled or disabled by setting [SfTreeGrid.AllowEditing](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowEditing) property. +WPF TreeGrid provides support for editing and it can be enabled or disabled by setting [SfTreeGrid.AllowEditing](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowEditing) property. {% tabs %} {% highlight xaml %} @@ -46,7 +46,7 @@ this.treeGrid.Columns["FirstName"].AllowEditing = true; N> `TreeGridColumn.AllowEditing` takes higher priority than `SfTreeGrid.AllowEditing` -![Editing in WPF TreeGrid](Editing_images/wpf-treegrid-editing.png) +![Editing](Editing_images/wpf-treegrid-editing.png) N> It is mandatory to set the `NavigationMode` to `Cell` to enable `CurrentCell` navigation and editing. @@ -103,7 +103,7 @@ this.treeGrid.EditorSelectionBehavior = EditorSelectionBehavior.SelectAll; ## Support for IEditableObject -`SfTreeGrid` supports committing and rolling back the changes in row level when underlying data object implements the [IEditableObject](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.ieditableobject?redirectedfrom=MSDN&view=net-5.0) interface. +`TreeGrid` supports committing and rolling back the changes in row level when underlying data object implements the [IEditableObject](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.ieditableobject?redirectedfrom=MSDN&view=net-5.0) interface. The editing changes in a row will be committed only when user move to next row or pressing enter key in [EndEdit](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.ieditableobject.endedit?redirectedfrom=MSDN&view=net-5.0#System_ComponentModel_IEditableObject_EndEdit). Also when user press Esc key, then the changes made in a row will be reverted in [CancelEdit](https://learn.microsoft.com/en-us/dotnet/api/system.componentmodel.ieditableobject.canceledit?redirectedfrom=MSDN&view=net-5.0#System_ComponentModel_IEditableObject_CancelEdit). @@ -282,7 +282,7 @@ public class EmployeeInfo : IEditableObject, INotifyPropertyChanged ## Events -SfTreeGrid triggers the following events during editing. +TreeGrid triggers the following events during editing. ### CurrentCellBeginEdit Event @@ -292,7 +292,7 @@ SfTreeGrid triggers the following events during editing. * [RowColumnIndex](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellBeginEditEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellBeginEditEventArgs_RowColumnIndex) : Gets the current row column index of the TreeGrid. -* [Column](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellBeginEditEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellBeginEditEventArgs_Column) : Gets the Tree Grid Column of the SfTreeGrid. +* [Column](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellBeginEditEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellBeginEditEventArgs_Column) : Gets the Tree Grid Column of the TreeGrid. {% tabs %} {% highlight c# %} @@ -330,7 +330,7 @@ void TreeGrid_CurrentCellEndEdit(object sender, CurrentCellEndEditEventArgs args [CurrentCellValueChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentCellValueChanged) event occurs whenever a value changes in TreeGridColumn that supports editing. [TreeGridCurrentCellValueChangedEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellValueChangedEventArgs.html) has following members which provides information for `CurrentCellValueChanged` event. -* [Column](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellValueChangedEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellValueChangedEventArgs_Column) : Gets the Grid Column of the SfTreeGrid. +* [Column](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellValueChangedEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellValueChangedEventArgs_Column) : Gets the Grid Column of the TreeGrid. * [RowColumnIndex](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellValueChangedEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellValueChangedEventArgs_RowColumnIndex) : Gets the value of the current RowColumnIndex. {% tabs %} @@ -372,7 +372,7 @@ void TreeGrid_CurrentCellDropDownSelectionChanged(object sender, CurrentCellDrop ### BeginEdit -SfTreeGrid allows you to edit the cell programmatically by calling the [BeginEdit](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellManager.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellManager_BeginEdit) method. Initially the [CurrentCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellManager.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellManager_CurrentCell) need to set before calling the `BeginEdit` method when the CurrentCell value is null. +TreeGrid allows you to edit the cell programmatically by calling the [BeginEdit](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellManager.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellManager_BeginEdit) method. Initially the [CurrentCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellManager.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellManager_CurrentCell) need to set before calling the `BeginEdit` method when the CurrentCell value is null. {% tabs %} {% highlight c# %} @@ -503,7 +503,7 @@ You can focus to the particular `UIElement` loaded inside template when cell get {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Cell Template](Editing_images/wpf-treegrid-cell-template.png) +![Column with Cell Template](Editing_images/wpf-treegrid-cell-template.png) ## Providing keyboard control to UIElement inside CellTemplate @@ -535,9 +535,9 @@ You can allow UIElement loaded inside CellTemplate to handle keyboard interactio {% endhighlight %} {% endtabs %} -![Keyboard Operations in WPF TreeGrid](Editing_images/wpf-treegrid-keyboard-operation.png) +![Keyboard Operations](Editing_images/wpf-treegrid-keyboard-operation.png) -N> Enter and Tab keys are always handled by SfTreeGrid only. +N> Enter and Tab keys are always handled by TreeGrid only. ## Providing mouse control to UIElement inside template @@ -569,4 +569,4 @@ You can allow `UIElement` loaded inside template to handle mouse interaction in {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Export-To-Excel.md b/wpf/TreeGrid/Export-To-Excel.md index 06508fb72..f0037b68c 100644 --- a/wpf/TreeGrid/Export-To-Excel.md +++ b/wpf/TreeGrid/Export-To-Excel.md @@ -1,17 +1,17 @@ --- layout: post -title: Export To Excel in WPF SfTreeGrid | Syncfusion® -description: Export SfTreeGrid data to Excel with support for headers, stacked headers, sorting, and filtering preservation. +title: Export To Excel in WPF TreeGrid | Syncfusion® +description: Export TreeGrid data to Excel with support for headers, stacked headers, sorting, and filtering preservation. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Export To Excel in WPF SfTreeGrid +# Export To Excel in WPF TreeGrid -SfTreeGrid provides support to export the data to Excel file. This also provides support to export the headers and stacked headers. This maintains the sorting and filtering processes when exporting. +WPF TreeGrid provides support to export the data to Excel file. This also provides support to export the headers and stacked headers. This maintains the sorting and filtering processes when exporting. -The following assemblies should be added for exporting a tree grid to Excel:- +The following assemblies should be added for exporting a TreeGrid to Excel:- * Syncfusion.SfGridConverter.WPF * Syncfusion.XlsIO.Base @@ -19,7 +19,7 @@ The following assemblies should be added for exporting a tree grid to Excel:- For NuGet package, have to install [Syncfusion.DataGridExcelExport.WPF](https://www.nuget.org/packages/Syncfusion.DataGridExcelExport.WPF) package. For more details refer this [UG link](https://help.syncfusion.com/wpf/control-dependencies#exporting-treegrid-to-excel-pdf-and-csv). -You can export the tree grid to Excel by using the [ExportToExcel](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportExtension.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportExtension_ExportToExcel_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_) extension method present in [Syncfusion.UI.Xaml.TreeGrid.Converter](https://help.syncfusion.com/cr/wpf/Syncfusion.html) namespace. +You can export the TreeGrid to Excel by using the [ExportToExcel](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportExtension.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportExtension_ExportToExcel_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_) extension method present in [Syncfusion.UI.Xaml.TreeGrid.Converter](https://help.syncfusion.com/cr/wpf/Syncfusion.html) namespace. {% tabs %} {% highlight c# %} @@ -32,7 +32,7 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -N> SfTreeGrid exports the data to Excel using [XlsIO](https://help.syncfusion.com/document-processing/excel/excel-library/net/overview). You can refer to the [XlsIO documentation](https://help.syncfusion.com/file-formats/xlsio/working-with-excel-worksheet) for manipulating the exported work sheets. +N> TreeGrid exports the data to Excel using [XlsIO](https://help.syncfusion.com/document-processing/excel/excel-library/net/overview). You can refer to the [XlsIO documentation](https://help.syncfusion.com/file-formats/xlsio/working-with-excel-worksheet) for manipulating the exported work sheets. ## Export options @@ -55,7 +55,7 @@ workBook.SaveAs("Sample.xlsx"); ### Export without outlines -By default, all the children in the tree grid will be exported in expanded state. You can disable the outlines in Excel by setting the [AllowOutliningGroups](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowOutliningGroups) property to false in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html) class. +By default, all the children in the TreeGrid will be exported in expanded state. You can disable the outlines in Excel by setting the [AllowOutliningGroups](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowOutliningGroups) property to false in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html) class. {% tabs %} {% highlight c# %} @@ -68,11 +68,11 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![WPF TreeGrid Data Exporting to Excel without Outlines](Export-To-Excel_images/wpf-treegrid-export-to-excel.jpeg) +![Data Exporting to Excel without Outlines](Export-To-Excel_images/wpf-treegrid-export-to-excel.jpeg) ### Exclude columns when exporting -By default, all the columns (including hidden columns) in the tree grid will be exported to Excel. To exclude some columns, use [ExcludeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_ExcludeColumns) field in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html) class. +By default, all the columns (including hidden columns) in the TreeGrid will be exported to Excel. To exclude some columns, use [ExcludeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_ExcludeColumns) field in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html) class. {% tabs %} {% highlight c# %} @@ -153,7 +153,7 @@ The default value of the [ExportColumnWidth](https://help.syncfusion.com/cr/wpf/ ### Export with customized row height -You can export the tree grid to Excel with customized row height by using the [DefaultRowHeight](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_DefaultRowHeight) property. +You can export the TreeGrid to Excel with customized row height by using the [DefaultRowHeight](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_DefaultRowHeight) property. {% tabs %} {% highlight c# %} @@ -168,7 +168,7 @@ workBook.SaveAs("Sample1.xlsx"); ### Export without grid lines -You can export the tree grid to Excel without grid lines by setting the [IsGridLinesVisible](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_IsGridLinesVisible) property to `false`. +You can export the TreeGrid to Excel without grid lines by setting the [IsGridLinesVisible](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_IsGridLinesVisible) property to `false`. {% tabs %} {% highlight c# %} @@ -185,7 +185,7 @@ The default value of the [IsGridLinesVisible](https://help.syncfusion.com/cr/wpf ### Export with indent column -You can export the tree grid to Excel with indent column to denote the nodes level by setting the [AllowIndentColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowIndentColumn) property to true. +You can export the TreeGrid to Excel with indent column to denote the nodes level by setting the [AllowIndentColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowIndentColumn) property to true. {% tabs %} {% highlight c# %} @@ -231,7 +231,7 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![Changing Row and Column Index while Exporting from WPF TreeGrid to Excel](Export-To-Excel_images/wpf-treegrid-change-row-column-index.jpeg) +![Changing Row and Column Index while Exporting to Excel](Export-To-Excel_images/wpf-treegrid-change-row-column-index.jpeg) ## Save options @@ -331,7 +331,7 @@ window1.Show(); {% endhighlight %} {% endtabs %} -![WPF TreeGrid Data Exporting to Spreadsheet without Saving](Export-To-Excel_images/wpf-treegrid-export-to-spreadsheet.jpeg) +![Data Exporting to Spreadsheet without Saving](Export-To-Excel_images/wpf-treegrid-export-to-spreadsheet.jpeg) ## Export to HTML @@ -352,7 +352,7 @@ It is also possible to save the worksheet as HTML by using the [SaveAsHtml](htt ## Export to mail -You can export the tree grid to mail by converting to Excel and save the exported worksheet as HTML. Then the exported HTML contents should be embedded in the mail body. +You can export the TreeGrid to mail by converting to Excel and save the exported worksheet as HTML. Then the exported HTML contents should be embedded in the mail body. {% tabs %} {% highlight c# %} @@ -483,7 +483,7 @@ private static void ExportingHandler(object sender, TreeGridExcelExportingEventA {% endhighlight %} {% endtabs %} -![Customizing Cell Style in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-cell-style-customization.jpeg) +![Customizing Cell Style in Exported Data](Export-To-Excel_images/wpf-treegrid-cell-style-customization.jpeg) ### Customize the exporting content to Excel @@ -517,7 +517,7 @@ private static void CellExportingHandler(object sender, TreeGridCellExcelExporti {% endhighlight %} {% endtabs %} -![Customizing Exported WPF TreeGrid Content to Excel](Export-To-Excel_images/wpf-treegrid-export-customization.jpeg) +![Customizing Exported Content to Excel](Export-To-Excel_images/wpf-treegrid-export-customization.jpeg) Here, the cell values changed for the IsClosed column are based on the custom condition. @@ -549,7 +549,7 @@ private static void CellExportingHandler(object sender, TreeGridCellExcelExporti {% endhighlight %} {% endtabs %} -![Changing Row Style in Excel Sheet based on WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-row-style.jpeg) +![Changing Row Style in Excel Sheet based Data](Export-To-Excel_images/wpf-treegrid-row-style.jpeg) ### Customize the cells based on column name @@ -577,11 +577,11 @@ private static void CellExportingHandler(object sender, TreeGridCellExcelExporti {% endhighlight %} {% endtabs %} -![Customizing Cells based on Column in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-column-cell-customization.jpeg) +![Customizing Cells based on Column in Exported Data](Export-To-Excel_images/wpf-treegrid-column-cell-customization.jpeg) ## Customize exported workbook and worksheet -The tree grid can be exported to Excel using [XlsIO](https://help.syncfusion.com/document-processing/excel/excel-library/net/overview). You can refer to the [XlsIO documentation](https://help.syncfusion.com/document-processing/excel/excel-library/net/working-with-excel-worksheet) for manipulating the workbooks and sheets after exporting. +The TreeGrid can be exported to Excel using [XlsIO](https://help.syncfusion.com/document-processing/excel/excel-library/net/overview). You can refer to the [XlsIO documentation](https://help.syncfusion.com/document-processing/excel/excel-library/net/working-with-excel-worksheet) for manipulating the workbooks and sheets after exporting. ### Set borders @@ -599,7 +599,7 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![Changing Cell Border Style in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-cell-border-style.jpeg) +![Changing Cell Border Style in Exported Data](Export-To-Excel_images/wpf-treegrid-cell-border-style.jpeg) ### Enable filters @@ -616,7 +616,7 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![Displaying Filter in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-filter.jpeg) +![Displaying Filter in Exported Data](Export-To-Excel_images/wpf-treegrid-filter.jpeg) When using the `stacked headers`, you can specify the `range` based on the stacked headers count. @@ -650,7 +650,7 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![Customizing Range of Cells in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-range-of-cells.jpeg) +![Customizing Range of Cells in Exported Data](Export-To-Excel_images/wpf-treegrid-range-of-cells.jpeg) ## Performance @@ -676,7 +676,7 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![Formatting Column in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-column-formatting.jpeg) +![Formatting Column in Exported Data](Export-To-Excel_images/wpf-treegrid-column-formatting.jpeg) ### Alternate row styling without using CellsExportingEventHandler @@ -705,13 +705,13 @@ workBook.SaveAs("Sample.xlsx"); {% endhighlight %} {% endtabs %} -![Changing Style of Alternate Rows in Exported WPF TreeGrid Data](Export-To-Excel_images/wpf-treegrid-changing-row-style.jpeg) +![Changing Style of Alternate Rows in Exported Data](Export-To-Excel_images/wpf-treegrid-changing-row-style.jpeg) ## How to -### Export multiple tree grids to single Excel sheet +### Export multiple TreeGrid's to single Excel sheet -You can export multiple tree grids to single Excel sheet by merging one tree grid worksheet into another using the `Worksheet.UsedRange.CopyTo` method. +You can export multiple tree grids to single Excel sheet by merging one TreeGrid worksheet into another using the `Worksheet.UsedRange.CopyTo` method. {% tabs %} {% highlight c# %} @@ -733,9 +733,9 @@ workBook1.SaveAs("sample.xlsx"); {% endhighlight %} {% endtabs %} -### Export the tree grid that is not loaded in view +### Export the TreeGrid that is not loaded in view -You can export the tree grid that is not loaded in view by calling the ApplyTemplate() method before exporting. +You can export the TreeGrid that is not loaded in view by calling the ApplyTemplate() method before exporting. {% tabs %} {% highlight c# %} @@ -751,7 +751,7 @@ workBook1.SaveAs("sample.xlsx"); ### Export parent and expanded child nodes -By default, all the tree grid nodes will be exported when calling the `ExportToExcel` method. You can export only the parent and expanded child nodes by overriding the[ExportNodesToExcel](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToExcelConverter.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridToExcelConverter_ExportNodesToExcel_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_TreeNodes_Syncfusion_XlsIO_IWorksheet_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_) method of [TreeGridToExcelConverter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToExcelConverter.html) class, +By default, all the TreeGrid nodes will be exported when calling the `ExportToExcel` method. You can export only the parent and expanded child nodes by overriding the[ExportNodesToExcel](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToExcelConverter.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridToExcelConverter_ExportNodesToExcel_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_TreeNodes_Syncfusion_XlsIO_IWorksheet_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_) method of [TreeGridToExcelConverter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToExcelConverter.html) class, {% tabs %} {% highlight c# %} @@ -787,4 +787,4 @@ protected override void ExportNodesToExcel(SfTreeGrid treeGrid, TreeNodes nodes, You can download the sample [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/ExcelExportingDemo1880731953.zip). -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. diff --git a/wpf/TreeGrid/Export-To-PDF.md b/wpf/TreeGrid/Export-To-PDF.md index b001b0ceb..967051989 100644 --- a/wpf/TreeGrid/Export-To-PDF.md +++ b/wpf/TreeGrid/Export-To-PDF.md @@ -1,24 +1,24 @@ --- layout: post -title: Export To PDF in WPF SfTreeGrid | Syncfusion® -description: Export SfTreeGrid data to PDF with options to include headers, stacked headers, and maintain applied sorting or filtering. +title: Export To PDF in WPF TreeGrid | Syncfusion® +description: Export TreeGrid data to PDF with options to include headers, stacked headers, and maintain applied sorting or filtering. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Export To PDF in WPF SfTreeGrid +# Export To PDF in WPF TreeGrid -SfTreeGrid provides support to export the data to PDF file. This also provides support to export the headers and stacked headers. This maintains the sorting and filtering processes when exporting. +WPF TreeGrid provides support to export the data to PDF file. This also provides support to export the headers and stacked headers. This maintains the sorting and filtering processes when exporting. -The following assemblies should be added for exporting a tree grid to PDF file:- +The following assemblies should be added for exporting a TreeGrid to PDF file:- * Syncfusion.SfGridConverter.WPF * Syncfusion.Pdf.Base For NuGet package, have to install [Syncfusion.DataGridExcelExport.WPF](https://www.nuget.org/packages/Syncfusion.DataGridExcelExport.WPF) package. For more details refer this [UG link](https://help.syncfusion.com/wpf/control-dependencies#exporting-treegrid-to-excel-pdf-and-csv). -You can export the tree grid to PDF by using the following extension methods present in the [Syncfusion.UI.Xaml.TreeGrid.Converter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.html) namespace:- +You can export the TreeGrid to PDF by using the following extension methods present in the [Syncfusion.UI.Xaml.TreeGrid.Converter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.html) namespace:- * [ExportToPdf](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportExtension.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportExtension_ExportToPdf_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_) @@ -32,7 +32,7 @@ document.Save("Sample.pdf"); {% endhighlight %} {% endtabs %} -N> SfTreeGrid exports the data to PDF file using [Essential® PDF](http://help.syncfusion.com/file-formats/pdf/overview). You can refer to the [PDF documentation](http://help.syncfusion.com/file-formats/pdf/working-with-document) for manipulation. +N> TreeGrid exports the data to PDF file using [Essential® PDF](http://help.syncfusion.com/file-formats/pdf/overview). You can refer to the [PDF documentation](http://help.syncfusion.com/file-formats/pdf/working-with-document) for manipulation. ## Export options @@ -40,7 +40,7 @@ The exporting operation can be customized by passing [TreeGridPdfExportingOptio ### Auto size column width in PDF -You can export a tree grid to PDF by fitting the column width based on its content by setting the [AutoColumnWidth ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoColumnWidth)property to true. +You can export a TreeGrid to PDF by fitting the column width based on its content by setting the [AutoColumnWidth ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoColumnWidth)property to true. {% tabs %} {% highlight c# %} @@ -53,7 +53,7 @@ document.Save("Sample.pdf"); ### Auto size row height in PDF -You can export a tree grid to PDF by fitting the row height based on its content by setting the [AutoRowHeight ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoRowHeight)property to `true`. +You can export a TreeGrid to PDF by fitting the row height based on its content by setting the [AutoRowHeight ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoRowHeight)property to `true`. {% tabs %} {% highlight c# %} @@ -66,7 +66,7 @@ document.Save("Sample.pdf"); ### Exclude columns when exporting -By default, all the columns (including hidden columns) in the tree grid will be exported to PDF. To exclude some columns when exporting to PDF, use the [ExcludeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_ExcludeColumns) property in [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html) class. +By default, all the columns (including hidden columns) in the TreeGrid will be exported to PDF. To exclude some columns when exporting to PDF, use the [ExcludeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_ExcludeColumns) property in [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html) class. {% tabs %} {% highlight c# %} @@ -147,7 +147,7 @@ e.PdfDocumentTemplate.Top = header; {% endhighlight %} {% endtabs %} -![WPF TreeGrid Data Exporting to PDF Page](Export-To-PDF_images/wpf-treegrid-export-to-pdf.png) +![Data Exporting to PDF Page](Export-To-PDF_images/wpf-treegrid-export-to-pdf.png) Here, `string` is inserted in the header of the exported PDF file using the [DrawString](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfGraphics.html#Syncfusion_Pdf_Graphics_PdfGraphics_DrawString_System_String_Syncfusion_Pdf_Graphics_PdfFont_Syncfusion_Pdf_Graphics_PdfBrush_System_Drawing_PointF_) method. Similarly, you can insert any image, line, etc., using [DrawImage](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfGraphics.html#Syncfusion_Pdf_Graphics_PdfGraphics_DrawImage_Syncfusion_Pdf_Graphics_PdfImage_System_Drawing_PointF_), [DrawLine](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfGraphics.html#Syncfusion_Pdf_Graphics_PdfGraphics_DrawLine_Syncfusion_Pdf_Graphics_PdfPen_System_Drawing_PointF_System_Drawing_PointF_), etc., methods respectively. @@ -257,7 +257,7 @@ window.Show(); {% endhighlight %} {% endtabs %} -![WPF TreeGrid Data Exporting to PDF without Saving](Export-To-PDF_images/wpf-treegrid-export-data-without-saving.png) +![Data Exporting to PDF without Saving](Export-To-PDF_images/wpf-treegrid-export-data-without-saving.png) ## Cell appearance customization when exporting @@ -285,7 +285,7 @@ void GridPdfExportingEventHandler(object sender, TreeGridCellPdfExportingEventAr {% endhighlight %} {% endtabs %} -![Customizing Cell Style based on CellType in Exported WPF TreeGrid Data](Export-To-PDF_images/wpf-treegrid-cell-style.png) +![Customizing Cell Style based on CellType in Exported Data](Export-To-PDF_images/wpf-treegrid-cell-style.png) ### Cell styling based on the TreeGridPdfExportingOptions in PDF @@ -352,7 +352,7 @@ void GridPdfExportingEventHandler(object sender, TreeGridCellPdfExportingEventAr {% endhighlight %} {% endtabs %} -![Customizing Exported WPF TreeGrid Content](Export-To-PDF_images/wpf-treegrid-customize-exported-content.png) +![Customizing Exported Content](Export-To-PDF_images/wpf-treegrid-customize-exported-content.png) ### Export images to PDF @@ -400,7 +400,7 @@ void GridPdfExportingEventHandler(object sender, TreeGridCellPdfExportingEventAr {% endhighlight %} {% endtabs %} -![Exporting Image to PDF page from WPF TreeGrid Content](Export-To-PDF_images/wpf-treegrid-export-with-image.png) +![Exporting Image to PDF page Content](Export-To-PDF_images/wpf-treegrid-export-with-image.png) You can download the sample [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/PdfExportingDemo386427743.zip). @@ -432,7 +432,7 @@ You can download the sample [here](http://www.syncfusion.com/downloads/support/d ## Export parent and expanded child nodes -By default, all the tree grid nodes will be exported when exporting. You can export the parent and expanded child nodes alone by overriding the [ExportNodesToPdf](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToPdfConverter.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridToPdfConverter_ExportNodesToPdf_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_TreeNodes_Syncfusion_Pdf_Grid_PdfGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_) method of [TreeGridToPdfConverter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToPdfConverter.html) class, +By default, all the TreeGrid nodes will be exported when exporting. You can export the parent and expanded child nodes alone by overriding the [ExportNodesToPdf](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToPdfConverter.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridToPdfConverter_ExportNodesToPdf_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_TreeNodes_Syncfusion_Pdf_Grid_PdfGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_) method of [TreeGridToPdfConverter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToPdfConverter.html) class, {% tabs %} {% highlight c# %} @@ -477,7 +477,7 @@ You can download the sample [here](http://www.syncfusion.com/downloads/support/d ## Export Middle Eastern languages (Arabic and Hebrew) content to PDF -By default, [Middle Eastern languages ](http://en.wikipedia.org/wiki/Middle_East)(Arabic and Hebrew) in the tree grid will be exported from left to right in PDF. You can export them as displayed in the tree grid (export from right to left) by enabling the[RightToLeft](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfStringFormat.html#Syncfusion_Pdf_Graphics_PdfStringFormat_RightToLeft) property in [PdfStringFormat](http://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfStringFormat.html) class and apply the format to [PdfGridCell](http://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Grid.PdfGridCell.html) class using the [CellsExportingEventHandler](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_CellsExportingEventHandler) property. +By default, [Middle Eastern languages ](http://en.wikipedia.org/wiki/Middle_East)(Arabic and Hebrew) in the TreeGrid will be exported from left to right in PDF. You can export them as displayed (export from right to left) by enabling the[RightToLeft](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfStringFormat.html#Syncfusion_Pdf_Graphics_PdfStringFormat_RightToLeft) property in [PdfStringFormat](http://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Graphics.PdfStringFormat.html) class and apply the format to [PdfGridCell](http://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.Grid.PdfGridCell.html) class using the [CellsExportingEventHandler](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_CellsExportingEventHandler) property. {% tabs %} {% highlight c# %} @@ -500,9 +500,9 @@ void GridPdfExportingEventHandler(object sender, TreeGridCellPdfExportingEventAr {% endhighlight %} {% endtabs %} -![Exporting with Arabic Language Text from WPF TreeGrid to PDF Page](Export-To-PDF_images/wpf-treegrid-export-arabic-text.png) +![Exporting with Arabic Language Text to PDF Page](Export-To-PDF_images/wpf-treegrid-export-arabic-text.png) You can download the sample [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/ExportMiddleEstern_to_PDF32087667.zip). -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure control. diff --git a/wpf/TreeGrid/Filtering.md b/wpf/TreeGrid/Filtering.md index 31c6da165..23aa1cd5d 100644 --- a/wpf/TreeGrid/Filtering.md +++ b/wpf/TreeGrid/Filtering.md @@ -1,15 +1,15 @@ ---- +--- layout: post -title: Filtering in WPF SfTreeGrid | Syncfusion® -description: Filter SfTreeGrid records using built-in filter predicates, UI options, and advanced filter conditions for relevant data. +title: Filtering in WPF TreeGrid | Syncfusion® +description: Filter TreeGrid records using built-in filter predicates, UI options, and advanced filter conditions for relevant data. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Filtering in WPF SfTreeGrid +# Filtering in WPF TreeGrid -Filtering is the process of retrieving the values from a collection that satisfies the specified condition. In SfTreeGrid, filtering can be applied through the UI as well as the programmatic filters. +Filtering is the process of retrieving the values from a collection that satisfies the specified condition. In TreeGrid, filtering can be applied through the UI as well as the programmatic filters. ## FilterLevel @@ -23,19 +23,19 @@ treeGrid.FilterLevel = FilterLevel.All; {% endhighlight %} {% endtabs %} -* Root - Filter will be applied to root nodes only in SfTreeGrid. +* Root - Filter will be applied to root nodes only in TreeGrid. -* All - Filter will be applied to all the nodes in SfTreeGrid. +* All - Filter will be applied to all the nodes in TreeGrid. * Extended - Filtering is applied based on the node hierarchy. Child nodes are included in filtering only when their parent node is expanded. If a node matches the filter condition, all of its ancestor nodes are displayed to preserve the hierarchy, even if those ancestor nodes do not match the filter condition. **Root** -Filter will be applied to root nodes only in SfTreeGrid. For other nodes, `IsFiltered` value will be false, and they always will be displayed in view. +Filter will be applied to root nodes only in TreeGrid. For other nodes, `IsFiltered` value will be false, and they always will be displayed in view. **All** -Filter will be applied to all the nodes in SfTreeGrid. If a parent node does not match the filter condition, filter will not be applied for child nodes. Else, filter will be applied to its child nodes also. +Filter will be applied to all the nodes in TreeGrid. If a parent node does not match the filter condition, filter will not be applied for child nodes. Else, filter will be applied to its child nodes also. **Extended** @@ -45,7 +45,7 @@ N> You can change the `FilterLevel` at run time. ## Programmatic filtering -The programmatic filtering can be applied to SfTreeGrid using the following methods: +The programmatic filtering can be applied to TreeGrid using the following methods: * View Filtering * Column Filtering @@ -76,19 +76,19 @@ private void Button_Click(object sender, RoutedEventArgs e) {% endhighlight %} {% endtabs %} -Here, `FilterNodes` delegate filters the data based on Salary. `FilterNodes` delegate is assigned to [SfTreeGrid.View.Filter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_Filter) predicate to filter the tree grid. After that, [SfTreeGrid.View.RefreshFilter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_RefreshFilter) method is called to refresh the nodes. If the node satisfies the filter conditions, true will be returned. Else false will be returned. +Here, `FilterNodes` delegate filters the data based on Salary. `FilterNodes` delegate is assigned to [SfTreeGrid.View.Filter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_Filter) predicate to filter the TreeGrid. After that, [SfTreeGrid.View.RefreshFilter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_RefreshFilter) method is called to refresh the nodes. If the node satisfies the filter conditions, true will be returned. Else false will be returned. -![WPF TreeGrid with Filtering](Filtering_images/wpf-treegrid-filtering.png) +![Filtering](Filtering_images/wpf-treegrid-filtering.png) While filtering, if the node satisfies filter condition, [IsFiltered](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeNode.html#Syncfusion_UI_Xaml_TreeGrid_TreeNode_IsFiltered) property of [TreeNode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeNode.html) will be set as false. Else, it will be true. If `IsFiltered` value is True, the node will not be displayed in view, else it will be displayed in view. -N> SfTreeGrid refreshes the filtering on property change if [SfTreeGrid.LiveNodeUpdateMode ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode)property is set as `AllowDataShaping`. +N> TreeGrid refreshes the filtering on property change if [SfTreeGrid.LiveNodeUpdateMode ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode)property is set as `AllowDataShaping`. You can download the sample from [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/FilteringDemo-587565594). ### Clear filters -You can clear the view filters applied in tree grid by setting the `SfTreeGrid.View.Filter` delegate to null and calling the `SfTreeGrid.View.RefreshFilter` method. +You can clear the view filters applied in TreeGrid by setting the `SfTreeGrid.View.Filter` delegate to null and calling the `SfTreeGrid.View.RefreshFilter` method. {% tabs %} {% highlight c# %} @@ -137,7 +137,7 @@ The [FilterBehavior](https://help.syncfusion.com/cr/wpf/Syncfusion.Data.FilterPr #### Clear filtering -The filters applied to SfTreeGrid can be removed by clearing the `FilterPredicates` added for the columns. This can be achieved using the following methods: +The filters applied to TreeGrid can be removed by clearing the `FilterPredicates` added for the columns. This can be achieved using the following methods: * [SfTreeGrid.ClearFilters](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ClearFilters) - Clears filters for all the columns programmatically. * [SfTreeGrid.ClearFilter(String columnName)](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ClearFilter_System_String_) - Clears the filter for a specific column that has the columnName as MappingName. @@ -185,7 +185,7 @@ this.sfTreeGrid.Columns["FirstName"].FilterPredicates.Add( {% endhighlight %} {% endtabs %} -![WPF TreeGrid Column with Multiple Filter](Filtering_images/wpf-treegrid-multi-filter.png) +![Column with Multiple Filter](Filtering_images/wpf-treegrid-multi-filter.png) #### Filter DateColumn with range between two dates @@ -193,7 +193,7 @@ A [TreeGridDateTimeColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml ## UI filtering -SfTreeGrid provides Excel-like filtering UI and advanced filter UI to filter the data easily. UI filtering can be enabled by setting the [SfTreeGrid.AllowFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowFiltering) property to `true`. This allows to open the filter UI by clicking the filter icon on the column header to filter the nodes. +TreeGrid provides Excel-like filtering UI and advanced filter UI to filter the data easily. UI filtering can be enabled by setting the [SfTreeGrid.AllowFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowFiltering) property to `true`. This allows to open the filter UI by clicking the filter icon on the column header to filter the nodes. The filtering can be enabled or disabled for a specific column by setting the [TreeGridColumn.AllowFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_AllowFiltering) property. @@ -214,7 +214,7 @@ N> `TreeGridColumn.AllowFiltering` has higher priority than the `SfTreeGrid.Allo ### Built-in UI views -The SfTreeGrid provides the following types of filter pop-up modes: +The TreeGrid provides the following types of filter pop-up modes: * Check box filter: Provides Excel-like filter interface with a list of check boxes. @@ -226,11 +226,11 @@ By default, the filter pop-up mode of the column is set to Both. The check box a #### Checkbox filtering UI -![Checkbox Filter in WPF TreeGrid](Filtering_images/wpf-treegrid-checkbox-filter.png) +![Checkbox Filter](Filtering_images/wpf-treegrid-checkbox-filter.png) #### Advanced filtering UI -![Advanced Filter in WPF TreeGrid](Filtering_images/wpf-treegrid-advanced-filter.png) +![Advanced Filter](Filtering_images/wpf-treegrid-advanced-filter.png) ## Changing filter UI for grid @@ -301,7 +301,7 @@ This filtering operation is performed based on the value of [SfTreeGrid.FilterLe Advanced filter UI provides multiple filter options to filter the data easily. Filter menu options are loaded based on advanced filter type by automatically detecting the underlying date type. -The following built-in filter types are supported in SfTreeGrid: +The following built-in filter types are supported in TreeGrid: * Text filter: Loads various menu options to filter the display text effectively. @@ -334,13 +334,13 @@ When the DateTime type value is bound to the {{'[TreeGridColumn](https://help.sy -Displays Text Filter in WPF TreeGrid +Displays Text Filter -Displays Number Filter in WPF TreeGrid +Displays Number Filter -Displays Date Filter in WPF TreeGrid +Displays Date Filter @@ -413,11 +413,11 @@ Here, the OK and Cancel buttons are unavailable and Done button is available to The following screenshot illustrates the check box filter when `ImmediateUpdateColumnFilter` is set to `true`. -![CheckBox Filter with Immediate Filter in WPF TreeGrid](Filtering_images/wpf-treegrid-immediate-checkbox-filter.png) +![CheckBox Filter with Immediate Filter](Filtering_images/wpf-treegrid-immediate-checkbox-filter.png) The following screenshot illustrates the advanced filter when `ImmediateUpdateColumnFilter` is set to `true`. -![Advanced Filter with Immediate Filter in WPF TreeGrid](Filtering_images/wpf-treegrid-immediate-advanced-filter.png) +![Advanced Filter with Immediate Filter](Filtering_images/wpf-treegrid-immediate-advanced-filter.png) N> In check box filter, the `SelectAll` option is not reflected in the filter updates if [ImmediateUpdateColumnFilter](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_ImmediateUpdateColumnFilter) is true. @@ -440,11 +440,11 @@ this.sfTreeGrid.Columns["FirstName"].AllowBlankFilters = true; The following screenshot illustrates the check box filter when `AllowBlankFilters` is set to `true`. -![Filter Null Values using CheckBox Filter in WPF TreeGrid](Filtering_images/wpf-treegrid-filter-null-values.png) +![Filter Null Values using CheckBox Filter](Filtering_images/wpf-treegrid-filter-null-values.png) The following screenshot illustrates advanced filter when `AllowBlankFilters` is set to `true`. -![Filter Null Values using Advanced Filter in WPF TreeGrid](Filtering_images/wpf-treegrid-null-values.png) +![Filter Null Values using Advanced Filter](Filtering_images/wpf-treegrid-null-values.png) ## Changing AdvancedFilter type when loading dynamic ItemsSource @@ -566,7 +566,7 @@ private void OnSfTreeGridFilterItemsPopulating(object sender, TreeGridFilterItem {% endhighlight %} {% endtabs %} -![Customizing Sort Option Text in WPF TreeGrid](Filtering_images/wpf-treegrid-sort-option-customization.png) +![Customizing Sort Option Text](Filtering_images/wpf-treegrid-sort-option-customization.png) ## Appearance @@ -589,7 +589,7 @@ Sort options can be collapsed by setting the [SortOptionVisibility](https://help {% endhighlight %} {% endtabs %} -![Hide Sort Options in WPF TreeGrid](Filtering_images/wpf-treegrid-hide-sort-option.png) +![Hide Sort Options](Filtering_images/wpf-treegrid-hide-sort-option.png) ### Customizing the filter popup size @@ -608,7 +608,7 @@ The size of the filter popup can be changed using the [FilterPopupHeight](https: {% endhighlight %} {% endtabs %} -![Customizing Filter Popup Size in WPF TreeGrid](Filtering_images/wpf-treegrid-filter-popup-customization.png) +![Customizing Filter Popup Size](Filtering_images/wpf-treegrid-filter-popup-customization.png) ### Changing filter icon style after applying filters @@ -719,7 +719,7 @@ The filter icon style can be changed by writing style with TargetType as [Filter {% endhighlight %} {% endtabs %} -![Customizing Filter Icon in WPF TreeGrid](Filtering_images/wpf-treegrid-filter-icon.png) +![Customizing Filter Icon](Filtering_images/wpf-treegrid-filter-icon.png) -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Getting-Started.md b/wpf/TreeGrid/Getting-Started.md index 6e0206af2..303f9247e 100644 --- a/wpf/TreeGrid/Getting-Started.md +++ b/wpf/TreeGrid/Getting-Started.md @@ -1,19 +1,19 @@ --- layout: post -title: Getting Started with WPF SfTreeGrid | Syncfusion® -description: Learn how to get started with the Syncfusion® WPF SfTreeGrid control. Explore setup, features, examples, and customization options. +title: Getting Started with WPF TreeGrid | Syncfusion® +description: Learn how to get started with the Syncfusion® WPF TreeGrid control. Explore setup, features, examples, and customization options. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Getting Started with WPF SfTreeGrid +# Getting Started with WPF TreeGrid -The [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) (SfTreeGrid) is a data oriented control that displays the self-relational and hierarchical data in tree structure with columns. The data can be loaded on-demand also. +The [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) is a data oriented control that displays the self-relational and hierarchical data in tree structure with columns. The data can be loaded on-demand also. ## Assembly Deployment -The following list of assemblies needs to be added as reference to use SfTreeGrid control in any application, +The following list of assemblies needs to be added as reference to use TreeGrid control in any application, @@ -37,8 +37,8 @@ Syncfusion.Data.WPF assembly is dependent assembly for Syncfusion.SfGrid. WPF Syncfusion.SfGrid.WPF @@ -48,12 +48,12 @@ This namespace also added in http://schemas.syncfusion.com/wpf Syncfusion
-Syncfusion.SfGrid.WPF assembly contains classes that handles all UI operations of SfTreeGrid. -SfTreeGrid control present in Syncfusion.UI.Xaml.TreeGrid namespace. +Syncfusion.SfGrid.WPF assembly contains classes that handles all UI operations of TreeGrid. +this control present in Syncfusion.UI.Xaml.TreeGrid namespace. This namespace also added in http://schemas.syncfusion.com/wpf Syncfusion WPF schema. -Syncfusion.Shared.WPF contains various editor controls (such as IntegerTextBox, DoubleTextBox and etc) which are used in SfTreeGrid. +Syncfusion.Shared.WPF contains various editor controls (such as IntegerTextBox, DoubleTextBox and etc) which are used in TreeGrid.
-In order to use export to excel and export to PDF functionalities of SfTreeGrid control, add the reference to following assemblies, +In order to use export to excel and export to PDF functionalities of TreeGrid control, add the reference to following assemblies, @@ -69,7 +69,7 @@ Description Syncfusion.SfGridConverter.WPF @@ -90,16 +90,16 @@ Syncfusion.Pdf.Base contains fundamental and base classes for creating PDF.
-Syncfusion.SfGridConverter.WPF contains static extension classes for exporting SfTreeGrid to excel and PDF in Syncfusion.UI.Xaml.TreeGrid.Converter namespace. +Syncfusion.SfGridConverter.WPF contains static extension classes for exporting TreeGrid to excel and PDF in Syncfusion.UI.Xaml.TreeGrid.Converter namespace.
-### Creating simple application with SfTreeGrid -In this walk through, you will create WPF application with SfTreeGrid control. +### Creating simple application with TreeGrid +In this walk through, you will create WPF application with TreeGrid control. 1. [Creating project](#creating-the-project) 2. [Adding control via Designer](#adding-control-via-designer) 3. [Adding control manually in XAML](#adding-control-manually-in-xaml) 4. [Adding control manually in C#](#adding-control-manually-in-c) -5. [Binding self-relational data in SfTreeGrid](#binding-self-relational-data-in-sftreegrid) -6. [Binding nested collection with SfTreeGrid](#binding-nested-collection-with-sftreegrid) -7. [Populate SfTreeGrid in on-demand](https://help.syncfusion.com/wpf/treegrid/load-on-demand) +5. [Binding self-relational data in TreeGrid](#binding-self-relational-data-in-sftreegrid) +6. [Binding nested collection with TreeGrid](#binding-nested-collection-with-sftreegrid) +7. [Populate TreeGrid in on-demand](https://help.syncfusion.com/wpf/treegrid/load-on-demand) 8. [Defining Columns](#defining-columns) 9. [Selection](#selection) 10. [Sorting](#sorting) @@ -109,12 +109,12 @@ In this walk through, you will create WPF application with SfTreeGrid control. #### Creating the project -Create new WPF project in Visual Studio to display SfTreeGrid with data objects. +Create new WPF project in Visual Studio to display TreeGrid with data objects. #### Adding control via Designer -WPF TreeGrid (SfTreeGrid) control can be added to the application by dragging it from Toolbox and dropping it in Designer view. The required assembly references will be added automatically. -![Dragging WPF TreeGrid from Toolbox to Designer](Getting-Started_images/wpf-treegrid-toolbox.png) +WPF TreeGrid control can be added to the application by dragging it from Toolbox and dropping it in Designer view. The required assembly references will be added automatically. +![Dragging from Toolbox to Designer](Getting-Started_images/wpf-treegrid-toolbox.png) #### Adding control manually in XAML In order to add control manually in XAML, do the below steps, @@ -123,8 +123,8 @@ In order to add control manually in XAML, do the below steps, * Syncfusion.Data.WPF * Syncfusion.SfGrid.WPF * Syncfusion.Shared.WPF -2. Import Syncfusion® WPF schema **http://schemas.syncfusion.com/wpf** or SfTreeGrid control namespace **Syncfusion.UI.Xaml.TreeGrid** in XAML page. -3. Declare SfTreeGrid control in XAML page. +2. Import Syncfusion® WPF schema **http://schemas.syncfusion.com/wpf** or TreeGrid control namespace **Syncfusion.UI.Xaml.TreeGrid** in XAML page. +3. Declare TreeGrid control in XAML page. {% capture codesnippet1 %} {% tabs %} @@ -153,8 +153,8 @@ To add control manually in C#, do the below steps, * Syncfusion.Data.WPF * Syncfusion.SfGrid.WPF * Syncfusion.Shared.WPF -2. Import SfTreeGrid namespace **Syncfusion.UI.Xaml.TreeGrid**. -3. Create SfTreeGrid control instance and add it to the Page. +2. Import TreeGrid namespace **Syncfusion.UI.Xaml.TreeGrid**. +3. Create TreeGrid control instance and add it to the Page. {% capture codesnippet2 %} {% tabs %} @@ -180,9 +180,9 @@ namespace WpfApplication1 {{ codesnippet2 | OrderList_Indent_Level_1 }} -#### Binding self-relational data in SfTreeGrid +#### Binding self-relational data in TreeGrid -WPF TreeGrid (SfTreeGrid) supports to bind self-relational data by setting [SfTreeGrid.ParentPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) properties where tree structure is formed based on these two properties. +WPF TreeGrid supports to bind self-relational data by setting [SfTreeGrid.ParentPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) properties where tree structure is formed based on these two properties. `SfTreeGrid.ParentPropertyName` – Denotes the property in data object which is used to identify the root nodes. `SfTreeGrid.ChildPropertyName` - Denotes the property in data object which is used identify its parent by matching the property value with `ParentPropertyName` property value of other data objects. @@ -191,7 +191,7 @@ The data objects which has unique property value in `SfTreeGrid.ParentPropertyNa #### Creating Data Model for self-relational collection -SfTreeGrid is a data-bound control. So, before binding to the control, you must create data model for application. +TreeGrid is a data-bound control. So, before binding to the control, you must create data model for application. 1. Creating data object class named `EmployeeInfo` and declare properties as shown below, @@ -330,7 +330,7 @@ private ObservableCollection GetEmployees() #### Binding to Data -To bind the SfTreeGrid to data, set [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property to an IEnumerable of implementation and to form tree structure from self-relational data, set [SfTreeGrid.ParentPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) properties. Each row is SfTreeGrid is bound to an object in ItemsSource and each column is bound to a property in data object. +To bind the TreeGrid to data, set [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property to an IEnumerable of implementation and to form tree structure from self-relational data, set [SfTreeGrid.ParentPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) properties. Each row is TreeGrid is bound to an object in ItemsSource and each column is bound to a property in data object. Bind the self-relations collection created in the previous step to `SfTreeGrid.ItemsSource` property and set `ParentPropertyName` as `ID` and `ChildPropertyName` as `ReportsTo` to form the tree structure as shown below, @@ -386,11 +386,11 @@ namespace GettingStarted {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Binding Data](Getting-Started_images/wpf-treegrid-binding-data.png) +[with Binding Data](Getting-Started_images/wpf-treegrid-binding-data.png) -### Binding Nested collection with SfTreeGrid +### Binding Nested collection with TreeGrid -WPF TreeGrid (SfTreeGrid) supports to bind nested or hierarchical collection (where each data object has hierarchy within) by setting the property name to [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) which holds the child collection. +WPF TreeGrid supports to bind nested or hierarchical collection (where each data object has hierarchy within) by setting the property name to [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) which holds the child collection. #### Creating Data Model for nested collection @@ -491,7 +491,7 @@ public class ViewModel #### Binding to Data -To bind the SfTreeGrid to data, set ItemsSource property to an IEnumerable of implementation and to form tree structure from nested collection data, set [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName). Each row in SfTreeGrid is bound to an object in ItemsSource and each column is bound to a property in data object. +To bind the TreeGrid to data, set ItemsSource property to an IEnumerable of implementation and to form tree structure from nested collection data, set [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName). Each row is bound to an object in ItemsSource and each column is bound to a property in data object. Bind the nested collection created in the previous step to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property and set `ChildPropertyName` as `Children` to form the tree structure as shown below, {% tabs %} @@ -538,11 +538,11 @@ namespace NestedCollectionDemo } {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Nested Collection](Getting-Started_images/wpf-treegrid-nested-collection.png) +![Nested Collection](Getting-Started_images/wpf-treegrid-nested-collection.png) ### Defining Columns -By default, the WPF TreeGrid (SfTreeGrid) control generates the columns automatically when value assigned to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property. The type of the column generated depends on the type of data in the column and the attribute of the property the column bound with. +By default, the WPF TreeGrid control generates the columns automatically when value assigned to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property. The type of the column generated depends on the type of data in the column and the attribute of the property the column bound with. The following table lists the column types and its constraints for auto column generation. @@ -612,7 +612,7 @@ Property of type Uri
-When columns are auto-generated, you can handle the [SfTreeGrid.AutoGeneratingColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoGeneratingColumn) event to customize or cancel the columns before they are added to the SfTreeGrid. +When columns are auto-generated, you can handle the [SfTreeGrid.AutoGeneratingColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoGeneratingColumn) event to customize or cancel the columns before they are added to the TreeGrid. You can prevent the automatic column generation by setting [SfTreeGrid.AutoGenerateColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AutoGenerateColumns) property to false. When `SfTreeGrid.AutoGenerateColumns` property is false, you should define the columns to be displayed as below, {% tabs %} @@ -634,7 +634,7 @@ You can prevent the automatic column generation by setting [SfTreeGrid.AutoGener {% endhighlight %} {% endtabs %} -Below is the list of column types provided in SfTreeGrid. +Below is the list of column types provided in TreeGrid. @@ -657,7 +657,7 @@ Represents SfTreeGrid column that hosts textual content in its cells. {{'[TreeGridNumericColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridNumericColumn.html)'| markdownify }} @@ -665,7 +665,7 @@ Represents SfTreeGrid column that hosts {{'[DoubleTextBox](https://help.syncfusi {{'[TreeGridDateTimeColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDateTimeColumn.html)'| markdownify }} @@ -673,7 +673,7 @@ Represents SfTreeGrid column that hosts {{'[DateTimeEdit](https://help.syncfusio {{'[TreeGridComboBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridComboBoxColumn.html)'| markdownify }} @@ -681,7 +681,7 @@ Represents SfTreeGrid column that hosts `ComboBox`control in its cells. {{'[TreeGridCheckBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCheckBoxColumn.html)'| markdownify }} @@ -689,7 +689,7 @@ Represents SfTreeGrid column that hosts `CheckBox` control in its cells. {{'[TreeGridMaskColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridMaskColumn.html)'| markdownify }} @@ -697,7 +697,7 @@ Represents SfTreeGrid column that hosts `MaskedTextBox` control in its cells wh {{'[TreeGridCurrencyColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrencyColumn.html)'| markdownify }} @@ -706,7 +706,7 @@ Represents SfTreeGrid column that hosts {{'[TreeGridPercentColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridPercentColumn.html)'| markdownify }} @@ -714,7 +714,7 @@ Represents SfTreeGrid column that hosts {{'[PercentTextBox](https://help.syncfus {{'[TreeGridHyperlinkColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridHyperlinkColumn.html)'| markdownify }} @@ -722,19 +722,19 @@ Represents SfTreeGrid column that hosts `HyperLink` control in its cells. {{'[TreeGridTemplateColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridTemplateColumn.html)'| markdownify }}
@@ -649,7 +649,7 @@ Comments {{'[TreeGridTextColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridTextColumn.html)'| markdownify }} -Represents SfTreeGrid column that hosts textual content in its cells. +Represents TreeGrid column that hosts textual content in its cells.
-Represents SfTreeGrid column that hosts {{'[DoubleTextBox](https://help.syncfusion.com/wpf/double-textbox/overview)'| markdownify }} control in its cells which is used to format and display Numeric values. +Represents TreeGrid column that hosts {{'[DoubleTextBox](https://help.syncfusion.com/wpf/double-textbox/overview)'| markdownify }} control in its cells which is used to format and display Numeric values.
-Represents SfTreeGrid column that hosts {{'[DateTimeEdit](https://help.syncfusion.com/wpf/datetimepicker/overview)'| markdownify }} control in its cells which is used to display and format DateTime values. +Represents TreeGrid column that hosts {{'[DateTimeEdit](https://help.syncfusion.com/wpf/datetimepicker/overview)'| markdownify }} control in its cells which is used to display and format DateTime values.
-Represents SfTreeGrid column that hosts `ComboBox`control in its cells. +Represents TreeGrid column that hosts `ComboBox`control in its cells.
-Represents SfTreeGrid column that hosts `CheckBox` control in its cells. +Represents TreeGrid column that hosts `CheckBox` control in its cells.
-Represents SfTreeGrid column that hosts `MaskedTextBox` control in its cells which is used to display textual content by applying Mask. +Represents TreeGrid column that hosts `MaskedTextBox` control in its cells which is used to display textual content by applying Mask.
-Represents SfTreeGrid column that hosts +Represents TreeGrid column that hosts {{'[CurrencyTextBox](https://help.syncfusion.com/wpf/currency-textbox/overview)'| markdownify }} control in its cells which is used to display numeric values with currency format.
-Represents SfTreeGrid column that hosts {{'[PercentTextBox](https://help.syncfusion.com/wpf/percent-textbox/overview)'| markdownify }} control in its cells which is used to display numeric values with percent format. +Represents TreeGrid column that hosts {{'[PercentTextBox](https://help.syncfusion.com/wpf/percent-textbox/overview)'| markdownify }} control in its cells which is used to display numeric values with percent format.
-Represents SfTreeGrid column that hosts `HyperLink` control in its cells. +Represents TreeGrid column that hosts `HyperLink` control in its cells.
-Represents SfTreeGrid column that hosts template-specified content in its cells +Represents TreeGrid column that hosts template-specified content in its cells
### Selection -By default, the entire row is selected when a user clicks a cell in a SfTreeGrid. You can set the [SfTreeGrid.SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property to specify whether a user can select single row or cell, or multiple rows or cells. +By default, the entire row is selected when a user clicks a cell in a TreeGrid. You can set the [SfTreeGrid.SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property to specify whether a user can select single row or cell, or multiple rows or cells. You can handle the selection operations with the help of [SfTreeGrid.SelectionChanging](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionChanging) and [SfTreeGrid.SelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionChanged) events. ### Sorting -By default, you can sort columns in a SfTreeGrid by clicking the column header. You can configure the sorting by setting [SfTreeGrid.SortColumnDescriptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SortColumnDescriptions) property. +By default, you can sort columns in a TreeGrid by clicking the column header. You can configure the sorting by setting [SfTreeGrid.SortColumnDescriptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SortColumnDescriptions) property. You can customize sorting by handling the [SfTreeGrid.SortColumnsChanging](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortColumnsChanging) and [SfTreeGrid.SortColumnsChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortColumnsChanged) events. To cancel the default sort, set the Cancel property to true in `SfTreeGrid.SortColumnsChanging` event. ### Editing @@ -743,19 +743,19 @@ Editing can be enabled by setting [SfTreeGrid.AllowEditing](https://help.syncfus ### Filtering -Filtering can be enabled by setting the [SfTreeGrid.AllowFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowFiltering) property to true, where advanced filter UI can be opened by clicking the filter icon in column header to filter the nodes in SfTreeGrid. The filtering operations can be customized by handling the [SfTreeGrid.FilterChanging](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_FilterChanging) and [SfTreeGrid.FilterChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_FilterChanged) events. +Filtering can be enabled by setting the [SfTreeGrid.AllowFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowFiltering) property to true, where advanced filter UI can be opened by clicking the filter icon in column header to filter the nodes in TreeGrid. The filtering operations can be customized by handling the [SfTreeGrid.FilterChanging](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_FilterChanging) and [SfTreeGrid.FilterChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_FilterChanged) events. -![WPF TreeGrid with Filtering](Getting-Started_images/wpf-treegrid-filter.png) +![with Filtering](Getting-Started_images/wpf-treegrid-filter.png) ## Theme -SfTreeGrid supports various built-in themes. Refer to the below links to apply themes for the SfTreeGrid, +TreeGrid supports various built-in themes. Refer to the below links to apply themes, * [Apply theme using SfSkinManager](https://help.syncfusion.com/wpf/themes/skin-manager) * [Create a custom theme using ThemeStudio](https://help.syncfusion.com/wpf/themes/theme-studio#creating-custom-theme) - ![Applying Theme in WPF TreeGrid](Getting-Started_images/wpf-treegrid-theme.png) + ![Applying Theme](Getting-Started_images/wpf-treegrid-theme.png) - N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file + N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/GridLines.md b/wpf/TreeGrid/GridLines.md index 36d00babc..7347ff52c 100644 --- a/wpf/TreeGrid/GridLines.md +++ b/wpf/TreeGrid/GridLines.md @@ -1,15 +1,15 @@ --- layout: post -title: Grid Lines in WPF SfTreeGrid | Syncfusion® -description: Customize grid lines in SfTreeGrid to show vertical, horizontal, or both borders for cells and header cells. +title: Grid Lines in WPF TreeGrid | Syncfusion® +description: Customize grid lines in TreeGrid to show vertical, horizontal, or both borders for cells and header cells. platform: wpf control: TreeGrid documentation: ug --- -# Grid Lines in WPF SfTreeGrid +# Grid Lines in WPF TreeGrid -SfTreeGrid allows you to customize the grid lines visibility to vertical, horizontal, both or none. To achieve this, use the following properties. +WPF TreeGrid allows you to customize the grid lines visibility to vertical, horizontal, both or none. To achieve this, use the following properties. [SfTreeGrid.GridLinesVisibility](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_GridLinesVisibility): To set the border lines for the cells other than header and stacked header cells. [SfTreeGrid.HeaderLinesVisibility](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_HeaderLinesVisibility): To set the border lines only for header and stacked header cells. @@ -45,7 +45,7 @@ this.sfTreeGrid.GridLinesVisibility = GridLinesVisibility.Both; {% endhighlight %} {% endtabs %} -![GridLinesVisibility in WPF TreeGrid](GridLines_images/GridLines_image1.png) +![GridLinesVisibility](GridLines_images/GridLines_image1.png) ### Horizontal @@ -69,7 +69,7 @@ this.sfTreeGrid.GridLinesVisibility = GridLinesVisibility.Horizontal; {% endhighlight %} {% endtabs %} -![Horizontal GridLinesVisibility in WPF TreeGrid](GridLines_images/GridLines_image2.png) +![Horizontal GridLinesVisibility](GridLines_images/GridLines_image2.png) ### Vertical @@ -93,7 +93,7 @@ this.sfTreeGrid.GridLinesVisibility = GridLinesVisibility.Vertical; {% endhighlight %} {% endtabs %} -![Vertical GridLinesVisibility in WPF TreeGrid](GridLines_images/GridLines_image3.png) +![Vertical GridLinesVisibility](GridLines_images/GridLines_image3.png) ### None [GridLinesVisibility.None](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridLinesVisibility.html#Syncfusion_UI_Xaml_Grid_GridLinesVisibility_None) displays the TreeGrid without grid lines. @@ -116,7 +116,7 @@ this.sfTreeGrid.GridLinesVisibility = GridLinesVisibility.None; {% endhighlight %} {% endtabs %} -![None GridLinesVisibility in WPF TreeGrid](GridLines_images/GridLines_image4.png) +![None GridLinesVisibility](GridLines_images/GridLines_image4.png) ## Header rows @@ -139,11 +139,11 @@ this.sfTreeGrid.HeaderLinesVisibility = GridLinesVisibility.Horizontal; {% endhighlight %} {% endtabs %} -![Horizontal HeaderLinesVisibility in WPF TreeGrid](GridLines_images/GridLines_image5.png) +![Horizontal HeaderLinesVisibility](GridLines_images/GridLines_image5.png) ## Limitations * Grid lines customization is not supported for RowHeader. -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Helpers.md b/wpf/TreeGrid/Helpers.md index 86b492776..7423bdabe 100644 --- a/wpf/TreeGrid/Helpers.md +++ b/wpf/TreeGrid/Helpers.md @@ -1,17 +1,17 @@ --- layout: post -title: Helpers in WPF SfTreeGrid | Syncfusion® -description: Helpers in SfTreeGrid provides helper classes and methods to customize grid behavior, access grid elements, and simplify development tasks. +title: Helpers in WPF TreeGrid | Syncfusion® +description: Helpers in TreeGrid provides helper classes and methods to customize grid behavior, access grid elements, and simplify development tasks. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Helpers in WPF SfTreeGrid +# Helpers in WPF TreeGrid ## IndexResolver -SfTreeGrid has [TreeGridIndexResolver](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridIndexResolver.html) static class present in the Syncfusion.UI.Xaml.TreeGrid namespace has some extension methods to resolve from row or column index to node or visible column index and vice-versa. +TreeGrid has [TreeGridIndexResolver](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridIndexResolver.html) static class present in the Syncfusion.UI.Xaml.TreeGrid namespace has some extension methods to resolve from row or column index to node or visible column index and vice-versa. For example, you can get a node from its row index using the [GetNodeAtRowIndex](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridIndexResolver.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridIndexResolver_GetNodeAtRowIndex_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_System_Int32_) method. @@ -120,7 +120,7 @@ Gets the tree node based on the row index. ## Dispose -This method is associated with relinquishes memory and clears all references associated with treegrid. When you call this method, it releases all references for treegrid. So, the memory occupied using treegrid is reclaimed. You should call the [SfTreeGrid.Dispose](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Dispose_System_Boolean_) method to release the memory. +This method is associated with relinquishes memory and clears all references associated with TreeGrid. When you call this method, it releases all references. So, the memory occupied is reclaimed. You should call the [SfTreeGrid.Dispose](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Dispose_System_Boolean_) method to release the memory. -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Interactive-Features.md b/wpf/TreeGrid/Interactive-Features.md index 43233956f..dc4ac8280 100644 --- a/wpf/TreeGrid/Interactive-Features.md +++ b/wpf/TreeGrid/Interactive-Features.md @@ -1,17 +1,17 @@ --- layout: post -title: Interactive Features in WPF SfTreeGrid | Syncfusion® -description: Interactive features in SfTreeGrid enhance usability by offering context menus, drag‑and‑drop, tooltips, and flexible customization. +title: Interactive Features in WPF TreeGrid | Syncfusion® +description: Interactive features in TreeGrid enhance usability by offering context menus, drag‑and‑drop, tooltips, and flexible customization. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Interactive Features in WPF SfTreeGrid +# Interactive Features in WPF TreeGrid ## Context menu -SfTreeGrid provides an entirely customizable menu to expose the functionalities on user interface. You can create context menus for different rows in an efficient manner. +TreeGrid provides an entirely customizable menu to expose the functionalities on user interface. You can create context menus for different rows in an efficient manner. The following code sample shows the context menu with command bindings. @@ -121,7 +121,7 @@ public class EmployeeInfoViewModel : INotifyPropertyChanged ### ContextMenu based on rows -You can set different context menus to SfTreeGrid based on rows. +You can set different context menus to TreeGrid based on rows. #### ContextMenu for nodes @@ -150,7 +150,7 @@ this.treeGrid.RecordContextMenu.Items.Add(new MenuItem() { Header = "Paste" }); {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays ContextMenu for Nodes](ContextMenu_images/wpf-treegrid-node-contextmenu.png) +![displays ContextMenu for Nodes](ContextMenu_images/wpf-treegrid-node-contextmenu.png) When binding the menu item using CommandBinding, you can get the command parameter as [TreeGridNodeContextMenuInfo](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridNodeContextMenuInfo.html), which contains nodes of the corresponding row. @@ -207,7 +207,7 @@ this.treeGrid.HeaderContextMenu.Items.Add(new MenuItem() { Header = "ClearFilter {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays ContextMenu for Header](ContextMenu_images/wpf-treegrid-header-contextmenu.png) +![displays ContextMenu for Header](ContextMenu_images/wpf-treegrid-header-contextmenu.png) When binding the menu item using CommandBinding, you can get the parameter as [TreeGridColumnContextMenuInfo](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumnContextMenuInfo.html), which contains a particular GridColumn. @@ -289,7 +289,7 @@ When binding the menu item using CommandBinding, you can get the parameter as [T ### Events -The [TreeGridContextMenuOpening](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when opening the context menu in SfTreeGrid. [TreeGridContextMenuEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html#Syncfusion_SfGrid_WPF__ctor) has the following members, which provide information about the TreeGridContextMenuOpening event: +The [TreeGridContextMenuOpening](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when opening the context menu in TreeGrid. [TreeGridContextMenuEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html#Syncfusion_SfGrid_WPF__ctor) has the following members, which provide information about the TreeGridContextMenuOpening event: [ContextMenu](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridContextMenuEventArgs__ctor_System_Windows_Controls_ContextMenu_System_Object_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_Syncfusion_UI_Xaml_TreeGrid_ContextMenuType_System_Object_) – Gets the corresponding context menu. [ContextMenuInfo](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridContextMenuEventArgs_ContextMenuInfo) – Returns the context menu info based on the row that opens the context menu. @@ -342,7 +342,7 @@ void dataGrid_ TreeGridContextMenuOpening (object sender, TreeGridContextMenuEve {% endhighlight %} {% endtabs %} -![Customizing ContextMenu in WPF TreeGrid](ContextMenu_images/wpf-treegrid-contextmenu-customization.png) +![Customizing ContextMenu](ContextMenu_images/wpf-treegrid-contextmenu-customization.png) #### Changing background to ContextMenu @@ -365,12 +365,12 @@ You can change the appearance of the context menu by customizing the style with {% endhighlight %} {% endtabs %} -![Changing Background of WPF TreeGrid ContextMenu](ContextMenu_images/wpf-treegrid-contextmenu-background.png) +![Changing Background ContextMenu](ContextMenu_images/wpf-treegrid-contextmenu-background.png) ## Drag and drop row -SfTreeGrid allows drag and drop the rows within and between controls by setting the [AllowDraggingRows](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowDraggingRows) and [AllowDrop](https://learn.microsoft.com/en-us/dotnet/api/system.windows.uielement.allowdrop?view=windowsdesktop-8.0&viewFallbackFrom=net-5.0&redirectedfrom=MSDN#System_Windows_UIElement_AllowDrop) properties to true. It is also possible to drag and drop the rows between treegrid and other controls such as ListView and TreeView. SfTreeGrid allows dropping rows when `AllowDrop` is true and allows dragging when `AllowDraggingRows` is true. +TreeGrid allows drag and drop the rows within and between controls by setting the [AllowDraggingRows](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowDraggingRows) and [AllowDrop](https://learn.microsoft.com/en-us/dotnet/api/system.windows.uielement.allowdrop?view=windowsdesktop-8.0&viewFallbackFrom=net-5.0&redirectedfrom=MSDN#System_Windows_UIElement_AllowDrop) properties to true. It is also possible to drag and drop the rows between TreeGrid and other controls such as ListView and TreeView. It allows dropping rows when `AllowDrop` is true and allows dragging when `AllowDraggingRows` is true. {% tabs %} {% highlight xml %} @@ -389,23 +389,23 @@ sfTreeGrid.AllowDrop = true; {% endhighlight %} {% endtabs %} -![Drag and Drop the Row in WPF TreeGrid](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop.jpeg) +![Drag and Drop the Row](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop.jpeg) When dropping, the dragged node(s) can be added above or below as a child node based on its drop position. For example, if you dropped node at the bottom of the targeted node, it will be added below the targeted node. If you drop over the targeted node, it will be added as a child of that targeted node. -![Drap and Drop the Row in WPF TreeGrid](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-child-row.jpeg) +![Drap and Drop the Row](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-child-row.jpeg) N> Drag indicators will not be shown when drop position is set to “Drop as child”. ### Drag multiple nodes -SfTreeGrid allows users to drag multiple selected nodes. You can enable multiple selection by setting the [SfTreeGrid.SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property to `Multiple` or `Extended`. +TreeGrid allows users to drag multiple selected nodes. You can enable multiple selection by setting the [SfTreeGrid.SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property to `Multiple` or `Extended`. -![Dragging Multiple Rows in WPF TreeGrid](Row-Drag-and-Drop_images/wpf-treegrid-drag-multiple-rows.jpeg) +![Dragging Multiple Rows](Row-Drag-and-Drop_images/wpf-treegrid-drag-multiple-rows.jpeg) ### Events -SfTreeGrid triggers the following events when drag and drop: +TreeGrid triggers the following events when drag and drop: ### DragStart @@ -516,9 +516,9 @@ private void RowDragDropController_Dropped(object sender, Syncfusion.UI.Xaml.Tre {% endhighlight %} {% endtabs %} -### Drag and drop between SfTreeGrid and other controls +### Drag and drop between TreeGrid and other controls -#### Drag and drop between ListView and SfTreeGrid +#### Drag and drop between ListView and TreeGrid You can drag and drop the items between list view and treegrid by wiring the [Drop](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowDragDropController_Drop) event from the [TreeGridRowDragDropController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html) class. @@ -698,9 +698,9 @@ private void ListView_PreviewMouseMove(object sender, System.Windows.Input.Mouse Sample for dragging and dropping the items between list view and treegrid: [Sample](https://github.com/SyncfusionExamples/how-to-drag-and-drop-rows-in-wpf-between-listview-and-treegrid). -![Drag and Drop between WPF TreeGrid and Listview Controls](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-between-controls.jpeg) +![Drag and Drop between and Listview Controls](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-between-controls.jpeg) -#### Drag and drop between TreeViewAdv and SfTreeGrid +#### Drag and drop between TreeViewAdv and TreeGrid You can drag and drop the items between tree view and treegrid by wiring the [Drop](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowDragDropController_Drop) and [DragStart](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowDragDropController_DragStart) events from the [TreeGridRowDragDropController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html) class. @@ -858,9 +858,9 @@ private void Treeview_Drop(object sender, DragEventArgs e) {% endhighlight %} {% endtabs %} -Sample for dragging and dropping between TreeViewAdv and SfTreeGrid: [Sample](https://github.com/SyncfusionExamples/how-to-drag-and-drop-rows-in-wpf-between-treegrid-and-treeviewadv). +Sample for dragging and dropping between TreeViewAdv and TreeGrid: [Sample](https://github.com/SyncfusionExamples/how-to-drag-and-drop-rows-in-wpf-between-treegrid-and-treeviewadv). -![Drag and Drop between WPF TreeGrid and TreeViewAdv controls](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-with-treeview.jpeg) +![Drag and Drop between and TreeViewAdv controls](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-with-treeview.jpeg) ### Changing the row drop indicator @@ -886,11 +886,11 @@ sfTreeGrid.RowDropIndicatorMode = Syncfusion.UI.Xaml.Grid.DropIndicatorMode.Line {% endhighlight %} {% endtabs %} -![Changing Row Drop Indicator of WPF TreeGrid](Row-Drag-and-Drop_images/wpf-treegrid-row-drop-indicator.png) +![Changing Row Drop Indicator](Row-Drag-and-Drop_images/wpf-treegrid-row-drop-indicator.png) ### Customizing drag-and-drop rows -SfTreeGrid processes row drag and drop operations in [TreeGridRowDragDropController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html) class. You can customize the row drag-and-drop operations using the events in the [SfTreeGrid.RowDragDropController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html). +TreeGrid processes row drag and drop operations in [TreeGridRowDragDropController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html) class. You can customize the row drag-and-drop operations using the events in the [SfTreeGrid.RowDragDropController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html). ### Auto expand the node on drag over @@ -905,7 +905,7 @@ treeGrid.RowDragDropController.AutoExpandDelay = new TimeSpan(0, 0, 2); ### Customize default drag UI -SfTreeGrid provides the default UI for drag and drop. However, you can customize the drag UI using the [RowDragDropTemplate](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RowDragDropTemplate) property. +TreeGrid provides the default UI for drag and drop. However, you can customize the drag UI using the [RowDragDropTemplate](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RowDragDropTemplate) property. {% tabs %} {% highlight xml %} @@ -969,7 +969,7 @@ SfTreeGrid provides the default UI for drag and drop. However, you can customize {% endhighlight %} {% endtabs %} -![Customizing Drag and Drop Window in WPF TreeGrid](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-customization.jpeg) +![Customizing Drag and Drop Window](Row-Drag-and-Drop_images/wpf-treegrid-drag-and-drop-customization.jpeg) ### Disable dragging of certain nodes @@ -1017,4 +1017,4 @@ private void RowDragDropController_DragOver(object sender, TreeGridRowDragOverEv {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Load-On-Demand.md b/wpf/TreeGrid/Load-On-Demand.md index 19524661f..586bb54db 100644 --- a/wpf/TreeGrid/Load-On-Demand.md +++ b/wpf/TreeGrid/Load-On-Demand.md @@ -1,19 +1,19 @@ --- layout: post -title: Load On Demand in WPF SfTreeGrid | Syncfusion® -description: Load SfTreeGrid child nodes on demand to improve performance when working with large hierarchical data sources. +title: Load On Demand in WPF TreeGrid | Syncfusion® +description: Load TreeGrid child nodes on demand to improve performance when working with large hierarchical data sources. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Load On Demand in WPF SfTreeGrid +# Load On Demand in WPF TreeGrid -SfTreeGrid supports to load the data in on-demand. It helps to load the child items from services when end-user expands the node. This can be achieved by using the [SfTreeGrid.LoadOnDemandCommand](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LoadOnDemandCommand) command or [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event as follows. +WPF TreeGrid supports to load the data in on-demand. It helps to load the child items from services when end-user expands the node. This can be achieved by using the [SfTreeGrid.LoadOnDemandCommand](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LoadOnDemandCommand) command or [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event as follows. ## Load on demand using command -SfTreeGrid allows you to load child items only when they are requested to load on-demand. Initially populate the root Nodes by assigning `SfTreeGrid.ItemsSource` and then when any node is expanded, child items can be loaded using [SfTreeGrid.LoadOnDemandCommand](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LoadOnDemandCommand). +TreeGrid allows you to load child items only when they are requested to load on-demand. Initially populate the root Nodes by assigning `SfTreeGrid.ItemsSource` and then when any node is expanded, child items can be loaded using [SfTreeGrid.LoadOnDemandCommand](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LoadOnDemandCommand). {% tabs %} @@ -219,7 +219,7 @@ class LoadCommand : ICommand ### Handling expander visibility -SfTreeGrid shows the expander for a particular node based on return value of [CanExecute](https://docs.microsoft.com/en-us/dotnet/api/system.windows.input.icommand.canexecute?view=netframework-4.8) method of `LoadOnDemandCommand`. If `CanExecute` returns `true`, then expander icon is displayed for that node. If `CanExecute` returns `false`, then expander icon will not displayed for that node. `CanExecute` method gets called to decide the visibility of expander icon and before executing `LoadOnDemandCommand`. +TreeGrid shows the expander for a particular node based on return value of [CanExecute](https://docs.microsoft.com/en-us/dotnet/api/system.windows.input.icommand.canexecute?view=netframework-4.8) method of `LoadOnDemandCommand`. If `CanExecute` returns `true`, then expander icon is displayed for that node. If `CanExecute` returns `false`, then expander icon will not displayed for that node. `CanExecute` method gets called to decide the visibility of expander icon and before executing `LoadOnDemandCommand`. {% tabs %} {% highlight c# %} @@ -258,10 +258,10 @@ N> [View Sample in GitHub](https://github.com/SyncfusionExamples/How-to-load-dat ## Load on demand using event -SfTreeGrid supports to load the data in on-demand through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event. `RequestTreeItems` event is triggered at the time of loading and when user expand any node at runtime. SfTreeGrid gets the root and leaf nodes through this event handler. -`TreeGridRequestTreeItemsEventArgs.ParentItem` denotes the data object looking for its child nodes. If it is null, it denotes SfTreeGrid requesting root nodes. +TreeGrid supports to load the data in on-demand through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event. `RequestTreeItems` event is triggered at the time of loading and when user expand any node at runtime. Control gets the root and leaf nodes through this event handler. +`TreeGridRequestTreeItemsEventArgs.ParentItem` denotes the data object looking for its child nodes. If it is null, it denotes TreeGrid requesting root nodes. -In the below example SfTreeGrid is populated through `SfTreeGrid.RequestTreeItems` instead of setting [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource). +In the below example TreeGrid is populated through `SfTreeGrid.RequestTreeItems` instead of setting [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource). {% tabs %} @@ -404,16 +404,16 @@ public class ViewModel {% endhighlight %} {% endtabs %} -You can let SfTreeGrid to populate the data at runtime by calling [SfTreeGrid.RepopulateTree](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RepopulateTree) method. -![WPF TreeGrid Load Items in on-demand - TreeGrid Lazy Loading](Getting-Started_images/wpf-treegrid-on-demand-load.gif) +You can let TreeGrid to populate the data at runtime by calling [SfTreeGrid.RepopulateTree](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RepopulateTree) method. +[Load Items in on-demand - TreeGrid Lazy Loading](Getting-Started_images/wpf-treegrid-on-demand-load.gif) N> [View Sample in GitHub](https://github.com/SyncfusionExamples/How-to-load-data-on-demand-using-events-in-wpf-treegrid). ## Asynchronous load on demand using event -The SfTreeGrid supports loading data asynchronously on-demand by using the [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. This event enables you to fetch both parent and child items asynchronously. +The TreeGrid supports loading data asynchronously on-demand by using the [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. This event enables you to fetch both parent and child items asynchronously. -In the following example, the SfTreeGrid retrieves parent and child nodes asynchronously by using the `RequestTreeItems` event.  +In the following example, the TreeGrid retrieves parent and child nodes asynchronously by using the `RequestTreeItems` event.  {% tabs %} {% highlight c# %} @@ -565,6 +565,6 @@ public class ViewModel {% endhighlight %} {% endtabs %} -![WPF TreeGrid Asynchronous Load on demand support](Getting-Started_images/wpf-treegrid-async-on-demand-load.gif) +![Asynchronous Load on demand support](Getting-Started_images/wpf-treegrid-async-on-demand-load.gif) -N> Refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to learn how to render and configure the treegrid. +N> Refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [example](https://github.com/syncfusion/wpf-demos) to learn how to render and configure the control. diff --git a/wpf/TreeGrid/Localization.md b/wpf/TreeGrid/Localization.md index 6f64cf491..f4f450909 100644 --- a/wpf/TreeGrid/Localization.md +++ b/wpf/TreeGrid/Localization.md @@ -1,14 +1,14 @@ --- layout: post -title: Localization in WPF SfTreeGrid | Syncfusion® -description: Localization in SfTreeGrid customizes grid content to support multiple languages and regional settings for global usability. +title: Localization in WPF TreeGrid | Syncfusion® +description: Localization in TreeGrid customizes grid content to support multiple languages and regional settings for global usability. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Localization in WPF SfTreeGrid +# Localization in WPF TreeGrid -Localization is the process of translating the application resources into different language for the specific cultures. You can localize the treegrid by [adding resource file](https://learn.microsoft.com/en-us/previous-versions/visualstudio/visual-studio-2010/aa992030(v=vs.100)). Application culture can be changed by setting `CurrentUICulture` before InitializeComponent method. +Localization is the process of translating the application resources into different language for the specific cultures. You can localize the TreeGrid by [adding resource file](https://learn.microsoft.com/en-us/previous-versions/visualstudio/visual-studio-2010/aa992030(v=vs.100)). Application culture can be changed by setting `CurrentUICulture` before InitializeComponent method. Below application culture changed to German. @@ -22,15 +22,15 @@ public MainWindow() {% endhighlight %} {% endtabs %} -## Localize the drag and drop window text in treegrid +## Localize the drag and drop window text in TreeGrid -To localize the treegrid, drag and drop window based on CurrentUICulture using resource files, follow the below steps. +To localize the TreeGrid, drag and drop window based on CurrentUICulture using resource files, follow the below steps. 1.Create new folder and named as `Resources` in your application.  2.Add the default resource file of treegrid into `Resources` folder. You can download the Syncfusion.SfGrid.WPF.resx [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/Syncfusion.SfGrid.WPF2020296999.zip). -![WPF TreeGrid with Resouce File](Localization_images/wpf-treegrid-resource-file.jpeg) +![Resouce File](Localization_images/wpf-treegrid-resource-file.jpeg) 3.Right-click on the Resources folder, select `Add` and then `NewItem`. @@ -38,17 +38,17 @@ To localize the treegrid, drag and drop window based on CurrentUICulture using 5.The culture name that indicates the name of language and country. -![Creating Resource File for WPF TreeGrid](Localization_images/wpf-treegrid-create-resource-file.jpeg) +![Creating Resource File](Localization_images/wpf-treegrid-create-resource-file.jpeg) 6.Now, select Add option to add the resource file in `Resources` folder. -![Adding Created Resource File as Resource for WPF TreeGrid](Localization_images/wpf-treegrid-add-resource-file.jpeg) +![Adding Created Resource File as Resource](Localization_images/wpf-treegrid-add-resource-file.jpeg) 7.Add the Name/Value pair in Resource Designer of `Syncfusion.SfGrid.WPF.de.resx` file and change its corresponding value to corresponding culture. -![Changing Resource Dile as per Culture in WPF TreeGrid](Localization_images/wpf-treegrid-culture.jpeg) +![Changing Resource Dile as per Culture](Localization_images/wpf-treegrid-culture.jpeg) -![WPF TreeGrid displays Drag and Drop Window with Localized Text](Localization_images/wpf-treegrid-drag-and-drop.jpeg) +![displays Drag and Drop Window with Localized Text](Localization_images/wpf-treegrid-drag-and-drop.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-localize-the-drag-and-drop-window-text-in-treegrid/tree/master/WPF). @@ -71,12 +71,12 @@ public MainWindow() You can edit default resource file by adding it to `Resources` folder of your application where treegrid reads the static texts from here. You can download the default resource file from [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/Syncfusion.SfGrid.WPF-804035924.zip). -![WPF TreeGrid with Resource File](Localization_images/wpf-treegrid-edit-resource-file.jpeg) +![Resource File](Localization_images/wpf-treegrid-edit-resource-file.jpeg) Now, change the Name/Value pair in Resource Designer of `Syncfusion.SfGrid.WPF.resx` file. -![Changing Default Resource File for WPF TreeGrid](Localization_images/wpf-treegrid-change-default-resource-file.jpeg) +![Changing Default Resource File](Localization_images/wpf-treegrid-change-default-resource-file.jpeg) -![WPF TreeGrid with Modified Resource File](Localization_images/wpf-treegrid-modified-resource-file.jpeg) +![Modified Resource File](Localization_images/wpf-treegrid-modified-resource-file.jpeg) -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/MVVM.md b/wpf/TreeGrid/MVVM.md index af1e63391..0a05ab103 100644 --- a/wpf/TreeGrid/MVVM.md +++ b/wpf/TreeGrid/MVVM.md @@ -1,19 +1,19 @@ --- layout: post -title: MVVM in WPF SfTreeGrid | Syncfusion® -description: MVVM in SfTreeGrid enables seamless integration with the MVVM pattern for managing data, commands, and user interactions effectively. +title: MVVM in WPF TreeGrid | Syncfusion® +description: MVVM in TreeGrid enables seamless integration with the MVVM pattern for managing data, commands, and user interactions effectively. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# MVVM in WPF SfTreeGrid +# MVVM in WPF TreeGrid -This section explains various MVVM requirements using SfTreeGrid. +This section explains various MVVM requirements using TreeGrid. -## Bind the SelectedItem property of treegrid +## Bind the SelectedItem property of TreeGrid -You can bind the [SelectedItem ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property directly to treegrid by setting the `SfTreeGrid.SelectedItem` property. +You can bind the [SelectedItem ](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property directly to TreeGrid by setting the `SfTreeGrid.SelectedItem` property. {% tabs %} {% highlight xaml %} @@ -57,7 +57,7 @@ You can download the sample [here](https://github.com/SyncfusionExamples/how-to- ## Bind button command to view model -You can load a button for the columns in treegrid using [TreeGridTemplateColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridTemplateColumn.html). When loading the buttons, you can bind a command in ViewModel using `ElementName` binding. +You can load a button for the columns in TreeGrid using [TreeGridTemplateColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridTemplateColumn.html). When loading the buttons, you can bind a command in ViewModel using `ElementName` binding. In the following example, ViewModel command receives the underlying data object as command parameter, since the DataContext is bound as command parameter. @@ -74,7 +74,7 @@ In the following example, ViewModel command receives the underlying data object {% endhighlight %} {% endtabs %} -![Binding Button Command to ViewModel in WPF TreeGrid](MVVM_images/wpf-treegrid-binding-command.jpeg) +![Binding Button Command to ViewModel](MVVM_images/wpf-treegrid-binding-command.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-bind-button-command-to-view-model-in-wpf-and-uwp-treegrid-in-mvvm/tree/master/WPF). @@ -100,7 +100,7 @@ public ObservableCollection TitleList {% endhighlight %} {% endtabs %} -![Binding ComboBox Column in WPF TreeGrid](MVVM_images/wpf-treegrid-binding-combobox-column.jpeg) +![Binding ComboBox Column](MVVM_images/wpf-treegrid-binding-combobox-column.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-bind-combobox-column-ItemsSource-from-view-model-in-wpf-and-uwp-treegrid-in-mvvm/tree/master/WPF). @@ -125,7 +125,7 @@ You can load a ComboBox inside [TreeGridTemplateColumn](https://help.syncfusio {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays ComboBox with MVVM Data Template Binding](MVVM_images/wpf-treegrid-mvvm-data-template-binding.jpeg) +![displays ComboBox with MVVM Data Template Binding](MVVM_images/wpf-treegrid-mvvm-data-template-binding.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-bind-view-model-ItemsSource-to-combo-box-inside-template-in-wpf-and-uwp-treegrid-in-mvvm/tree/master/WPF). @@ -184,4 +184,4 @@ public class ViewModel: NotificationObject You can download the sample [here](https://github.com/SyncfusionExamples/how-to-bind-columns-from-view-model-in-wpf-and-uwp-treegrid-in-mvvm/tree/master/WPF). -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/MergeCell.md b/wpf/TreeGrid/MergeCell.md index 642acd21a..ceec06de7 100644 --- a/wpf/TreeGrid/MergeCell.md +++ b/wpf/TreeGrid/MergeCell.md @@ -1,14 +1,14 @@ ---- +--- layout: post -title: Merge Cells in WPF SfTreeGrid | Syncfusion® -description: Merge Cells in SfTreeGrid combines adjacent cells with matching values to improve data organization and readability. -control: SfTreeGrid +title: Merge Cells in WPF TreeGrid | Syncfusion® +description: Merge Cells in TreeGrid combines adjacent cells with matching values to improve data organization and readability. +control: TreeGrid documentation: ug --- -# Merge Cells in WPF SfTreeGrid +# Merge Cells in WPF TreeGrid -SfTreeGrid allows you to merge a range of adjacent cells in a row across columns using the [QueryCoveredRange](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event. +WPF TreeGrid allows you to merge a range of adjacent cells in a row across columns using the [QueryCoveredRange](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event. The `QueryCoveredRange` event occurs when each cell is arranged. While scrolling, the merged range will be added for newly added columns through this event and will also be removed for the columns that are out of view. @@ -61,7 +61,7 @@ void treeGrid_QueryCoveredRange(object sender, Syncfusion.UI.Xaml.TreeGrid.TreeG {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Merged Cells](MergeCells_images/wpf-treegrid-merge-cells.png) +![Merged Cells](MergeCells_images/wpf-treegrid-merge-cells.png) ## Merge all cells in a parent node @@ -167,9 +167,9 @@ class RequestTreeItemsBehavior : Behavior {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Merged Parent Nodes](MergeCells_images/wpf-treegrid-merge-parent-nodes.png) +![Merged Parent Nodes](MergeCells_images/wpf-treegrid-merge-parent-nodes.png) Refer to [Sample](https://github.com/SyncfusionExamples/how-to-merge-cells-in-a-row-in-wpf-treegrid). -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Node-CheckBox.md b/wpf/TreeGrid/Node-CheckBox.md index d4ac288d6..2c25c08c2 100644 --- a/wpf/TreeGrid/Node-CheckBox.md +++ b/wpf/TreeGrid/Node-CheckBox.md @@ -1,14 +1,14 @@ --- layout: post -title: Node CheckBox in WPF SfTreeGrid | Syncfusion® -description: Node CheckBox in WPF SfTreeGrid adds checkboxes to nodes for selection, tri-state, and recursive checking. +title: Node CheckBox in WPF TreeGrid | Syncfusion® +description: Node CheckBox in WPF TreeGrid adds checkboxes to nodes for selection, tri-state, and recursive checking. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Node CheckBox in WPF SfTreeGrid +# Node CheckBox in WPF TreeGrid -SfTreeGrid provides support for loading `CheckBox` in the expander cell of each node, which allows the user to check/uncheck the corresponding node. You can display check box in each node by setting [SfTreeGrid.ShowCheckBox](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ShowCheckBox) property as `true`. It also provides support to process the selection in the context of state of the checkbox based on [SfTreeGrid.CheckBoxSelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CheckBoxSelectionMode) property. +WPF TreeGrid provides support for loading `CheckBox` in the expander cell of each node, which allows the user to check/uncheck the corresponding node. You can display check box in each node by setting [SfTreeGrid.ShowCheckBox](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ShowCheckBox) property as `true`. It also provides support to process the selection in the context of state of the checkbox based on [SfTreeGrid.CheckBoxSelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CheckBoxSelectionMode) property. {% tabs %} {% highlight xaml %} @@ -24,7 +24,7 @@ treeGrid.CheckBoxSelectionMode = CheckBoxSelectionMode.Default; {% endhighlight %} {% endtabs %} -![Node with CheckBox in WPF TreeGrid](Node-CheckBox_images/wpf-treegrid-node-checkbox.png) +![Node with CheckBox](Node-CheckBox_images/wpf-treegrid-node-checkbox.png) ## Indeterminate State Support @@ -45,7 +45,7 @@ treeGrid.AllowTriStateChecking = true; ## Recursive Checking -SfTreeGrid provides support for recursive checking where the checked state of parent node and child nodes is changed recursively based on the state of currently changed node. You can enable recursive checking by setting [SfTreeGrid.EnableRecursiveChecking](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_EnableRecursiveChecking) property as `true`. +TreeGrid provides support for recursive checking where the checked state of parent node and child nodes is changed recursively based on the state of currently changed node. You can enable recursive checking by setting [SfTreeGrid.EnableRecursiveChecking](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_EnableRecursiveChecking) property as `true`. * A tree node will be checked only if all its child nodes are checked. * A tree node will be unchecked if all its child nodes are unchecked. @@ -64,7 +64,7 @@ treeGrid.EnableRecursiveChecking = true; {% endhighlight %} {% endtabs %} -![Recursive Checking in WPF TreeGrid](Node-CheckBox_images/wpf-treegrid-recursive-checking.png) +![Recursive Checking](Node-CheckBox_images/wpf-treegrid-recursive-checking.png) N> Even though [SfTreeGrid.AllowTriStateChecking](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowTriStateChecking) is `false` if [SfTreeGrid.EnableRecursiveChecking](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_EnableRecursiveChecking) is `true`, CheckBox can be in indeterminate state. @@ -117,7 +117,7 @@ You can disable CheckBox by writing style for [TreeGridExpanderCell](https://hel In the below screenshot, node CheckBox is disabled for leaf nodes. -![Disabling Node CheckBox in WPF TreeGrid](Node-CheckBox_images/wpf-treegrid-disable-node-checkbox.png) +![Disabling Node CheckBox](Node-CheckBox_images/wpf-treegrid-disable-node-checkbox.png) ## Collapsing CheckBox for certain nodes @@ -276,11 +276,11 @@ public class BoolToVisibilityConverter : IValueConverter Here, node CheckBox is collapsed for leaf nodes. -![Collapsing Node CheckBox in WPF TreeGrid](Node-CheckBox_images/wpf-treegrid-collapse-node-checkbox.png) +![Collapsing Node CheckBox](Node-CheckBox_images/wpf-treegrid-collapse-node-checkbox.png) ## Handling Selection based on CheckBox State -SfTreeGrid has following modes for processing selection based on check box state. +TreeGrid has following modes for processing selection based on check box state. 1. Default – Selection and state of checkbox works independent of each other. 2. SelectOnCheck – Row can be selected or deselected based on state of checkbox. @@ -305,7 +305,7 @@ treeGrid.CheckBoxSelectionMode = CheckBoxSelectionMode.Default; {% endhighlight %} {% endtabs %} -![Default CheckBox Selection in WPF TreeGrid](Node-CheckBox_images/wpf-treegrid-checkbox-selection.png) +![Default CheckBox Selection](Node-CheckBox_images/wpf-treegrid-checkbox-selection.png) **SelectOnCheck** @@ -325,7 +325,7 @@ treeGrid.CheckBoxSelectionMode = CheckBoxSelectionMode.SelectOnCheck; {% endhighlight %} {% endtabs %} -![Row Selection with CheckBox in WPF TreeGrid](Node-CheckBox_images/wpf-treegrid-row-selection-with-checkbox.png) +![Row Selection with CheckBox](Node-CheckBox_images/wpf-treegrid-row-selection-with-checkbox.png) **SynchronizeSelection** @@ -344,7 +344,7 @@ treeGrid.CheckBoxSelectionMode = CheckBoxSelectionMode.SynchronizeSelection; {% endhighlight %} {% endtabs %} -![WPF TreeGrid Synchronize Row Selection with CheckBox](Node-CheckBox_images/wpf-treegrid-synchronize-row-selection-checkbox.png) +![Synchronize Row Selection with CheckBox](Node-CheckBox_images/wpf-treegrid-synchronize-row-selection-checkbox.png) N> * Recursive checking is not supported when selection mode is single. @@ -406,4 +406,4 @@ var nodes = treeGrid.GetCheckedNodes(true); {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Paging.md b/wpf/TreeGrid/Paging.md index e9804814a..1fcceb822 100644 --- a/wpf/TreeGrid/Paging.md +++ b/wpf/TreeGrid/Paging.md @@ -1,19 +1,19 @@ --- layout: post -title: Paging in WPF SfTreeGrid | Syncfusion® -description: Paging in SfTreeGrid displays data in pages to improve navigation, performance, and the overall browsing experience. +title: Paging in WPF TreeGrid | Syncfusion® +description: Paging in TreeGrid displays data in pages to improve navigation, performance, and the overall browsing experience. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Paging in WPF SfTreeGrid +# Paging in WPF TreeGrid -SfTreeGrid provides support to manipulate the nodes using SfDataPager control. You can refer [SfDataPager](https://help.syncfusion.com/wpf/datapager/overview) control user guide for more information. +WPF TreeGrid provides support to manipulate the nodes using SfDataPager control. You can refer [SfDataPager](https://help.syncfusion.com/wpf/datapager/overview) control user guide for more information. ## Getting started -Follow the below steps to bind SfTreeGrid with SfDataPager. +Follow the below steps to bind TreeGrid with SfDataPager. 1. Create `IEnumerable` collection that you want to bind and set it to [SfDataPager.Source](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Controls.DataPager.SfDataPager.html#Syncfusion_UI_Xaml_Controls_DataPager_SfDataPager_Source) property. @@ -21,7 +21,7 @@ Follow the below steps to bind SfTreeGrid with SfDataPager. 3. Bind [SfDataPager.PagedSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Controls.DataPager.SfDataPager.html#Syncfusion_UI_Xaml_Controls_DataPager_SfDataPager_PagedSource) to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ItemsSource) property. So whenever the page is changed, `PagedSource` will be updated based on the current page. -N> Paging supports all types of [TreeGridView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html), except when using `SfTreeGrid` in unbound mode ([TreeGridUnBoundView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridUnboundView.html)). The following code snippet demonstrates the [TreeGridSelfRelationalView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSelfRelationalView.html) type. +N> Paging supports all types of [TreeGridView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html), except when using `TreeGrid` in unbound mode ([TreeGridUnBoundView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridUnboundView.html)). The following code snippet demonstrates the [TreeGridSelfRelationalView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSelfRelationalView.html) type. Similarly, paging support can be implemented for [TreeGridNestedView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridNestedView.html). {% capture codesnippet1 %} @@ -174,11 +174,11 @@ public class EmployeeInfo {% endcapture %} {{ codesnippet1 | OrderList_Indent_Level_1 }} -![WPF TreeGrid displays Multiple Pages using SfDataPager](paging_images/wpf-treeGrid-multiple-page.png) +![displays Multiple Pages using SfDataPager](paging_images/wpf-treeGrid-multiple-page.png) ### Limitations -1. Paging is not supported when using `SfTreeGrid` in unbound mode (TreeGridUnBoundView). +1. Paging is not supported when using `TreeGrid` in unbound mode (TreeGridUnBoundView). 2. `SfDataPager`’s on‑demand loading functionality is not supported. 3. **Child nodes** are not considered in page size calculation. 4. Selection should not be maintained when moving from one page to another. diff --git a/wpf/TreeGrid/Printing.md b/wpf/TreeGrid/Printing.md index b23ff2350..5a23cd175 100644 --- a/wpf/TreeGrid/Printing.md +++ b/wpf/TreeGrid/Printing.md @@ -1,15 +1,15 @@ --- layout: post -title: Printing in WPF SfTreeGrid | Syncfusion® -description: Printing in SfTreeGrid prints grid data with customizable layouts, formatting, and page settings for professional output. +title: Printing in WPF TreeGrid | Syncfusion® +description: Printing in TreeGrid prints grid data with customizable layouts, formatting, and page settings for professional output. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Printing in WPF SfTreeGrid +# Printing in WPF TreeGrid -The printing feature can be achieved by exporting the tree grid to PDF and printing the exported PDF using the [PdfViewerControl](https://help.syncfusion.com/wpf/pdf-viewer/printing-pdf-files) . +The printing feature can be achieved by exporting the TreeGrid to PDF and printing the exported PDF using the [PdfViewerControl](https://help.syncfusion.com/wpf/pdf-viewer/printing-pdf-files) . {% tabs %} {% highlight c# %} @@ -42,7 +42,7 @@ private void Window_Loaded(object sender, RoutedEventArgs e) {% endhighlight %} {% endtabs %} -![Printing in WPF TreeGrid](Printing_images/wpf-treegrid-printing.png) +![Printing](Printing_images/wpf-treegrid-printing.png) You can download the [sample](https://github.com/SyncfusionExamples/how-to-print-wpf-treegrid-with-pdfviewercontrol). @@ -115,4 +115,4 @@ You can download the [sample](https://github.com/SyncfusionExamples/how-to-print The print page can be customized when exporting by passing the [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html) instance as an argument to the [ExportToPdf](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportExtension.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportExtension_ExportToPdf_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_) and [ExportToPdfGrid](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportExtension.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportExtension_ExportToPdfGrid_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_) methods. Refer to this [documentation](https://help.syncfusion.com/wpf/treegrid/export-to-pdf#export-options) to customize the export options. -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Row-Height-Customization.md b/wpf/TreeGrid/Row-Height-Customization.md index aeb29f778..0abfa1146 100644 --- a/wpf/TreeGrid/Row-Height-Customization.md +++ b/wpf/TreeGrid/Row-Height-Customization.md @@ -1,13 +1,13 @@ --- layout: post -title: Row Height Customization in WPF SfTreeGrid | Syncfusion® -description: Row Height Customization in SfTreeGrid customizes row heights dynamically to improve data display, readability, and user experience. +title: Row Height Customization in WPF TreeGrid | Syncfusion® +description: Row Height Customization in TreeGrid customizes row heights dynamically to improve data display, readability, and user experience. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Row Height Customization in WPF SfTreeGrid +# Row Height Customization in WPF TreeGrid You can change the header row height by setting [SfTreeGrid.HeaderRowHeight](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_HeaderRowHeight) and the other rows height can be changed by setting [SfTreeGrid.RowHeight](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_RowHeight) property. @@ -65,7 +65,7 @@ void TreeGrid_QueryRowHeight(object sender, TreeGridQueryRowHeightEventArgs e) {% endhighlight %} {% endtabs %} -![Customizing Particular Row Height in WPF TreeGrid](Row-Height-Customization_images/wpf-treegrid-customizing-row-height.png) +![Customizing Particular Row Height](Row-Height-Customization_images/wpf-treegrid-customizing-row-height.png) ## QueryRowHeight event @@ -73,7 +73,7 @@ You can change the row height in on-demand based on the row index or row data us `QueryRowHeight` event triggered for each row when it becomes visible. [TreeGridQueryRowHeightEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridQueryRowHeightEventArgs.html) provides information to `QueryRowHeight` event with following members, -* `RowIndex` – denotes index of the row in SfTreeGrid. +* `RowIndex` – denotes index of the row in TreeGrid. * `Height` – Gets or sets the height of the row. @@ -96,18 +96,18 @@ void TreeGrid_QueryRowHeight(object sender, TreeGridQueryRowHeightEventArgs e) {% endhighlight %} {% endtabs %} -![Changing Specific Row Height in WPF TreeGrid](Row-Height-Customization_images/wpf-treegrid-change-row-height.png) +![Changing Specific Row Height](Row-Height-Customization_images/wpf-treegrid-change-row-height.png) ## Fit the Row Height based on its content -You can fit the row height based on its content in `QueryRowHeight` event handler using [GetAutoRowHeight](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumnSizer.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumnSizer_GetAutoRowHeight_Syncfusion_UI_Xaml_TreeGrid_TreeNode_Syncfusion_UI_Xaml_Grid_GridRowSizingOptions_System_Double__) method. This improves the readability of the content and it does not affect the loading performance of the SfTreeGrid as the `QueryRowHeight` event triggered for rows in on-demand. +You can fit the row height based on its content in `QueryRowHeight` event handler using [GetAutoRowHeight](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumnSizer.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumnSizer_GetAutoRowHeight_Syncfusion_UI_Xaml_TreeGrid_TreeNode_Syncfusion_UI_Xaml_Grid_GridRowSizingOptions_System_Double__) method. This improves the readability of the content and it does not affect the loading performance of the TreeGrid as the `QueryRowHeight` event triggered for rows in on-demand. `GetAutoRowHeight` method returns `true` when the row height is calculated for record and header rows and returns `false` for other rows. Calculated height based on content set to the `out` parameter and you can assign the calculated height to the `Height` property of `TreeGridQueryRowHeightEventArgs`. Below are the parameter to `GetAutoRowHeight` method, -1. `RowIndex` – denotes the index of row in SfTreeGrid. +1. `RowIndex` – denotes the index of row in TreeGrid. 2. `GridRowSizingOptions` – A class with properties to customize the row height calculation. @@ -153,7 +153,7 @@ void TreeGrid_QueryRowHeight(object sender, TreeGridQueryRowHeightEventArgs e) Here, row heights are customized based on the large text content. -![AutoFit RowHeight in WPF TreeGrid](Row-Height-Customization_images/wpf-treegrid-auto-fit-row-height.png) +![AutoFit RowHeight](Row-Height-Customization_images/wpf-treegrid-auto-fit-row-height.png) ### GridRowSizingOptions @@ -201,7 +201,7 @@ void TreeGrid_QueryRowHeight(object sender, QueryRowHeightEventArgs e) Here `FirstName`,`LastName`, `Title` and `Salary` columns are excluded from height calculation and the row height is calculated based on `About` column only. -![AutoFit RowHeight for Specific Columns in WPF TreeGrid](Row-Height-Customization_images/wpf-treegrid-autofit-height-based-on-column.png) +![AutoFit RowHeight for Specific Columns](Row-Height-Customization_images/wpf-treegrid-autofit-height-based-on-column.png) ## Reset Row Height at runtime @@ -329,7 +329,7 @@ void TreeGrid_QueryRowHeight(object sender, TreeGridQueryRowHeightEventArgs e) {% endhighlight %} {% endtabs %} -![AutoFit Header RowHeight based on Content in WPF TreeGrid](Row-Height-Customization_images/wpf-treegrid-header-row-height.png) +![AutoFit Header RowHeight based on Content](Row-Height-Customization_images/wpf-treegrid-header-row-height.png) ## Change StackedHeaderRow Height based on its content @@ -392,4 +392,4 @@ void TreeGrid_QueryRowHeight(object sender, TreeGridQueryRowHeightEventArgs e) {% endhighlight %} {% endtabs %} -![AutoFit Stacked HeaderRow Height based on Content in WPF TreeGrid](Row-Height-Customization_images/wpf-treegrid-stacked-header-row-height.png) +![AutoFit Stacked HeaderRow Height based on Content](Row-Height-Customization_images/wpf-treegrid-stacked-header-row-height.png) diff --git a/wpf/TreeGrid/Rows.md b/wpf/TreeGrid/Rows.md index b3b1f8e7c..3c6a903f0 100644 --- a/wpf/TreeGrid/Rows.md +++ b/wpf/TreeGrid/Rows.md @@ -1,18 +1,18 @@ ---- +--- layout: post -title: Rows in WPF SfTreeGrid | Syncfusion® -description: Rows in SfTreeGrid include headers, unbound, and data rows with customizable styles, indicators, and flexible layouts. +title: Rows in WPF TreeGrid | Syncfusion® +description: Rows in TreeGrid include headers, unbound, and data rows with customizable styles, indicators, and flexible layouts. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Rows in WPF SfTreeGrid +# Rows in WPF TreeGrid -This section explains about various row types in treegrid and its customization. +This section explains about various row types in TreeGrid and its customization. -## Rows in WPF TreeGrid (SfTreeGrid) +## Rows in WPF TreeGrid RowHeader is a special column used to indicate the status of row (current row, editing status, errors in row, etc.) which is placed as first cell of each row. You can show or hide the row header by setting [SfTreeGrid.ShowRowHeader](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_ShowRowHeader) property. @@ -41,7 +41,7 @@ Description -WPF TreeGrid Rows Indicator +Rows Indicator Denotes the row which has current cell or selected item. @@ -49,7 +49,7 @@ Denotes the row which has current cell or selected item. -WPF TreeGrid row which has current cell or selected item +Row which has current cell or selected item Denotes row is being edited. @@ -57,7 +57,7 @@ Denotes row is being edited. -WPF TreeGrid row is being edited +Row is being edited Denotes the row has errors. @@ -65,7 +65,7 @@ Denotes the row has errors. -WPF TreeGrid row has errors +Row has errors Denotes that the current row has errors. @@ -110,11 +110,11 @@ You can display the row index value in row header by customizing the `Tr {% endhighlight %} {% endtabs %} -## Rows in WPF TreeGrid (SfTreeGrid) +## Rows in WPF TreeGrid Header row is present in top of the treegrid which has column headers in it. Column header describes the caption to identify the column content. -![WPF TreeGrid with Header Row](Rows_images/wpf-treegrid-header-row.jpeg) +![Header Row](Rows_images/wpf-treegrid-header-row.jpeg) ## Hiding header row @@ -244,7 +244,7 @@ Orientation of the treegrid column header text can be changed by editing the {% endhighlight %} {% endtabs %} -![Changing Column Header Orientation of WPF TreeGrid](Rows_images/wpf-treegrid-column-header.jpeg) +![Changing Column Header Orientation](Rows_images/wpf-treegrid-column-header.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-change-the-orientation-of-column-header-text-in-wpf-treegrid). @@ -359,7 +359,7 @@ By default, the `sort icon` appears at the right of the header text. You ca {% endhighlight %} {% endtabs %} -![Changing Sort Icon Poistion in WPF TreeGrid](Rows_images/wpf-treegrid-sort-icon.jpeg) +![Changing Sort Icon Poistion](Rows_images/wpf-treegrid-sort-icon.jpeg) ## Customize style of header row @@ -384,7 +384,7 @@ You can change the header cell background and foreground for specific column or {% endhighlight %} {% endtabs %} -![Customizing Row Header Style in WPF TreeGrid](Rows_images/wpf-treegrid-row-header-customization.jpeg) +![Customizing Row Header Style](Rows_images/wpf-treegrid-row-header-customization.jpeg) You can change the style of the particular column header by using the [HeaderStyle](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridColumnBase.html#Syncfusion_UI_Xaml_Grid_GridColumnBase_HeaderStyle) property in column, @@ -394,8 +394,8 @@ You can change the style of the particular column header by using the [HeaderSty {% endhighlight %} {% endtabs %} -![Customizing Column Header Style in WPF TreeGrid](Rows_images/wpf-treegrid-column-header-customization.jpeg) +![Customizing Column Header Style](Rows_images/wpf-treegrid-column-header-customization.jpeg) -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Search.md b/wpf/TreeGrid/Search.md index 69a12c4d2..f03acc65a 100644 --- a/wpf/TreeGrid/Search.md +++ b/wpf/TreeGrid/Search.md @@ -1,15 +1,15 @@ --- layout: post -title: Search in WPF SfTreeGrid | Syncfusion® -description: Search in SfTreeGrid quickly locates records across grid data to improve navigation, data access, and productivity. +title: Search in WPF TreeGrid | Syncfusion® +description: Search in TreeGrid quickly locates records across grid data to improve navigation, data access, and productivity. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Search in WPF SfTreeGrid +# Search in WPF TreeGrid -[WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) control allows you to search the data displayed in the SfTreeGrid. You can search the data by using [SearchController.Search](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_Search_System_String_) method. +[WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) control allows you to search the data displayed in the TreeGrid. You can search the data by using [SearchController.Search](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_Search_System_String_) method. {% tabs %} {% highlight c# %} @@ -19,17 +19,17 @@ this.treeGrid.SearchController.Search(TextBox.Text); {% endhighlight %} {% endtabs %} -![WPF TreeGrid with Search Panel](Search_images/wpf-treegrid-search-panel.png) +![Search Panel](Search_images/wpf-treegrid-search-panel.png) ## SearchScope -You can control where the search is applied in the SfTreeGrid using the [SearchController.SearchScope](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_SearchScope) property. By default SearchScope value set as Both. +You can control where the search is applied in the TreeGrid using the [SearchController.SearchScope](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_SearchScope) property. By default SearchScope value set as Both. -* `Both` – Search will be applied to both RootNodes and ChildNodes in the SfTreeGrid. +* `Both` – Search will be applied to both RootNodes and ChildNodes in the TreeGrid. -* `RootNodes` – Search will be applied only to the RootNodes in the SfTreeGrid. +* `RootNodes` – Search will be applied only to the RootNodes in the TreeGrid. -* `ChildNodes` – Search will be applied only to the ChildNodes in the SfTreeGrid. +* `ChildNodes` – Search will be applied only to the ChildNodes in the TreeGrid. {% tabs %} {% highlight c# %} @@ -40,7 +40,7 @@ this.treeGrid.SearchController.Search(TextBox.Text); {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Search Text only in ChildNodes](Search_images/wpf-treegrid-search-text-in-childnodes.png) +![displays Search Text only in ChildNodes](Search_images/wpf-treegrid-search-text-in-childnodes.png) ## Filtering @@ -55,7 +55,7 @@ this.treeGrid.SearchController.Search(TextBox.Text); {% endhighlight %} {% endtabs %} -![Enabling Filter based on Search in WPF TreeGrid](Search_images/wpf-treegrid-filter-based-on-search.png) +![Enabling Filter based on Search](Search_images/wpf-treegrid-filter-based-on-search.png) N> In Search, filtering is applied based on the [FilterLevel](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.FilterLevel.html). @@ -72,7 +72,7 @@ this.treeGrid.SearchController.Search(TextBox.Text); ## Changing Search Highlight Background -In WPF TreeGrid (SfTreeGrid), you can change the search text highlighting color by setting [SearchController.MatchedCellBackground](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_MatchedCellBackground) property +In WPF TreeGrid, you can change the search text highlighting color by setting [SearchController.MatchedCellBackground](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_MatchedCellBackground) property {% tabs %} {% highlight c# %} @@ -83,11 +83,11 @@ this.treeGrid.SearchController.Search(TextBox.Text); {% endhighlight %} {% endtabs %} -![Changing Search Text Highlighting Color in WPF TreeGrid](Search_images/wpf-treegrid-highlight-search-color.png) +![Changing Search Text Highlighting Color](Search_images/wpf-treegrid-highlight-search-color.png) ## Changing foreground for search highlight -In WPF TreeGrid (SfTreeGrid), you can change the foreground color for search text by setting the [SearchController.MatchedCellForeground](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_MatchedCellForeground) property. +In WPF TreeGrid, you can change the foreground color for search text by setting the [SearchController.MatchedCellForeground](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_MatchedCellForeground) property. {% tabs %} {% highlight c# %} @@ -98,7 +98,7 @@ this.treeGrid.SearchController.Search(TextBox.Text); {% endhighlight %} {% endtabs %} -![Changing Fore Color of Search Text in WPF TreeGrid](Search_images/wpf-treegrid-search-text-fore-color.png) +![Changing Fore Color of Search Text](Search_images/wpf-treegrid-search-text-fore-color.png) ## Navigating cells based on search text @@ -124,7 +124,7 @@ this.treeGrid.SearchController.FindNext(TextBox.Text); {% endhighlight %} {% endtabs %} -![Highlighting Navigated Search Text in WPF TreeGrid](Search_images/wpf-treegrid-highlight-navigate-search-text.png) +![Highlighting Navigated Search Text](Search_images/wpf-treegrid-highlight-navigate-search-text.png) You can highlight the foreground color of current navigated search text by using the [SearchController.CurrentMatchedCellForeground](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSearchController_CurrentMatchedCellForeground) property. @@ -137,7 +137,7 @@ this.treeGrid.SearchController.FindNext(TextBox.Text); {% endhighlight %} {% endtabs %} -![Highlighting Current Navigated Search Text Color in WPF TreeGrid](Search_images/wpf-treegrid-navigated-search-text-color.png) +![Highlighting Current Navigated Search Text Color](Search_images/wpf-treegrid-navigated-search-text-color.png) ## Move CurrentCell when FindNext and FindPrevious @@ -168,7 +168,7 @@ this.treeGrid.SearchController.Clear(); ## Search customization -WPF TreeGrid (SfTreeGrid) process the search operations in [SearchController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html) class. You can change the default search behaviors by overriding `SearchController` class and set to `SfTreeGrid.SearchController`. +WPF TreeGrid process the search operations in [SearchController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSearchController.html) class. You can change the default search behaviors by overriding `SearchController` class and set to `SfTreeGrid.SearchController`. {% tabs %} {% highlight c# %} @@ -218,7 +218,7 @@ public class SearchControllerExt : TreeGridSearchController {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Search Text only in Selected Column](Search_images/wpf-treegrid-search-text-in-column.png) +![displays Search Text only in Selected Column](Search_images/wpf-treegrid-search-text-in-column.png) ### Select the record based on the SearchText @@ -237,12 +237,12 @@ this.treeGrid.SelectedIndex = recordIndex; {% endhighlight %} {% endtabs %} -![Select Record based on SearchText in WPF TreeGrid](Search_images/wpf-treegrid-select-record-based-on-search.png) +[Select Record based on SearchText](Search_images/wpf-treegrid-select-record-based-on-search.png) ### Search with the TreeGridComboBoxColumn -You can search the data in SfTreeGrid with all the TreeGridColumns which loads TextBlock as display element. To perform the search operation in the [TreeGridComboBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridComboBoxColumn.html) you need to customize the [TreeGridComboBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridComboBoxColumn.html). As it loads the ContentControl in display mode. +You can search the data in TreeGrid with all the TreeGridColumns which loads TextBlock as display element. To perform the search operation in the [TreeGridComboBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridComboBoxColumn.html) you need to customize the [TreeGridComboBoxColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridComboBoxColumn.html). As it loads the ContentControl in display mode. {% tabs %} {% highlight c# %} diff --git a/wpf/TreeGrid/Selection.md b/wpf/TreeGrid/Selection.md index 9948fff53..e9079e5a8 100644 --- a/wpf/TreeGrid/Selection.md +++ b/wpf/TreeGrid/Selection.md @@ -1,15 +1,15 @@ ---- +--- layout: post -title: Selection in WPF SfTreeGrid | Syncfusion® -description: Selection in SfTreeGrid provides flexible row, cell, and multi-selection options with customizable modes and selection behaviors. +title: Selection in WPF TreeGrid | Syncfusion® +description: Selection in TreeGrid provides flexible row, cell, and multi-selection options with customizable modes and selection behaviors. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Selection in WPF SfTreeGrid +# Selection in WPF TreeGrid -[WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) (SfTreeGrid) allows you to select one or more rows or cells. For selecting specific row or group of rows you have to set [SelectionUnit](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionUnit) as [Row](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html) and for selecting a specific cell or group of cells you have to set `SelectionUnit` as [Cell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html) or [Any](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html). In [SelectionUnit.Any](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html) option you can select the row by clicking on row header. +[WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) allows you to select one or more rows or cells. For selecting specific row or group of rows you have to set [SelectionUnit](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionUnit) as [Row](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html) and for selecting a specific cell or group of cells you have to set `SelectionUnit` as [Cell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html) or [Any](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html). In [SelectionUnit.Any](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionUnit.html) option you can select the row by clicking on row header. ## Current cell navigation @@ -17,7 +17,7 @@ Keyboard navigation through the cells and rows is determined based on the [Navig ## Selection modes -The [SelectionUnit](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionUnit) and [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) properties together define the behavior of selection in SfTreeGrid. +The [SelectionUnit](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionUnit) and [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) properties together define the behavior of selection in TreeGrid. @@ -65,7 +65,7 @@ Allows selection of more than one row or cell. Selection is not cleared when sel Extended
-Allows selecting multiple rows or cells. You can select multiple rows or cells in the SfTreeGrid by dragging the mouse or by using the key modifiers Ctrl and Shift. +Allows selecting multiple rows or cells. You can select multiple rows or cells in the TreeGrid by dragging the mouse or by using the key modifiers Ctrl and Shift.
@@ -84,7 +84,7 @@ Allows selecting multiple rows or cells. You can select multiple rows or cells i {% endhighlight %} {% endtabs %} -![Row Selection in WPF TreeGrid](Selection_images/wpf-treegrid-row-selection.jpeg) +![Row Selection](Selection_images/wpf-treegrid-row-selection.jpeg) ## Disable selection for rows and columns @@ -92,7 +92,7 @@ You can disable selection and navigation on particular column by setting the [Gr ## Multiple row or cell selection -The SfTreeGrid allows you to select multiple rows or cells by setting the [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property as [Extended](http://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html) or [Multiple](http://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html), where you can select multiple rows or cells by dragging the mouse on SfTreeGrid and also using the key modifiers. +The TreeGrid allows you to select multiple rows or cells by setting the [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property as [Extended](http://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html) or [Multiple](http://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html), where you can select multiple rows or cells by dragging the mouse and also using the key modifiers. When using `Extended`, you can select multiple rows or cells by pressing the key modifiers Ctrl and Shift. @@ -110,7 +110,7 @@ When using `Extended`, you can select multiple rows or cells by pressing the key {% endhighlight %} {% endtabs %} -![Multiple Row Selection in WPF TreeGrid](Selection_images/wpf-treegrid-multiple-row-selection.jpeg) +![Multiple Row Selection](Selection_images/wpf-treegrid-multiple-row-selection.jpeg) N> When [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) is [Multiple](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html), you can select or deselect multiple rows and cells by clicking the respective row or cell. In multiple selection, pressing the navigation keys moves only the current cell, and you can select or deselect by pressing the `Space` key. @@ -129,7 +129,7 @@ N> When [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Gr {% endhighlight %} {% endtabs %} -![Extended Cell Selection in WPF TreeGrid](Selection_images/wpf-treegrid-extended-cell-selection.png) +![Extended Cell Selection](Selection_images/wpf-treegrid-extended-cell-selection.png) {% tabs %} {% highlight xaml %} @@ -146,11 +146,11 @@ N> When [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Gr {% endhighlight %} {% endtabs %} -![Multiple Cell Selection in WPF TreeGrid](Selection_images/wpf-treegrid-multiple-cell-selection.png) +![Multiple Cell Selection](Selection_images/wpf-treegrid-multiple-cell-selection.png) ## Get selected rows and cells -The [SelectedItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property returns the data object of the selected row, and the [SelectedIndex](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedIndex) property returns the index of the `SelectedItem` in tree grid. The `SelectedItem` denotes the first selected row in multiple selection. +The [SelectedItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property returns the data object of the selected row, and the [SelectedIndex](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedIndex) property returns the index of the `SelectedItem` in TreeGrid. The `SelectedItem` denotes the first selected row in multiple selection. The [CurrentItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentItemProperty) returns the data object that currently has focus, and the [CurrentColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentColumnProperty) denotes the [TreeGridColumn](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html) that currently has focus. @@ -175,7 +175,7 @@ List selectedCells = this.treeGrid.GetSelectedCells(); ### CurrentItem vs SelectedItem -Both [SelectedItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) and [CurrentItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentItem) returns the same data object when there is single cell or row is selected in SfTreeGrid. When you have selected more than one rows or cells, the record that had been selected initially is maintained in `SelectedItem` and the record that currently have focus is maintained in `CurrentItem`. +Both [SelectedItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) and [CurrentItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentItem) returns the same data object when there is single cell or row is selected in TreeGrid. When you have selected more than one rows or cells, the record that had been selected initially is maintained in `SelectedItem` and the record that currently have focus is maintained in `CurrentItem`. ## Programmatic selection @@ -212,7 +212,7 @@ foreach (var order in viewModel.PersonDetails) {% endhighlight %} {% endtabs %} -![Programmatic Record Selection in WPF TreeGrid](Selection_images/wpf-treegrid-record-selection.jpeg) +![Programmatic Record Selection](Selection_images/wpf-treegrid-record-selection.jpeg) ### Process selection using methods @@ -226,7 +226,7 @@ this.treeGrid.SelectRows(3, 7); {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Multiple Row Selection](Selection_images/wpf-treegrid-rows-selection.jpeg) +![displays Multiple Row Selection](Selection_images/wpf-treegrid-rows-selection.jpeg) You can select a specific cell by using the [SelectCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectCell_System_Object_Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_System_Boolean_) method in cell selection. @@ -241,7 +241,7 @@ this.treeGrid.SelectCell(record, column); {% endhighlight %} {% endtabs %} -![Displaying Programmatic Cell Selection in WPF TreeGrid](Selection_images/wpf-treegrid-cell-selection.png) +![Displaying Programmatic Cell Selection](Selection_images/wpf-treegrid-cell-selection.png) You can select a range of cells through [SelectCells](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectCells_System_Object_Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_System_Object_Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_System_Boolean_) method in cell selection. @@ -258,7 +258,7 @@ this.treeGrid.SelectCells(firstRecord, firstColumn, lastRecord, lastColumn); {% endhighlight %} {% endtabs %} -![Displaying Programmatic Cells Selection in WPF TreeGrid](Selection_images/wpf-treegrid-cells-selection.png) +![Displaying Programmatic Cells Selection](Selection_images/wpf-treegrid-cells-selection.png) You can select all the rows or cells using [SelectAll](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectAll) method. @@ -332,14 +332,14 @@ this.treeGrid.UnselectCell(removeRecord, removeColumn); {% endhighlight %} {% endtabs %} -![Programmatic Removal of Selection for a Cell in WPF TreeGrid](Selection_images/wpf-treegrid-remove-selection.png) +![Programmatic Removal of Selection for a Cell](Selection_images/wpf-treegrid-remove-selection.png) ## Scrolling rows and columns ### Automatic scrolling on drag selection -SfTreeGrid scrolls rows and columns automatically when you try to perform the drag selection like in Excel. You can enable or disable AutoScrolling by setting the [AutoScroller.AutoScrolling](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoScroller) property. +TreeGrid scrolls rows and columns automatically when you try to perform the drag selection like in Excel. You can enable or disable AutoScrolling by setting the [AutoScroller.AutoScrolling](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoScroller) property. {% tabs %} {% highlight c# %} @@ -450,7 +450,7 @@ Moves the current cell to the last cell of the current row. -The tree grid will be scrolled to the next set of rows that is not displayed in view, including the row that is partially displayed, and the current cell is set to the last row. +The TreeGrid will be scrolled to the next set of rows that is not displayed in view, including the row that is partially displayed, and the current cell is set to the last row. @@ -459,7 +459,7 @@ The tree grid will be scrolled to the next set of rows that is not displayed in -The tree grid will be scrolled to the previous set of rows that is not displayed in view, including the row that is partially displayed, and the current cell is set to the first row. +The TreeGrid will be scrolled to the previous set of rows that is not displayed in view, including the row that is partially displayed, and the current cell is set to the first row. @@ -792,7 +792,7 @@ private void TreeGrid_SelectionChanging(object sender, Syncfusion.UI.Xaml.Grid.G ### SelectionChanged -The [SelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionChanged) event occurs after the selection process is completed for a particular row or cell in tree grid. [GridSelectionChangedEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionChangedEventArgs.html) has the following members, which provide information to the SelectionChanged event: +The [SelectionChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionChanged) event occurs after the selection process is completed for a particular row or cell in TreeGrid. [GridSelectionChangedEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionChangedEventArgs.html) has the following members, which provide information to the SelectionChanged event: [AddedItems](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSelectionChangedEventArgs.html#Syncfusion_UI_Xaml_Grid_GridSelectionChangedEventArgs_AddedItems): Collection of [TreeGridRowInfo](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowInfo.html) or [TreeGridCellInfo](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCellInfo.html) where the selection has been processed. @@ -843,7 +843,7 @@ You can change the selection background and foreground using the [SelectionBackG {% endhighlight %} {% endtabs %} -![Customizing Rows Selection in WPF TreeGrid](Selection_images/wpf-treegrid-row-selection-customization.jpeg) +![Customizing Rows Selection](Selection_images/wpf-treegrid-row-selection-customization.jpeg) ### Change current cell border style @@ -867,7 +867,7 @@ You can change the current cell border thickness and border color using the [Cur {% endhighlight %} {% endtabs %} -![Customizing Cell Selection Border in WPF TreeGrid](Selection_images/wpf-treegrid-cell-selection.jpeg) +![Customizing Cell Selection Border](Selection_images/wpf-treegrid-cell-selection.jpeg) ### Customize row selection border @@ -1026,12 +1026,12 @@ You can customize the cell selection by editing the control template of the corr {% endhighlight %} {% endtabs %} -![Custom Cell Selection in WPF TreeGrid](Selection_images/wpf-treegrid-custom-cell-selection.png) +![Custom Cell Selection](Selection_images/wpf-treegrid-custom-cell-selection.png) ## Customize selection behaviors -The SfTreeGrid process the selection operations in selection controller. Below are the built-in selection controllers, +The TreeGrid process the selection operations in selection controller. Below are the built-in selection controllers, * [TreeGridRowSelectionController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html) – Process selection operations when `selection unit` as `row`. @@ -1086,7 +1086,7 @@ public class GridSelectionControllerExt : TreeGridRowSelectionController You can scroll to the record programmatically using the [ScrollInView](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ScrollInView_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_) method by passing the row index of the record. You can get the row index of the record using the [ResolveToRowIndex](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridIndexResolver.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridIndexResolver_ResolveToRowIndex_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Syncfusion_UI_Xaml_TreeGrid_TreeNode_) extension method present in `Syncfusion.UI.Xaml.TreeGrid.Helpers`. -You can select the record programmatically by setting the [SelectedItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property in tree grid. +You can select the record programmatically by setting the [SelectedItem](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property in TreeGrid. {% tabs %} {% highlight c# %} @@ -1107,7 +1107,7 @@ You can [download]( https://github.com/SyncfusionExamples/how-to-scroll-and-sele ### Prevent the selection when right-click -You can prevent the selection when right-clicking in tree grid by customizing the [SelectionController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionController) and overriding the [ProcessPointerPressed](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_ProcessPointerPressed_System_Windows_Input_MouseButtonEventArgs_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_). +You can prevent the selection when right-clicking in TreeGrid by customizing the [SelectionController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionController) and overriding the [ProcessPointerPressed](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_ProcessPointerPressed_System_Windows_Input_MouseButtonEventArgs_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_). {% tabs %} {% highlight c# %} @@ -1127,7 +1127,7 @@ You can [download](https://github.com/SyncfusionExamples/how-to-prevent-the-sele ### Change the checkbox column values based on row selection -In tree grid, you can select multiple rows using the [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property. You can process the CheckBoxSelection using TreeGridCheckBoxColumn and a boolean property called `IsSelected` in Model. You can also select all the rows in tree grid by defining the CheckBox in header cell of GridCheckBoxColumn using [GridColumn.HeaderTemplate](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_HeaderTemplateProperty). +In TreeGrid, you can select multiple rows using the [SelectionMode](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property. You can process the CheckBoxSelection using TreeGridCheckBoxColumn and a boolean property called `IsSelected` in Model. You can also select all the rows by defining the CheckBox in header cell of GridCheckBoxColumn using [GridColumn.HeaderTemplate](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_HeaderTemplateProperty). {% tabs %} {% highlight c# %} @@ -1180,7 +1180,7 @@ You can download the [sample](https://github.com/SyncfusionExamples/how-to-chang ### Select the rows based on cell value -In tree grid, you can select the rows based on cell value by adding the corresponding records to SelectedItems. You can get the cell value of a particular cell using the `View.GetPropertyAccessProvider` method. +In TreeGrid, you can select the rows based on cell value by adding the corresponding records to SelectedItems. You can get the cell value of a particular cell using the `View.GetPropertyAccessProvider` method. {% tabs %} {% highlight c# %} @@ -1216,7 +1216,7 @@ private void Button_Click(object sender, RoutedEventArgs e) ### Search and select the record -You can search and select a record in tree grid based on the searched text using the TextChanged event of TextBox. +You can search and select a record in TreeGrid based on the searched text using the TextChanged event of TextBox. {% tabs %} {% highlight c# %} @@ -1299,9 +1299,9 @@ The `Row`/`Cell` selection border is behind the grid cell content. So, when you {% endhighlight %} {% endtabs %} -### Set the current cell on a particular row when tree grid is loaded +### Set the current cell on a particular row when TreeGrid is loaded -You can set the current cell in tree grid using the [treeGrid.SelectionController.MoveCurrentCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_MoveCurrentCell_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_System_Boolean_) method. +You can set the current cell in TreeGrid using the [treeGrid.SelectionController.MoveCurrentCell](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_MoveCurrentCell_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_System_Boolean_) method. {% tabs %} {% highlight c# %} @@ -1320,4 +1320,4 @@ private void TreeGrid_Loaded(object sender, RoutedEventArgs e) {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Serialization-and-Deserialization.md b/wpf/TreeGrid/Serialization-and-Deserialization.md index c0dad5cd7..5c1dba55b 100644 --- a/wpf/TreeGrid/Serialization-and-Deserialization.md +++ b/wpf/TreeGrid/Serialization-and-Deserialization.md @@ -1,19 +1,19 @@ --- layout: post -title: Serialization in WPF SfTreeGrid | Syncfusion® -description: Serialization in SfTreeGrid enables saving and restoring grid state with options to customize sorting, filtering, columns, and headers. +title: Serialization in WPF TreeGrid | Syncfusion® +description: Serialization in TreeGrid enables saving and restoring grid state with options to customize sorting, filtering, columns, and headers. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Serialization and Deserialization in WPF SfTreeGrid +# Serialization and Deserialization in WPF TreeGrid -SfTreeGrid allows you to serialize and deserialize the SfTreeGrid settings using [DataContractSerializer](https://learn.microsoft.com/en-us/dotnet/api/system.runtime.serialization.datacontractserializer?view=net-8.0). +WPF TreeGrid allows you to serialize and deserialize its settings using [DataContractSerializer](https://learn.microsoft.com/en-us/dotnet/api/system.runtime.serialization.datacontractserializer?view=net-8.0). ## Serialization -You can serialize the SfTreeGrid by using [SfTreeGrid.Serialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Serialize_System_IO_Stream_) method which exports the current TreeGrid control properties to an XML file. +You can serialize the TreeGrid by using [SfTreeGrid.Serialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Serialize_System_IO_Stream_) method which exports the current TreeGrid control properties to an XML file. {% tabs %} {% highlight c# %} @@ -26,7 +26,7 @@ using (var file = File.Create("TreeGrid.xml")) ### Serialize as Stream -You can store the SfTreeGrid settings as [Stream](https://learn.microsoft.com/en-us/dotnet/api/system.io.stream?view=net-8.0) using [Serialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Serialize_System_IO_Stream_) method by passing the stream. +You can store the TreeGrid settings as [Stream](https://learn.microsoft.com/en-us/dotnet/api/system.io.stream?view=net-8.0) using [Serialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Serialize_System_IO_Stream_) method by passing the stream. {% tabs %} {% highlight c# %} @@ -37,11 +37,11 @@ this.treeGrid.Serialize(stream); ## Serialization options -SfTreeGrid serialization operation can be customized by passing [TreeGridSerializationOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html) instance as an argument to [Serialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Serialize_System_IO_Stream_Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_) method. +TreeGrid serialization operation can be customized by passing [TreeGridSerializationOptions](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html) instance as an argument to [Serialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Serialize_System_IO_Stream_Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_) method. ### Serialize sorting -By default, SfTreeGrid allows you to serialize the sorting operation. You can disable the sorting serialization by setting the [TreeGridSerializationOptions.SerializeSorting](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeSorting) to `false`. +By default, TreeGrid allows you to serialize the sorting operation. You can disable the sorting serialization by setting the [TreeGridSerializationOptions.SerializeSorting](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeSorting) to `false`. {% tabs %} {% highlight c# %} @@ -56,7 +56,7 @@ using (var file = File.Create("TreeGrid.xml")) ### Serialize filtering -By default, SfTreeGrid allows you to serialize the filtering operation. You can disable the filtering serialization by setting the [TreeGridSerializationOptions.SerializeFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeFiltering) to `false`. +By default, TreeGrid allows you to serialize the filtering operation. You can disable the filtering serialization by setting the [TreeGridSerializationOptions.SerializeFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeFiltering) to `false`. {% tabs %} {% highlight c# %} @@ -71,7 +71,7 @@ using (var file = File.Create("TreeGrid.xml")) ### Serialize columns -By default, SfTreeGrid allows you to serialize the columns manipulation operation. You can disable the columns serialization by setting the [TreeGridSerializationOptions.SerializeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeColumns) to `false`. +By default, TreeGrid allows you to serialize the columns manipulation operation. You can disable the columns serialization by setting the [TreeGridSerializationOptions.SerializeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeColumns) to `false`. {% tabs %} {% highlight c# %} @@ -86,7 +86,7 @@ using (var file = File.Create("TreeGrid.xml")) ### Serialize stacked headers -By default, SfTreeGrid allows you to serialize the stack headers operation. You can disable the stack headers serialization by setting the [TreeGridSerializationOptions.SerializeStackedHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeStackedHeaders) to `false`. +By default, TreeGrid allows you to serialize the stack headers operation. You can disable the stack headers serialization by setting the [TreeGridSerializationOptions.SerializeStackedHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridSerializationOptions_SerializeStackedHeaders) to `false`. {% tabs %} {% highlight c# %} @@ -101,7 +101,7 @@ using (var file = File.Create("TreeGrid.xml")) ## Deserialization -You can deserialize the SfTreeGrid setting by using [SfTreeGrid.Deserialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Deserialize_System_IO_Stream_) method which reconstructs the SfTreeGrid based on the setting in the stored XML file. +You can deserialize the TreeGrid setting by using [SfTreeGrid.Deserialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Deserialize_System_IO_Stream_) method which reconstructs the control based on the setting in the stored XML file. {% tabs %} {% highlight c# %} @@ -114,7 +114,7 @@ using (var file = File.Open("TreeGrid.xml", FileMode.Open)) ### Deserialize from Stream -You can deserialize the SfTreeGrid settings from [Stream](https://learn.microsoft.com/en-us/dotnet/api/system.io.stream?view=net-8.0) using [Deserialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Deserialize_System_IO_Stream_) method. +You can deserialize the TreeGrid settings from [Stream](https://learn.microsoft.com/en-us/dotnet/api/system.io.stream?view=net-8.0) using [Deserialize](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Deserialize_System_IO_Stream_) method. {% tabs %} {% highlight c# %} @@ -129,7 +129,7 @@ Deserialization operation can be customized by passing [TreeGridDeserializationO ### Deserialize sorting -By default, SfTreeGrid allows you to deserialize the sorting operation. You can disable the sorting deserialization by setting the [TreeGridDeserializationOptions.DeserializeSorting](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeSorting) to `false`. +By default, TreeGrid allows you to deserialize the sorting operation. You can disable the sorting deserialization by setting the [TreeGridDeserializationOptions.DeserializeSorting](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeSorting) to `false`. {% tabs %} {% highlight c# %} @@ -144,7 +144,7 @@ using (var file = File.Open("TreeGrid.xml", FileMode.Open)) ### Deserialize filtering -By default, SfTreeGrid allows you to deserialize the filtering. you can disable the filtering deserialization by setting [TreeGridDeserializationOptions.DeserializeFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeFiltering) to `false`. +By default, TreeGrid allows you to deserialize the filtering. you can disable the filtering deserialization by setting [TreeGridDeserializationOptions.DeserializeFiltering](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeFiltering) to `false`. {% tabs %} {% highlight c# %} @@ -159,7 +159,7 @@ using (var file = File.Open("TreeGrid.xml", FileMode.Open)) ### Deserialize columns -By default, SfTreeGrid allows you to deserialize the columns manipulation operations. You can disable the columns deserialization by setting the [TreeGridDeserializationOptions.DeserializeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeColumns) to `false`. +By default, TreeGrid allows you to deserialize the columns manipulation operations. You can disable the columns deserialization by setting the [TreeGridDeserializationOptions.DeserializeColumns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeColumns) to `false`. {% tabs %} {% highlight c# %} @@ -174,7 +174,7 @@ using (var file = File.Open("TreeGrid.xml", FileMode.Open)) ### Deserialize stacked headers -By default, SfTreeGrid allows you to deserialize the stack headers. You can disable the stacked headers deserialization by setting the [TreeGridDeserializationOptions.DeserializeStackedHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeStackedHeaders) to `false`. +By default, TreeGrid allows you to deserialize the stack headers. You can disable the stacked headers deserialization by setting the [TreeGridDeserializationOptions.DeserializeStackedHeaders](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridDeserializationOptions.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridDeserializationOptions_DeserializeStackedHeaders) to `false`. {% tabs %} {% highlight c# %} @@ -189,7 +189,7 @@ using (var file = File.Open("TreeGrid.xml", FileMode.Open)) ## Customizing Serialization and Deserialization Operations -SfTreeGrid allows you to customize the serialization and deserialization operations by deriving [TreeGridSerializationController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationController.html) class and override the necessary virtual methods. +TreeGrid allows you to customize the serialization and deserialization operations by deriving [TreeGridSerializationController](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridSerializationController.html) class and override the necessary virtual methods. ### Serialize custom column @@ -228,7 +228,7 @@ typeof(string), typeof(TreeGridDatePickerColumn)); {% endhighlight %} {% endtabs %} -In the below code snippet, the TreeGridDatePickerColumn is defined in SfTreeGrid. +In the below code snippet, the TreeGridDatePickerColumn is defined in TreeGrid. {% tabs %} {% highlight xaml %} @@ -418,7 +418,7 @@ public class TreeGridSerializationControllerExt : TreeGridSerializationControlle ### Serializing template column content -By default, you cannot serialize the template content in SfTreeGrid. This is the default behavior during Serialization and Deserialization operation. +By default, you cannot serialize the template content in TreeGrid. This is the default behavior during Serialization and Deserialization operation. {% tabs %} {% highlight xaml %} diff --git a/wpf/TreeGrid/Sorting.md b/wpf/TreeGrid/Sorting.md index 75dcfb9eb..e3ded054b 100644 --- a/wpf/TreeGrid/Sorting.md +++ b/wpf/TreeGrid/Sorting.md @@ -1,16 +1,16 @@ ---- +--- layout: post -title: Sorting in WPF SfTreeGrid | Syncfusion® -description: Sorting in SfTreeGrid provides single and multi-column sorting, custom sorting, programmatic sorting, and sorting event support for efficient data organization. +title: Sorting in WPF TreeGrid | Syncfusion® +description: Sorting in TreeGrid provides single and multi-column sorting, custom sorting, programmatic sorting, and sorting event support for efficient data organization. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Sorting in WPF SfTreeGrid +# Sorting in WPF TreeGrid -SfTreeGrid allows you to sort the data against one or more columns either in ascending or descending order. When sorting is applied, the rows are rearranged based on sort criteria. You can allow users to sort the data by touching or clicking the column header using [SfTreeGrid.AllowSorting](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowSorting) property to `true`. +WPF TreeGrid allows you to sort the data against one or more columns either in ascending or descending order. When sorting is applied, the rows are rearranged based on sort criteria. You can allow users to sort the data by touching or clicking the column header using [SfTreeGrid.AllowSorting](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowSorting) property to `true`. {% tabs %} {% highlight xaml %} @@ -60,7 +60,7 @@ N> The[TreeGridColumn.AllowSorting](https://help.syncfusion.com/cr/wpf/Syncfusio End users can sort the column by clicking column header cell. Once the columns get sorted, the sort indicator will be displayed on the right side of the column header. -![WPF TreeGrid with Sorting](Sorting_images/wpf-treegrid-sorting.png) +![Sorting](Sorting_images/wpf-treegrid-sorting.png) ## Sort column in double click @@ -97,10 +97,10 @@ Following are the sequence of sorting orders when clicking column header, ## Multi column sorting -SfTreeGrid control allows you sort more than one column, where sorting is applied one column against other columns. To apply sorting on multiple columns, user have to click the column header by pressing the Ctrl key. +TreeGrid control allows you sort more than one column, where sorting is applied one column against other columns. To apply sorting on multiple columns, user have to click the column header by pressing the Ctrl key. In the below screen shot, the `First Name` column sorted. Then the `Employee ID` column is sorted against the `First Name` data by clicking column header by pressing Ctrl key. The sorting state of `First Name` column is preserved and `Employee ID` column sorted against `First Name` column. -![Multi Column Sorting in WPF TreeGrid](Sorting_images/wpf-treegrid-multi-column-sorting.png) +![Multi Column Sorting](Sorting_images/wpf-treegrid-multi-column-sorting.png) ### Display sort order @@ -124,7 +124,7 @@ this.treeGrid.ShowSortNumbers = true; {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays Sorting Order](Sorting_images/wpf-treegrid-sorting-order.png) +![displays Sorting Order](Sorting_images/wpf-treegrid-sorting-order.png) ## Programmatic Sorting @@ -186,7 +186,7 @@ this.treeGrid.SortColumnDescriptions.Clear(); ## Custom sorting -SfTreeGrid allows you to sort the columns based on the custom logic. The custom sorting can be applied by adding the [SortComparer](https://help.syncfusion.com/cr/wpf/Syncfusion.Data.SortComparer.html) instance to [SfTreeGrid.SortComparers](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortComparers). +TreeGrid allows you to sort the columns based on the custom logic. The custom sorting can be applied by adding the [SortComparer](https://help.syncfusion.com/cr/wpf/Syncfusion.Data.SortComparer.html) instance to [SfTreeGrid.SortComparers](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortComparers). The [SortComparer](https://help.syncfusion.com/cr/wpf/Syncfusion.Data.SortComparer.html) have the following properties, @@ -247,7 +247,7 @@ public class CustomSortComparer : IComparer, ISortDirection {% endhighlight %} {% endtabs %} -#### Adding custom comparer to SfTreeGrid +#### Adding custom comparer to TreeGrid Custom comparer can be added to [SfTreeGrid.SortComparers](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortComparers) property. `SortComparers` maintains custom comparers and the custom comparer gets called when corresponding column gets sorted by clicking column header or programmatically. @@ -270,7 +270,7 @@ this.treeGrid.SortComparers.Add(new SortComparer() { Comparer = new CustomSortCo Sorting `First Name` column sorts the data using custom sort comparer available in `SfTreeGrid.SortComparers`. -![WPF TreeGrid with Custom Sorting](Sorting_images/wpf-treegrid-custom-sorting.png) +![Custom Sorting](Sorting_images/wpf-treegrid-custom-sorting.png) ## Handling events @@ -311,4 +311,4 @@ private void TreeGrid_SortColumnsChanging(object sender, GridSortColumnsChanging [SfTreeGrid.SortColumnsChanged](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortColumnsChanged) event occurs when the sorting is applied to the column. [GridSortColumnsChangedEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridSortColumnsChangedEventArgs.html) provides information for `SortColumnsChanged` event. -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the TreeGrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Styles-and-Templates.md b/wpf/TreeGrid/Styles-and-Templates.md index 7d8f59423..f989468eb 100644 --- a/wpf/TreeGrid/Styles-and-Templates.md +++ b/wpf/TreeGrid/Styles-and-Templates.md @@ -1,17 +1,17 @@ --- layout: post -title: Styles and Templates in WPF SfTreeGrid | Syncfusion® -description: Styles and Templates in SfTreeGrid provide flexible customization of headers, cells, and rows using styles, control templates, and triggers. +title: Styles and Templates in WPF TreeGrid | Syncfusion® +description: Styles and Templates in TreeGrid provide flexible customization of headers, cells, and rows using styles, control templates, and triggers. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Styles and Templates in WPF SfTreeGrid +# Styles and Templates in WPF TreeGrid ## Styling Column Header -The header cell can be customized by writing style of TargetType [TreeGridHeaderCellControl](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridHeaderCell.html). You can set to particular SfTreeGrid by setting [SfTreeGrid.HeaderStyle](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_HeaderStyle) property and the particular column can be styled by setting [TreeGridColumn.HeaderStyle](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_HeaderStyleProperty) property. +The header cell can be customized by writing style of TargetType [TreeGridHeaderCellControl](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridHeaderCell.html). You can set to particular TreeGrid by setting [SfTreeGrid.HeaderStyle](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_HeaderStyle) property and the particular column can be styled by setting [TreeGridColumn.HeaderStyle](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_HeaderStyleProperty) property. N> `TreeGridColumn.HeaderStyle` takes higher priority than `SfTreeGrid.HeaderStyle` property. @@ -36,7 +36,7 @@ N> `TreeGridColumn.HeaderStyle` takes higher priority than `SfTreeGrid.HeaderSty {% endhighlight %} {% endtabs %} -![Customizing Header Cell in WPF TreeGrid Column](Styles-and-Templates_images/wpf-treegrid-header-cell-customization.png) +![Customizing Header Cell](Styles-and-Templates_images/wpf-treegrid-header-cell-customization.png) ### Styling Stacked Headers @@ -54,7 +54,7 @@ The appearance of stacked header can be customized by writing style of TargetTyp {% endhighlight %} {% endtabs %} -![Customizing Stacked Header in WPF TreeGrid Column](Styles-and-Templates_images/wpf-treegrid-stacked-headers.png) +![Customizing Stacked Header](Styles-and-Templates_images/wpf-treegrid-stacked-headers.png) ### Setting Different Style for Each Stacked Header @@ -108,7 +108,7 @@ public class TreeGridCustomStackedRenderer : TreeGridStackedHeaderCellRenderer {% endhighlight %} {% endtabs %} -![Changing Stacked Header Text Style in WPF TreeGrid Column](Styles-and-Templates_images/wpf-treegrid-stacked-header-text-style.png) +![Changing Stacked Header Text Style](Styles-and-Templates_images/wpf-treegrid-stacked-header-text-style.png) -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/Themes.md b/wpf/TreeGrid/Themes.md index 5f73bfbd2..4d67e5fab 100644 --- a/wpf/TreeGrid/Themes.md +++ b/wpf/TreeGrid/Themes.md @@ -1,25 +1,25 @@ --- layout: post -title: Themes in WPF SfTreeGrid | Syncfusion® -description: Themes in SfTreeGrid apply built in themes to customize grid appearance and maintain a consistent visual experience across applications. +title: Themes in WPF TreeGrid | Syncfusion® +description: Themes in TreeGrid apply built in themes to customize grid appearance and maintain a consistent visual experience across applications. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# Themes in WPF SfTreeGrid +# Themes in WPF TreeGrid -SfTreeGrid provides built-in themes which can be applied using [SfSkinManager](https://help.syncfusion.com/wpf/treegrid/themes) and also provides support to create custom theme using [theme studio](https://help.syncfusion.com/wpf/themes/theme-studio). +WPF TreeGrid provides built-in themes which can be applied using [SfSkinManager](https://help.syncfusion.com/wpf/treegrid/themes) and also provides support to create custom theme using [theme studio](https://help.syncfusion.com/wpf/themes/theme-studio). ## Built-in Themes -SfTreeGrid supports various built-in themes. Refer to the below links to apply themes for the SfTreeGrid, +TreeGrid supports various built-in themes. Refer to the below links to apply themes, * [Apply theme using SfSkinManager](https://help.syncfusion.com/wpf/themes/skin-manager) * [Create a custom theme using ThemeStudio](https://help.syncfusion.com/wpf/themes/theme-studio#creating-custom-theme) - ![Applying Theme in WPF TreeGrid](Getting-Started_images/wpf-treegrid-theme.png) + ![Applying Theme](Getting-Started_images/wpf-treegrid-theme.png) -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/ToolTip.md b/wpf/TreeGrid/ToolTip.md index 79bf5ebb5..194575de3 100644 --- a/wpf/TreeGrid/ToolTip.md +++ b/wpf/TreeGrid/ToolTip.md @@ -1,15 +1,15 @@ --- layout: post -title: ToolTip in WPF SfTreeGrid | Syncfusion® -description: ToolTip in SfTreeGrid displays additional information for cells, rows, and headers with customizable tooltip support. +title: ToolTip in WPF TreeGrid | Syncfusion® +description: ToolTip in TreeGrid displays additional information for cells, rows, and headers with customizable tooltip support. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# ToolTip in WPF SfTreeGrid +# ToolTip in WPF TreeGrid -Tooltip supports showing the pop-up window that displays the information when the mouse hovers over a cell of the SfTreeGrid. +Tooltip supports showing the pop-up window that displays the information when the mouse hovers over a cell of the TreeGrid. ## Record cell tooltip @@ -51,7 +51,7 @@ this.treeGrid.Columns["LastName"].ShowToolTip = true; N> It has higher priority than [SfTreeGrid.ShowToolTip](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_ShowToolTip). -![WPF TreeGrid displays ToolTip for Record Cell](Interactive-Features_images/wpf-treegrid-record-cell-tooltip.png) +![displays ToolTip for Record Cell](Interactive-Features_images/wpf-treegrid-record-cell-tooltip.png) ## Header tooltip @@ -72,7 +72,7 @@ this.treeGrid.Columns["FirstName"].ShowHeaderToolTip = true; {% endhighlight %} {% endtabs %} -![WPF TreeGrid displays ToolTip for Header](Interactive-Features_images/wpf-treegrid-header-tooltip.png) +![displays ToolTip for Header](Interactive-Features_images/wpf-treegrid-header-tooltip.png) ## Tooltip customization @@ -96,7 +96,7 @@ You can change appearance of the tooltip by customizing the style with TargetTyp {% endhighlight %} {% endtabs %} -![Customizing ToolTip in WPF TreeGrid](Interactive-Features_images/wpf-treegrid-tooltip-customization.png) +![Customizing ToolTip](Interactive-Features_images/wpf-treegrid-tooltip-customization.png) You can customize the template of the tooltip by using the [TreeGridColumn.ToolTipTemplate](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridColumnBase.html#Syncfusion_UI_Xaml_Grid_GridColumnBase_ToolTipTemplate) and [TreeGridColumn.ToolTipTemplateSelector](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridColumnBase.html#Syncfusion_UI_Xaml_Grid_GridColumnBase_ToolTipTemplateSelector) properties. @@ -152,7 +152,7 @@ public class StringToImageConverter : IValueConverter {% endhighlight %} {% endtabs %} -![Customize the ToolTip using ToolTipTemplate in WPF TreeGrid](Interactive-Features_images/wpf-treegrid-tooltip-template.png) +![Customize the ToolTip using ToolTipTemplate](Interactive-Features_images/wpf-treegrid-tooltip-template.png) You can get the sample [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/ToolTipTemplateDemo-1415306479.zip). @@ -231,11 +231,11 @@ public class ToolTipTemplateSelector : DataTemplateSelector The following image shows the DefaultTemplate applied through ToolTipTemplateSelector. -![Customize the ToolTip using ToolTipTemplateSelector in WPF TreeGrid](Interactive-Features_images/wpf-treegrid-tooltip-template-selector.png) +![Customize the ToolTip using ToolTipTemplateSelector](Interactive-Features_images/wpf-treegrid-tooltip-template-selector.png) The following image shows the AlternateTemplate applied through ToolTipTemplateSelector. -![Customize the ToolTip using ToolTipTemplateSelector in WPF TreeGrid](Interactive-Features_images/wpf-treegrid-tooltip-using-template-selector.png) +![Customize the ToolTip using ToolTipTemplateSelector](Interactive-Features_images/wpf-treegrid-tooltip-using-template-selector.png) You can get the sample [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/ToolTipTemplateSelectorDemo1909534526.zip). @@ -246,7 +246,7 @@ You can get the sample [here](https://www.syncfusion.com/downloads/support/direc The [CellToolTipOpening](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when any tooltip of the cell is opened. The `CellToolTipOpening` event receives the [TreeGridCellToolTipOpeningEventArgs](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.TreeGrid.TreeGridCellToolTipOpeningEventArgs.html) as argument which has the following properties:
    -
  • Column: Gets the hovered cell column in the SfTreeGrid.
    • +
  • Column: Gets the hovered cell column in the TreeGrid.
  • Node: Gets the hovered cell node.
  • Record: Gets the data context of hovered cell.
  • RowColumnIndex: Gets the row and column index of the hovered cell.
    • @@ -275,4 +275,4 @@ private void TreeGrid_CellToolTipOpening(object sender, Syncfusion.UI.Xaml.TreeG {% endtabs %} -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file diff --git a/wpf/TreeGrid/UI-Automation.md b/wpf/TreeGrid/UI-Automation.md index 3aee38e7f..c6282c789 100644 --- a/wpf/TreeGrid/UI-Automation.md +++ b/wpf/TreeGrid/UI-Automation.md @@ -1,22 +1,22 @@ --- layout: post -title: UI Automation in WPF SfTreeGrid | Syncfusion® -description: UI Automation in SfTreeGrid enables accessibility and automated testing support through built‑in UI Automation providers for grid elements. +title: UI Automation in WPF TreeGrid | Syncfusion® +description: UI Automation in TreeGrid enables accessibility and automated testing support through built‑in UI Automation providers for grid elements. platform: wpf -control: SfTreeGrid +control: TreeGrid documentation: ug --- -# UI Automation in WPF SfTreeGrid +# UI Automation in WPF TreeGrid ## Requirements and configuration -To test SfTreeGrid control with CUITs, build the extension project and place it in the mentioned location. You can get the extension project from the following location. +To test TreeGrid control with CUITs, build the extension project and place it in the mentioned location. You can get the extension project from the following location.
    -{{'**SfTreeGrid**'| markdownify }} +{{'**TreeGrid**'| markdownify }} https://github.com/SyncfusionExamples/coded-ui-extension-project-for-wpf-treegrid @@ -49,9 +49,9 @@ N> Syncfusion.VisualStudio.TestTools.UITest.SfGridExtension.dll needs to be inst ### Steps to work with Coded UI -This section explains how to create a CodedUITest project and test the tree grid application. +This section explains how to create a CodedUITest project and test the TreeGrid application. -1. Create a new WPF application or open an existing WPF application with tree grid and enable the Coded UI test in tree grid. To enable CUITs, set AutomationPeerHelper.EnableCodedUI to true and access the AutomationPeerHelper class from Syncfusion.UI.Xaml.Grid namespace as demonstrated in the following code sample. +1. Create a new WPF application or open an existing WPF application with TreeGrid and enable the Coded UI testing. To enable CUITs, set AutomationPeerHelper.EnableCodedUI to true and access the AutomationPeerHelper class from Syncfusion.UI.Xaml.Grid namespace as demonstrated in the following code sample. {% capture codesnippet1 %} {% tabs %} @@ -108,8 +108,8 @@ public MainWindow() CodedUITestMethod {:.caption} -7. Now, drag the Crosshairs to the UI elements of your WPF SfTreeGrid application, and it shows the available properties of the inner UI elements in SfTreeGrid. -8. Record the actions made on UI elements by clicking the Record button on the CodedUITest builder. For example you can record the action of changing the cell value in SfTreeGrid. Click the Pause button to finish the record. +7. Now, drag the Crosshairs to the UI elements of your WPF TreeGrid application, and it shows the available properties of the inner UI elements. +8. Record the actions made on UI elements by clicking the Record button on the CodedUITest builder. For example you can record the action of changing the cell value in TreeGrid. Click the Pause button to finish the record. @@ -160,7 +160,7 @@ public void RecordedMethod1() 11. After all the tests and assertion have been created, right-click the Test method, and click Run Tests to run the test as follows. - ![Test method and click Run Tests ](UIAutomation_images/UIAutomation_img7.png) + ![Test method and click Run Tests](UIAutomation_images/UIAutomation_img7.png) @@ -328,4 +328,4 @@ SfTreeGridExpanderCellPropertyProvider
    -N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the treegrid. \ No newline at end of file +N> You can refer to our [WPF TreeGrid](https://www.syncfusion.com/wpf-controls/treegrid) feature tour page for its groundbreaking feature representations. You can also explore our [WPF TreeGrid example](https://github.com/syncfusion/wpf-demos) to know how to render and configure the control. \ No newline at end of file