From a4bba343e66e86a0bdb7b7e335696b4e262989a7 Mon Sep 17 00:00:00 2001 From: SreemonPremkumarMuthukrishnan Date: Wed, 16 Sep 2026 14:56:10 +0530 Subject: [PATCH] Documentation(ES-1048034): Redundant changes for the UWP TreeGrid --- uwp/TreeGrid/Clipboard-Operations.md | 66 +++++++++---------- uwp/TreeGrid/ColumnTypes.md | 12 ++-- uwp/TreeGrid/Columns.md | 26 ++++---- uwp/TreeGrid/Conditional-Styling.md | 16 ++--- uwp/TreeGrid/Data-Binding.md | 38 +++++------ uwp/TreeGrid/Data-Validation.md | 10 +-- uwp/TreeGrid/Editing.md | 18 ++--- uwp/TreeGrid/Export-To-Excel.md | 30 ++++----- uwp/TreeGrid/Export-To-PDF.md | 16 ++--- uwp/TreeGrid/Filtering.md | 16 ++--- uwp/TreeGrid/Getting-Started.md | 98 ++++++++++++++-------------- uwp/TreeGrid/Helpers.md | 6 +- uwp/TreeGrid/Interactive-Features.md | 14 ++-- uwp/TreeGrid/Localization.md | 14 ++-- uwp/TreeGrid/MVVM.md | 12 ++-- uwp/TreeGrid/Node-CheckBox.md | 6 +- uwp/TreeGrid/Row-Drag-And-Drop.md | 20 +++--- uwp/TreeGrid/Rows.md | 16 ++--- uwp/TreeGrid/Selection.md | 52 +++++++-------- uwp/TreeGrid/Sorting.md | 8 +-- uwp/TreeGrid/ToolTip.md | 4 +- 21 files changed, 249 insertions(+), 249 deletions(-) diff --git a/uwp/TreeGrid/Clipboard-Operations.md b/uwp/TreeGrid/Clipboard-Operations.md index a5ab78b8..b0df8f8d 100644 --- a/uwp/TreeGrid/Clipboard-Operations.md +++ b/uwp/TreeGrid/Clipboard-Operations.md @@ -9,7 +9,7 @@ documentation: ug # Clipboard Operations in UWP 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 the selected nodes/cells from tree grid by clicking `Ctrl+C` and can paste the content from [Clipboard](https://msdn.microsoft.com/en-us/library/system.windows.clipboard.aspx) to tree grid by clicking `Ctrl+V`. +UWP TreeGrid provides support to the clipboard operations such as cut, copy, and paste the data within the control and between other applications such as Notepad and Excel. The clipboard operations of copy and paste are enabled by default. You can copy the selected nodes/cells from TreeGrid by clicking `Ctrl+C` and can paste the content from [Clipboard](https://msdn.microsoft.com/en-us/library/system.windows.clipboard.aspx) to TreeGrid by clicking `Ctrl+V`. ## Copy @@ -17,9 +17,9 @@ The copy operation works based on the [GridCopyOption](https://help.syncfusion.c GridCopyOption provides the following options: -* [None](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables copy in tree grid. +* [None](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables copy in the control. -* [CopyData](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Enables copy in tree grid. +* [CopyData](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Enables copy in the control. * [IncludeHeaders](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Copies column header along with data. @@ -50,7 +50,7 @@ this.treeGrid.GridCopyOption = GridCopyOption.CopyData | GridCopyOption.IncludeH {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Copied content pasted in notepad](Clipboard-Operations_images/Clipboard-Operations_img1.jpeg) +![Copied content pasted in notepad](Clipboard-Operations_images/Clipboard-Operations_img1.jpeg) ## Paste @@ -58,9 +58,9 @@ The paste operation works based on the [GridPasteOption](https://help.syncfusion GridPasteOption provides the following options: -* [None](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Disables paste in tree grid. +* [None](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Disables paste in the control. -* [PasteData](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Enables paste in the control. 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/uwp/Syncfusion.UI.Xaml.Grid.GridPasteOption.html): Pastes data copied with `IncludeHeaders` copy option. @@ -93,7 +93,7 @@ this.treeGrid.GridPasteOption = GridPasteOption.PasteData | GridPasteOption.Excl {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Copied record pasted in new record](Clipboard-Operations_images/Clipboard-Operations_img2.jpeg) +![Copied record pasted in new record](Clipboard-Operations_images/Clipboard-Operations_img2.jpeg) ## Cut @@ -101,9 +101,9 @@ The cut operation works based on the [GridCopyOption](https://help.syncfusion.co GridCopyOption provides the following options: -* [None](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables cut in tree grid. +* [None](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html): Disables cut in the control. -* [CutData](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html) – Enables cut in tree grid. +* [CutData](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html) – Enables cut in the control. * [IncludeHeaders](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyOption.html):Copies column header along with data. @@ -130,13 +130,13 @@ this.treeGrid.GridCopyOption = GridCopyOption.CutData | GridCopyOption.IncludeHe {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Data from the record is cut and pasted in notepad](Clipboard-Operations_images/Clipboard-Operations_img3.jpeg) +![Data from a record cut and pasted in notepad](Clipboard-Operations_images/Clipboard-Operations_img3.jpeg) ## Events ### CopyContent -The [CopyContent](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when copy/cut the cells in tree grid. [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information for to the `CopyContent` event. You can cancel copy operation by handling this event. +The [CopyContent](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when copy/cut the cells in the control. [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information for to the `CopyContent` event. You can cancel copy operation by handling this event. {% tabs %} {% highlight c# %} @@ -153,7 +153,7 @@ private void TreeGrid_CopyContent(object sender, GridCopyPasteEventArgs e) ### PasteContent -The [PasteContent](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when paste the clipboard value into tree grid. [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information to the PasteContent event. You can cancel the paste operation by handling this event. +The [PasteContent](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs when paste the clipboard value into the control. [GridCopyPasteEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCopyPasteEventArgs.html) provides information to the PasteContent event. You can cancel the paste operation by handling this event. {% tabs %} {% highlight c# %} @@ -179,7 +179,7 @@ The [CopyGridCellContent](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml. * [RowData](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCopyPasteCellEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCopyPasteCellEventArgs_RowData): Returns corresponding RowData of a cell. -* [OriginalSender](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCancelEventArgs.html#Syncfusion_UI_Xaml_Grid_GridCancelEventArgs_OriginalSender): Returns SfTreeGrid. +* [OriginalSender](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCancelEventArgs.html#Syncfusion_UI_Xaml_Grid_GridCancelEventArgs_OriginalSender): Returns TreeGrid. You can change the text copied to clipboard by changing the ClipBoardValue. @@ -195,7 +195,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 the control. {% tabs %} {% highlight c# %} @@ -207,7 +207,7 @@ private void TreeGrid_CopyCellContent(object sender, TreeGridCopyPasteCellEventA {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Copied data customized through CopyCellContent event](Clipboard-Operations_images/Clipboard-Operations_img4.jpeg) +![Copied data customized through the CopyCellContent event](Clipboard-Operations_images/Clipboard-Operations_img4.jpeg) The following code example demonstrates how to handle the copy operation when MappingName of a Column is Id. @@ -221,7 +221,7 @@ private void TreeGrid_CopyCellContent(object sender, TreeGridCopyPasteCellEventA {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Copy operation for a column handled through CopyCellContent event](Clipboard-Operations_images/Clipboard-Operations_img5.jpeg) +![Copy operation for a column handled through the CopyCellContent event](Clipboard-Operations_images/Clipboard-Operations_img5.jpeg) ### PasteCellContent @@ -233,9 +233,9 @@ The [PasteGridCellContent](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml * [RowData](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCopyPasteCellEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCopyPasteCellEventArgs_RowData): Returns the corresponding RowData of a cell. -* [OriginalSender](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCancelEventArgs.html#Syncfusion_UI_Xaml_Grid_GridCancelEventArgs_OriginalSender): Returns SfTreeGrid. +* [OriginalSender](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridCancelEventArgs.html#Syncfusion_UI_Xaml_Grid_GridCancelEventArgs_OriginalSender): Returns TreeGrid. -You can paste the text to tree grid by changing the ClipBoardValue. +You can paste the text to the control by changing the ClipBoardValue. {% tabs %} {% highlight c# %} @@ -263,7 +263,7 @@ private void TreeGrid_PasteCellContent(object sender, TreeGridCopyPasteCellEvent {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Data of a column customized when pasting through PasteCellContent event](Clipboard-Operations_images/Clipboard-Operations_img6.jpeg) +![Data of a column customized when pasting through the PasteCellContent event](Clipboard-Operations_images/Clipboard-Operations_img6.jpeg) The following code example demonstrates how to handle the paste operation when MappingName of column is Id. @@ -279,13 +279,13 @@ private void TreeGrid_PasteCellContent(object sender, TreeGridCopyPasteCellEvent {% endhighlight %} {% endtabs %} -![UWP treegrid shows with Paste operation of a column is handled through PasteCellContent event](Clipboard-Operations_images/Clipboard-Operations_img7.jpeg) +![Paste operation of a column handled through the PasteCellContent event](Clipboard-Operations_images/Clipboard-Operations_img7.jpeg) ## Handle the clipboard operations programmatically ### Copy the node programmatically -Copy the selected nodes in tree grid using the [Copy](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Copy the selected nodes in TreeGrid using the [Copy](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -295,7 +295,7 @@ this.treeGrid.TreeGridCopyPaste.Copy(); {% endhighlight %} {% endtabs %} -Copy a record by selecting the record using the [MoveCurrentCell](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_MoveCurrentCell_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_System_Boolean_) method and [Copy](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Copy a record by selecting the record using the [MoveCurrentCell](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_MoveCurrentCell_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_System_Boolean_) method and [Copy](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -308,7 +308,7 @@ this.treeGrid.TreeGridCopyPaste.Copy(); {% endhighlight %} {% endtabs %} -Copy multiple records by selecting a group of records using the SelectRows method and [Copy](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Copy multiple records by selecting a group of records using the SelectRows method and [Copy](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Copy) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -318,9 +318,9 @@ this.treeGrid.TreeGridCopyPaste.Copy(); {% endhighlight %} {% endtabs %} -### Paste to tree grid programmatically +### Paste to TreeGrid programmatically -Paste the clipboard value into tree grid using the [Paste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Paste) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Paste the clipboard value into TreeGrid using the [Paste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Paste) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -329,7 +329,7 @@ this.treeGrid.TreeGridCopyPaste.Paste(); {% endhighlight %} {% endtabs %} -Paste the clipboard value into selected record by selecting the record using the MoveCurrentCell method and `Paste` method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Paste the clipboard value into selected record by selecting the record using the MoveCurrentCell method and `Paste` method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -342,9 +342,9 @@ this.treeGrid.TreeGridCopyPaste.Paste(); {% endhighlight %} {% endtabs %} -### Cut from tree grid programmatically +### Cut from TreeGrid programmatically -Cut the selected records/cells in tree grid using the [Cut](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Cut) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Cut the selected records/cells in TreeGrid using the [Cut](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_Cut) method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -352,7 +352,7 @@ this.treeGrid.TreeGridCopyPaste.Cut(); {% endhighlight %} {% endtabs %} -Cut the entire record in tree grid by selecting whole tree grid using the [SelectAll](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_SelectAll) method and `Cut` method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of tree grid. +Cut the entire record in TreeGrid by selecting whole TreeGrid using the [SelectAll](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_SelectAll) method and `Cut` method in [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) of TreeGrid. {% tabs %} {% highlight c# %} @@ -363,7 +363,7 @@ this.treeGrid.TreeGridCopyPaste.Cut(); ## Customize copy paste behavior -The tree grid processes the clipboard operations in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/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/uwp/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# %} @@ -387,7 +387,7 @@ public MainPage() ### Paste a record into selected rows -By default, you can copy a row and paste it into another row in tree grid. The following code example shows how to copy a row and paste it into all the selected rows by overriding the [PasteRow](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. +By default, you can copy a row and paste it into another row in TreeGrid. The following code example shows how to copy a row and paste it into all the selected rows by overriding the [PasteRow](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. {% tabs %} {% highlight c# %} @@ -431,7 +431,7 @@ public class CustomCopyPaste : TreeGridCutCopyPaste ### Select pasted records -By default, after pasting the clipboard value to tree grid, the selection is maintained in previously selected records. The following code example shows how to select the pasted records by overriding the [PasteRow](https://help.syncfusion.com/cr/uwp/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/uwp/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 example shows how to select the pasted records by overriding the [PasteRow](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. {% tabs %} {% highlight c# %} @@ -455,7 +455,7 @@ public class CustomCopyPaste : TreeGridCutCopyPaste ### Create new records when pasting -By default, when paste the clipboard value to tree grid, it changes the values of the already existing records. The following code example shows how to add the copied records as new rows in tree grid by overriding the [PasteRows](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteRows_System_Object_) method in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. +By default, when paste the clipboard value to TreeGrid, it changes the values of the already existing records. The following code example shows how to add the copied records as new rows in TreeGrid by overriding the [PasteRows](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCutCopyPaste_PasteRows_System_Object_) method in the [TreeGridCutCopyPaste](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCutCopyPaste.html) class. {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/ColumnTypes.md b/uwp/TreeGrid/ColumnTypes.md index 76cbf821..c01f8120 100644 --- a/uwp/TreeGrid/ColumnTypes.md +++ b/uwp/TreeGrid/ColumnTypes.md @@ -10,7 +10,7 @@ documentation: ug # Column Types in UWP TreeGrid -SfTreeGrid provides support for various built-in column types. Each column has its own properties and renderer to handle different types of data. +UWP 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. @@ -106,7 +106,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 @@ -1213,7 +1213,7 @@ this.treeGrid.Columns.Add(new TreeGridTemplateColumn() You can allow `UIElement` loaded inside `CellTemplate` to handle keyboard interaction by setting `[FocusManagerHelper.WantsKeyInput](https://help.syncfusion.com/cr/uwp/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`. @@ -1447,7 +1447,7 @@ treeGrid.Columns.Add(new TreeGridComboBoxColumn() {% endhighlight %} {% endtabs %} -SfTreeGrid triggers, `CurrentCellDropDownSelectionChanged` event, when the SelectedValue is changed. [CurrentCellDropDownSelectionChangedEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.CurrentCellDropDownSelectionChangedEventArgs.html) of [CurrentCellDropDownSelectionChanged](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event provides the information about the changed cell value. +TreeGrid triggers, `CurrentCellDropDownSelectionChanged` event, when the SelectedValue is changed. [CurrentCellDropDownSelectionChangedEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.CurrentCellDropDownSelectionChangedEventArgs.html) of [CurrentCellDropDownSelectionChanged](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event provides the information about the changed cell value. `SelectedIndex` property returns the index of selected item. @@ -1654,11 +1654,11 @@ You can change the foreground color of `TreeGridHyperlinkColumn` by writing the ## 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 column types in SfTreeGrid. +You can create your own column by overriding the predefined column types in TreeGrid. For example, the `TreeGridDateTimeColumn` loads the `DateTime` value by default. If you want to display [DateTimeOffset](https://msdn.microsoft.com/en-us/library/system.datetimeoffset.aspx) value, you can create a new column by overriding the `TreeGridDateTimeColumn` class. diff --git a/uwp/TreeGrid/Columns.md b/uwp/TreeGrid/Columns.md index 7164f8a9..141408b0 100644 --- a/uwp/TreeGrid/Columns.md +++ b/uwp/TreeGrid/Columns.md @@ -9,9 +9,9 @@ documentation: ug # Columns in UWP TreeGrid -SfTreeGrid allows you to add or remove columns using [SfTreeGrid.Columns](https://help.syncfusion.com/cr/uwp/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`. +UWP TreeGrid allows you to add or remove columns using [SfTreeGrid.Columns](https://help.syncfusion.com/cr/uwp/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.
@@ -82,7 +82,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 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 @@ -145,7 +145,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 @@ -251,7 +251,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 %} @@ -330,7 +330,7 @@ Below screenshot shows the customized header template loaded on the header of Fi ### Data Annotations with AutoGenerateColumns -SfTreeGrid support to generate the columns based on built-in [Data Annotation Attributes](https://msdn.microsoft.com/en-us/library/mt185499.aspx). Data Annotations ignored, when the `AutoGenerateColumns` is set to False. +TreeGrid support to generate the columns based on built-in [Data Annotation Attributes](https://msdn.microsoft.com/en-us/library/mt185499.aspx). Data Annotations ignored, when the `AutoGenerateColumns` is set to False. #### Exclude column @@ -463,7 +463,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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) collection. {% tabs %} {% highlight xaml %} @@ -545,7 +545,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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingColumns) or +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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingColumns) or [TreeGridColumn.AllowResizing](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_AllowResizing) property. @@ -568,7 +568,7 @@ You can change the column width by clicking and dragging the resizing cursor at ### 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/uwp/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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowResizingHiddenColumns) property to `true`. ![Hidden column resizing](Columns_images/Columns_img4.jpeg) @@ -592,7 +592,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# %} @@ -691,7 +691,7 @@ this.treeGrid.FooterColumnCount = 2; ## 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/uwp/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/uwp/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](http://help.syncfusion.com/cr/uwp/Syncfusion.SfGrid.UWP~Syncfusion.UI.Xaml.Grid.StackedHeaderRow.html) contains the [StackedColumns](http://help.syncfusion.com/cr/uwp/Syncfusion.SfGrid.UWP~Syncfusion.UI.Xaml.Grid.StackedHeaderRow~StackedColumns.html) where each [StackedColumn](http://help.syncfusion.com/cr/uwp/Syncfusion.SfGrid.UWP~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. @@ -821,7 +821,7 @@ private void TreeGrid_Loaded(object sender, RoutedEventArgs e) ## Column Sizing -SfTreeGrid allows you to set the column widths based on certain logic using [SfTreeGrid.ColumnSizer](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ColumnSizer) or [TreeGridColumn.ColumnSizer](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_ColumnSizer) property. +TreeGrid allows you to set the column widths based on certain logic using [SfTreeGrid.ColumnSizer](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ColumnSizer) or [TreeGridColumn.ColumnSizer](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridColumn_ColumnSizer) property. Below is the list of predefined column sizing options available. @@ -854,7 +854,7 @@ Default column width or defined width set to column. ## 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# %} diff --git a/uwp/TreeGrid/Conditional-Styling.md b/uwp/TreeGrid/Conditional-Styling.md index b5d72180..7f84193e 100644 --- a/uwp/TreeGrid/Conditional-Styling.md +++ b/uwp/TreeGrid/Conditional-Styling.md @@ -8,7 +8,7 @@ documentation: ug --- # Conditional Styling in UWP TreeGrid -You can style the treegrid and its inner elements conditionally based on data in three ways, +You can style the control and its inner elements conditionally based on data in three ways, 1. Using Converter 2. Using Data Triggers @@ -98,7 +98,7 @@ internal class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![Styling cells using converter in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img1.jpeg) +![Styling cells using converter](Conditional-Styling_images/Conditional-Styling_img1.jpeg) ### Style cells based on record using converter @@ -140,7 +140,7 @@ internal class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![Styling cells based on record in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img2.jpeg) +![Styling cells based on record](Conditional-Styling_images/Conditional-Styling_img2.jpeg) ### Style cells using style selector @@ -176,7 +176,7 @@ public class SelectorClass : StyleSelector {% endhighlight %} {% endtabs %} -![Styling cells using style selector in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img3.jpeg) +![Styling cells using style selector](Conditional-Styling_images/Conditional-Styling_img3.jpeg) ### Add image to cell @@ -227,7 +227,7 @@ public object ConvertBack(object value, Type targetType, object parameter, strin {% endhighlight %} {% endtabs %} -![Adding images in a cell in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img4.jpeg) +![Adding images in a cell](Conditional-Styling_images/Conditional-Styling_img4.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/UWP). @@ -273,7 +273,7 @@ internal class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![Styling rows using converter in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img5.jpeg) +![Styling rows using converter](Conditional-Styling_images/Conditional-Styling_img5.jpeg) ### Style rows using style selector @@ -307,7 +307,7 @@ public class SelectorClass : StyleSelector {% endhighlight %} {% endtabs %} -![Styling rows using style selector in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img6.jpeg) +![Styling rows using style selector](Conditional-Styling_images/Conditional-Styling_img6.jpeg) ## Row Header @@ -342,5 +342,5 @@ internal class StyleConverter : IValueConverter {% endhighlight %} {% endtabs %} -![Styling row header in UWP treegrid](Conditional-Styling_images/Conditional-Styling_img7.jpeg) +![Styling row header](Conditional-Styling_images/Conditional-Styling_img7.jpeg) diff --git a/uwp/TreeGrid/Data-Binding.md b/uwp/TreeGrid/Data-Binding.md index dc6aa333..44143952 100644 --- a/uwp/TreeGrid/Data-Binding.md +++ b/uwp/TreeGrid/Data-Binding.md @@ -9,10 +9,10 @@ documentation: ug # Data Binding in UWP 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/uwp/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 with [RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems). -If the data source implements [INotifyCollectionChanged](https://learn.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=net-7.0&redirectedfrom=MSDN) 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?view=net-7.0&redirectedfrom=MSDN), SfTreeGrid automatically refreshes 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?view=net-7.0&redirectedfrom=MSDN), SfTreeGrid will not refresh the UI automatically. +UWP 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/uwp/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 with [RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems). +If the data source implements [INotifyCollectionChanged](https://learn.microsoft.com/en-us/dotnet/api/system.collections.specialized.inotifycollectionchanged?view=net-7.0&redirectedfrom=MSDN) interface, then the 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?view=net-7.0&redirectedfrom=MSDN), TreeGrid automatically refreshes 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?view=net-7.0&redirectedfrom=MSDN), TreeGrid 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](http://help.syncfusion.com/uwp/sftreegrid/getting-started#binding-self-relational-data-in-sftreegrid) * [Populate data using nested collection](http://help.syncfusion.com/uwp/sftreegrid/getting-started#binding-nested-collection-with-sftreegrid) @@ -20,18 +20,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://msdn.microsoft.com/en-us/library/system.collections.ienumerable) interface. Data operations such as sorting is supported when you are binding collection derived from `IEnumerable`. +TreeGrid control supports to bind any collection that implements the [IEnumerable](https://msdn.microsoft.com/en-us/library/system.collections.ienumerable) 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?view=net-7.0&redirectedfrom=MSDN). Below are the limitations when you are binding dynamic data object, +TreeGrid control supports to bind [dynamic data object](https://learn.microsoft.com/en-us/dotnet/api/system.dynamic?view=net-7.0&redirectedfrom=MSDN). 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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. +2. TreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/uwp/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 control 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 %} @@ -52,11 +52,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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. +TreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/uwp/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 %} @@ -77,11 +77,11 @@ this.treeGrid.Columns.Add(new TreeGridTextColumn() {MappingName="Marks[0]"}); **Limitations when binding complex property:** -SfTreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. +TreeGrid doesn’t support [LiveNodeUpdateMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode) - `AllowDataShaping`. ## AutoExpandMode -By setting [SfTreeGrid.AutoExpandMode](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoExpandMode) property, you can let TreeGrid to expand the nodes while loading. @@ -310,7 +310,7 @@ You can collapse all the tree nodes or specific node and its child nodes. Here i {{'[CollapseAllNodes()](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CollapseAllNodes)'| markdownify }} @@ -334,7 +334,7 @@ Collapse the node at specific row index {{'[CollapseNode(TreeNode treeNode)](https://help.syncfusion.com/cr/uwp/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
@@ -438,7 +438,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/uwp/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/uwp/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 %} @@ -454,7 +454,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/uwp/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/uwp/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 %} @@ -478,7 +478,7 @@ treeGrid.LiveNodeUpdateMode = LiveNodeUpdateMode.AllowDataShaping; [SfTreeGrid.ItemsSourceChanged](https://help.syncfusion.com/cr/uwp/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/uwp/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: @@ -487,8 +487,8 @@ The `GridItemsSourceChangedEventArgs` object contains the following properties ## View -SfTreeGrid has the [View](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_View) property of type [TreeGridView](https://help.syncfusion.com/cr/uwp/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. -SfTreeGrid creates different types of views derived from TreeGridView based on data population methods. +TreeGrid has the [View](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_View) property of type [TreeGridView](https://help.syncfusion.com/cr/uwp/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 TreeGrid or wire `RequestTreeItems` event, then `View` will be created and maintains the operations on nodes. +TreeGrid creates different types of views derived from TreeGridView based on data population methods. [TreeGridSelfRelationalView](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridSelfRelationalView.html) - While populating data using self-relational binding. @@ -560,4 +560,4 @@ treeGrid.View.EndInit(); {% endhighlight %} {% endtabs %} -N> View has properties (`EnableRecursiveChecking`, `LiveNodeUpdateMode`, `RecursiveCheckingMode`,...) that are already defined in SfTreeGrid. It is recommended to set those properties via SfTreeGrid. +N> View has properties (`EnableRecursiveChecking`, `LiveNodeUpdateMode`, `RecursiveCheckingMode`,...) that are already defined in TreeGrid. It is recommended to set those properties via TreeGrid. diff --git a/uwp/TreeGrid/Data-Validation.md b/uwp/TreeGrid/Data-Validation.md index 285ad661..83932f45 100644 --- a/uwp/TreeGrid/Data-Validation.md +++ b/uwp/TreeGrid/Data-Validation.md @@ -9,7 +9,7 @@ documentation: ug # Data Validation in UWP 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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCell.html). When mouse over the error icon, error information will be displayed in tooltip. +UWP 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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCell.html). When mouse over the error icon, error information will be displayed in tooltip. ## Built-in validations @@ -147,7 +147,7 @@ public string CustomerID ## Custom validation through events -You can validate the cells and rows using [CurrentCellValidating](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) and [RowValidating](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) events. SfTreeGrid will not allow user to edit other cell / row if validation is failed. +You can validate the cells and rows using [CurrentCellValidating](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) and [RowValidating](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) events. TreeGrid will not allow user to edit other cell / row if validation is failed. ### Cell Validation @@ -224,7 +224,7 @@ void treeGrid_RowValidated(object sender, TreeGridRowValidatedEventArgs e) ### Customizing error icon -You can customize the error icon by editing `TreeGridCell` control template. If you want to customize the error icon in expander column, you need to edit the control template of [TreeGridExpanderCell](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridExpanderCell.html). +You can customize the error icon by editing the `TreeGridCell` control template.If you want to customize the error icon in expander column, you need to edit the control template of [TreeGridExpanderCell](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridExpanderCell.html). #### Change the shape of error icon @@ -544,7 +544,7 @@ You can change the error tip background color by setting `Background` property o ## Showing error details in RowHeader -SfTreeGrid supports to show the error information in row header by setting INotifyDataErrorInfo.HasErrors. By default, error message “Row Containing Error” will be displayed. You can change this by changing `RowErrorMessage` in the `resx` file. +TreeGrid supports to show the error information in row header by setting INotifyDataErrorInfo.HasErrors. By default, error message “Row Containing Error” will be displayed. You can change this by changing `RowErrorMessage` in the `resx` file. {% tabs %} {% highlight c# %} @@ -567,7 +567,7 @@ public bool HasErrors ## Validation with Checkbox column -SfTreeGrid doesn’t support to validate the [TreeGridCheckBoxColumn](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCheckBoxColumn.html) through validating events. You can validate the check box column value by setting [TreeGridValidationHelper.IsCurrentCellValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_IsCurrentCellValidated) and [TreeGridValidationHelper.IsCurrentRowValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_IsCurrentRowValidated) static properties by calling [SetCurrentRowValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentRowValidated_System_Boolean_) and [SetCurrentCellValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentCellValidated_System_Boolean_) methods from [TreeGridValidationHelper](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html). +TreeGrid doesn’t support to validate the [TreeGridCheckBoxColumn](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCheckBoxColumn.html) through validating events. You can validate the check box column value by setting [TreeGridValidationHelper.IsCurrentCellValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_IsCurrentCellValidated) and [TreeGridValidationHelper.IsCurrentRowValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_IsCurrentRowValidated) static properties by calling [SetCurrentRowValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentRowValidated_System_Boolean_) and [SetCurrentCellValidated](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridValidationHelper_SetCurrentCellValidated_System_Boolean_) methods from [TreeGridValidationHelper](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridValidationHelper.html). {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/Editing.md b/uwp/TreeGrid/Editing.md index 31a79682..dad9212d 100644 --- a/uwp/TreeGrid/Editing.md +++ b/uwp/TreeGrid/Editing.md @@ -11,7 +11,7 @@ documentation: ug # Editing in UWP TreeGrid -SfTreeGrid provides support for editing and it can be enabled or disabled by setting [SfTreeGrid.AllowEditing](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowEditing) property. +UWP TreeGrid provides support for editing and it can be enabled or disabled by setting [SfTreeGrid.AllowEditing](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowEditing) property. {% tabs %} {% highlight xaml %} @@ -40,7 +40,7 @@ treeGrid.Columns["FirstName"].AllowEditing = true; N> `TreeGridColumn.AllowEditing` takes higher priority than `SfTreeGrid.AllowEditing` -![Editing in UWP treegrid](Editing_images/Editing_img1.png) +![Editing](Editing_images/Editing_img1.png) N> It is mandatory to set the NavigationMode to Cell to enable CurrentCell navigation and editing. @@ -89,7 +89,7 @@ treeGrid.EditorSelectionBehavior = EditorSelectionBehavior.SelectAll; ## Support for IEditableObject -SfTreeGrid supports to commit and roll back the changes in row level when underlying data object implements [IEditableObject](https://msdn.microsoft.com/en-us/library/system.componentmodel.ieditableobject.aspx) interface. +TreeGrid supports to commit and roll back the changes in row level when underlying data object implements [IEditableObject](https://msdn.microsoft.com/en-us/library/system.componentmodel.ieditableobject.aspx) interface. The editing changes in a row will be committed only when user move to next row or pressing enter key in [EndEdit](https://msdn.microsoft.com/en-us/library/system.componentmodel.ieditableobject.endedit.aspx). Also when user press <kbd> Esc </kbd> key, then the changes made in a row will be reverted in [CancelEdit](https://msdn.microsoft.com/en-us/library/system.componentmodel.ieditableobject.canceledit.aspx). @@ -274,7 +274,7 @@ public class EmployeeInfo : IEditableObject, INotifyPropertyChanged ## Events -SfTreeGrid triggers the following events during editing. +TreeGrid triggers the following events during editing. ### CurrentCellBeginEdit Event @@ -284,7 +284,7 @@ SfTreeGrid triggers the following events during editing. * [RowColumnIndex](https://help.syncfusion.com/cr/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellBeginEditEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellBeginEditEventArgs_Column) : Gets the TreeGrid Column of TreeGrid. {% tabs %} {% highlight c# %} @@ -318,7 +318,7 @@ void TreeGrid_CurrentCellEndEdit(object sender, CurrentCellEndEditEventArgs args [CurrentCellValueChanged](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs whenever a value changes in TreeGridColumn that supports editing. [TreeGridCurrentCellValueChangedEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellValueChangedEventArgs.html) has following members which provides information for `CurrentCellValueChanged` event. -* [Column](https://help.syncfusion.com/cr/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellValueChangedEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellValueChangedEventArgs_RowColumnIndex) : Gets the value of the current RowColumnIndex. {% tabs %} @@ -355,7 +355,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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellManager.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellManager_BeginEdit) method. Initially the[CurrentCell](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCurrentCellManager.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCurrentCellManager_BeginEdit) method. Initially the[CurrentCell](https://help.syncfusion.com/cr/uwp/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# %} @@ -406,7 +406,7 @@ treeGrid.CurrentCellBeginEdit += TreeGrid_CurrentCellBeginEdit;void TreeGrid_Cur ## ReadOnly -You can prevent users from modifying the contents of a treegrid cell by setting the [SfTreeGrid.IsReadOnly ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_IsReadOnly) property, but the user can able to perform copy and selection operation. +You can prevent users from modifying the contents of a TreeGrid cell by setting the [SfTreeGrid.IsReadOnly ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_IsReadOnly) property, but the user can able to perform copy and selection operation. {% tabs %} {% highlight xaml %} @@ -483,4 +483,4 @@ xmlns:sync="using:Syncfusion.UI.Xaml.Grid" {% endhighlight %} {% endtabs %} -N> Enter and Tab keys are always handled by SfTreeGrid only. +N> Enter and Tab keys are always handled by TreeGrid only. diff --git a/uwp/TreeGrid/Export-To-Excel.md b/uwp/TreeGrid/Export-To-Excel.md index cddd54a6..b921a78e 100644 --- a/uwp/TreeGrid/Export-To-Excel.md +++ b/uwp/TreeGrid/Export-To-Excel.md @@ -9,16 +9,16 @@ documentation: ug # Export to Excel in UWP 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 process when exporting. +UWP 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 process when exporting. -The following assemblies should be added for exporting a tree grid to Excel:- +The following assemblies should be added for exporting TreeGrid to Excel:- * Syncfusion.SfGridConverter.UWP * Syncfusion.XlsIO.UWP For NuGet package, install [Syncfusion.DataGridExcelExport.UWP](https://www.nuget.org/packages/Syncfusion.DataGridExcelExport.UWP) package. For more details refer this [UG link](https://help.syncfusion.com/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.html) namespace. +You can export TreeGrid to Excel by using the [ExportToExcel](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.html) namespace. {% tabs %} {% highlight c# %} @@ -36,7 +36,7 @@ if (storageFile != null) ![Export-To-Excel_img1](Export-To-Excel_images/Export-To-Excel_img1.jpeg) -N> SfTreeGrid exports data to Excel using XlsIO. +N> TreeGrid exports data to Excel using XlsIO. ## Export options @@ -62,7 +62,7 @@ if (storageFile != null) ### 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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowOutliningGroups) property to `false` in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html). +By default, all the children in TreeGrid will be exported in expanded state. You can disable the outlines in Excel by setting the [AllowOutliningGroups](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowOutliningGroups) property to `false` in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html). {% tabs %} {% highlight c# %} @@ -82,7 +82,7 @@ if (storageFile != null) ### 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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_ExcludeColumns) field in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html) class. +By default, all the columns (including hidden columns) in TreeGrid will be exported to Excel. To exclude some columns, use [ExcludeColumns](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_ExcludeColumns) field in [TreeGridExcelExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html) class. {% tabs %} {% highlight c# %} @@ -177,7 +177,7 @@ The default value of the `ExportColumnWidth` property is `true`. ### 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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_DefaultRowHeight) property. +You can export TreeGrid to Excel with customized row height by using the [DefaultRowHeight](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_DefaultRowHeight) property. {% tabs %} {% highlight c# %} @@ -196,7 +196,7 @@ if (storageFile != null) ### Export without grid lines -You can export the tree grid to Excel without grid lines by setting the [IsGridLinesVisible](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_IsGridLinesVisible) property to `false`. +You can export TreeGrid to Excel without grid lines by setting the [IsGridLinesVisible](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_IsGridLinesVisible) property to `false`. {% tabs %} {% highlight c# %} @@ -217,7 +217,7 @@ The default value of the `IsGridLinesVisible` property is `true`. ### 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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowIndentColumn) property to `true`. +You can export TreeGrid to Excel with indent column to denote the nodes level by setting the [AllowIndentColumn](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridExcelExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridExcelExportingOptions_AllowIndentColumn) property to `true`. {% tabs %} {% highlight c# %} @@ -563,7 +563,7 @@ private static void CellExportingHandler(object sender, TreeGridCellExcelExporti ## Customize exported workbooks and worksheets -The tree grid can be exported to Excel by using [XlsIO](http://help.syncfusion.com/file-formats/xlsio/overview). You can refer to [XlsIO documentation](http://help.syncfusion.com/file-formats/xlsio/working-with-excel-worksheet) for manipulating workbooks and sheets after exporting. +The TreeGrid can be exported to Excel by using [XlsIO](http://help.syncfusion.com/file-formats/xlsio/overview). You can refer to [XlsIO documentation](http://help.syncfusion.com/file-formats/xlsio/working-with-excel-worksheet) for manipulating workbooks and sheets after exporting. ### Set borders @@ -704,9 +704,9 @@ condition2.BackColorRGB = System.Drawing.Color.LightGray; ## How to -### Export multiple tree grids to a single Excel sheet +### Export multiple TreeGrids to a single Excel sheet -You can export multiple tree grids to a single Excel sheet by merging one tree grid worksheet into another using the `Worksheet.UsedRange.CopyTo` method. +You can export multiple TreeGrids to a single Excel sheet by merging one TreeGrid worksheet into another using the `Worksheet.UsedRange.CopyTo` method. {% tabs %} {% highlight c# %} @@ -732,9 +732,9 @@ if (storageFile != null) {% 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 the view by calling the ApplyTemplate() method before exporting. +You can export the TreeGrid that is not loaded in the view by calling the ApplyTemplate() method before exporting. {% tabs %} {% highlight c# %} @@ -754,7 +754,7 @@ if (storageFile != null) ### Export parent and expanded child nodes -By default, all the tree grid nodes will be exported when exporting. You can export only the parent and expanded child nodes by overriding the [ExportNodesToExcel](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToExcelConverter.html) class, +By default, all the TreeGrid nodes will be exported when exporting. You can export only the parent and expanded child nodes by overriding the [ExportNodesToExcel](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToExcelConverter.html) class, {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/Export-To-PDF.md b/uwp/TreeGrid/Export-To-PDF.md index 1a3e6408..2fcd8f0c 100644 --- a/uwp/TreeGrid/Export-To-PDF.md +++ b/uwp/TreeGrid/Export-To-PDF.md @@ -9,9 +9,9 @@ documentation: ug # Export to PDF in UWP 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. +UWP 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 TreeGrid to PDF file:- * Syncfusion.SfGridConverter.UWP @@ -19,7 +19,7 @@ The following assemblies should be added for exporting a tree grid to PDF file:- For NuGet package, install [Syncfusion.DataGridExcelExport.UWP](https://www.nuget.org/packages/Syncfusion.DataGridExcelExport.UWP) package. For more details refer this [UG link](https://help.syncfusion.com/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.html) namespace:- +You can export TreeGrid to PDF by using the following extension methods present in the [Syncfusion.UI.Xaml.TreeGrid.Converter](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.html) namespace:- * [ExportToPdf](https://help.syncfusion.com/cr/uwp/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_) @@ -43,7 +43,7 @@ The exporting operation can be customized by passing [TreeGridPdfExportingOptio ### Auto size column width in PDF -You can export the tree grid to PDF by fitting the column width based on its content by setting the [AutoColumnWidth ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoColumnWidth)property to `true`. +You can export TreeGrid to PDF by fitting the column width based on its content by setting the [AutoColumnWidth ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoColumnWidth)property to `true`. {% tabs %} {% highlight c# %} @@ -59,7 +59,7 @@ if (storageFile != null) ### Auto size row height in PDF -You can export the tree grid to PDF by fitting the row height based on its content by setting the [AutoRowHeight ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoRowHeight)property to `true`. +You can export TreeGrid to PDF by fitting the row height based on its content by setting the [AutoRowHeight ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_AutoRowHeight)property to `true`. {% tabs %} {% highlight c# %} @@ -75,7 +75,7 @@ if (storageFile != null) ### 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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_ExcludeColumns) property in [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html) class. +By default, all the columns (including hidden columns) in TreeGrid will be exported to PDF. To exclude some columns when exporting to PDF, use the [ExcludeColumns](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_ExcludeColumns) property in [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html) class. {% tabs %} {% highlight c# %} @@ -156,7 +156,7 @@ if (storageFile != null) ## Define header and footer for PDF page -TreeGrid provides a way to display additional content at the top (header) or bottom (footer) of a page when exporting to PDF. This can be performed by setting the [PageHeaderFooterEventHandler](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_PageHeaderFooterEventHandler) property in [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html# "") class. +UWP TreeGrid provides a way to display additional content at the top (header) or bottom (footer) of a page when exporting to PDF. This can be performed by setting the [PageHeaderFooterEventHandler](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html#Syncfusion_UI_Xaml_TreeGrid_Converter_TreeGridPdfExportingOptions_PageHeaderFooterEventHandler) property in [TreeGridPdfExportingOptions](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridPdfExportingOptions.html# "") class. You can insert any string, image or drawing in the header and footer using the `PdfHeaderFooterEventHandler` property. Setting [PdfPageTemplateElement](http://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.PdfPageTemplateElement.html) to the [PdfHeaderFooterEventArgs.PdfDocumentTemplate.Top](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.PdfDocumentTemplate.html#Syncfusion_Pdf_PdfDocumentTemplate_Top) property loads the content at the top of a page. Setting `PdfPageTemplateElement` class to the [PdfHeaderFooterEventArgs.PdfDocumentTemplate.Bottom](https://help.syncfusion.com/cr/wpf/Syncfusion.Pdf.PdfDocumentTemplate.html#Syncfusion_Pdf_PdfDocumentTemplate_Bottom)  property loads the content at the bottom of a page. @@ -479,7 +479,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/uwp/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/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.Converter.TreeGridToPdfConverter.html) class, {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/Filtering.md b/uwp/TreeGrid/Filtering.md index 12c6c30f..0ef902f4 100644 --- a/uwp/TreeGrid/Filtering.md +++ b/uwp/TreeGrid/Filtering.md @@ -11,7 +11,7 @@ documentation: ug ## Overview -SfTreeGrid provides support for programmatic filtering. It can be achieved by setting [SfTreeGrid.View.Filter](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_Filter) delegate and calling [SfTreeGrid.View.RefreshFilter](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_RefreshFilter) method. +UWP TreeGrid provides support for programmatic filtering. It can be achieved by setting [SfTreeGrid.View.Filter](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_Filter) delegate and calling [SfTreeGrid.View.RefreshFilter](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridView.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridView_RefreshFilter) method. {% tabs %} {% highlight c# %} @@ -34,12 +34,12 @@ 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/uwp/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/uwp/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/uwp/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/uwp/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. ![Filtering_img1](Filtering_images/Filtering_img1.png) While filtering, if the node satisfies filter condition, [IsFiltered](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeNode.html#Syncfusion_UI_Xaml_TreeGrid_TreeNode_IsFiltered) property of [TreeNode](https://help.syncfusion.com/cr/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_LiveNodeUpdateMode)property is set as `AllowDataShaping`. You can download the sample from [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/FilteringDemo_UWP-1890724267). @@ -55,19 +55,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 the 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 the 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** @@ -77,7 +77,7 @@ N> It is also possible to change `FilterLevel` at runtime. ## Clear filters -You can clear the filters applied in tree grid by setting `SfTreeGrid.View.Filter` delegate as null and calling `SfTreeGrid.View.RefreshFilter` method. +You can clear the filters applied in TreeGrid by setting `SfTreeGrid.View.Filter` delegate as null and calling `SfTreeGrid.View.RefreshFilter` method. {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/Getting-Started.md b/uwp/TreeGrid/Getting-Started.md index 30aefe2f..91181bdc 100644 --- a/uwp/TreeGrid/Getting-Started.md +++ b/uwp/TreeGrid/Getting-Started.md @@ -9,11 +9,11 @@ documentation: ug # Getting Started with UWP TreeGrid -The 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 UWP 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 in any application, @@ -37,8 +37,8 @@ Syncfusion.Data.UWP assembly is dependent assembly for Syncfusion.SfGrid.UWP Syncfusion.SfGrid.UWP @@ -46,7 +46,7 @@ SfTreeGrid control present in Syncfusion.UI.Xaml.TreeGrid namespace. Syncfusion.SfInput.UWP @@ -59,7 +59,7 @@ Syncfusion.SfShared.UWP is dependent assembly for Syncfusion.SfInput.UWP.
-Syncfusion.SfGrid.UWP assembly contains classes that handles all UI operations of SfTreeGrid. -SfTreeGrid control present in Syncfusion.UI.Xaml.TreeGrid namespace. +Syncfusion.SfGrid.UWP assembly contains classes that handles all UI operations of TreeGrid. +TreeGrid control present in Syncfusion.UI.Xaml.TreeGrid namespace.
-Syncfusion.SfInput.UWP contains various editor controls (such as SfNumericTextBox, SfDateTimeEdit and etc) which are used in SfTreeGrid. +Syncfusion.SfInput.UWP contains various editor controls (such as SfNumericTextBox, SfDateTimeEdit 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, add the reference to following assemblies, @@ -75,7 +75,7 @@ Description Syncfusion.SfGridConverter.UWP @@ -98,17 +98,17 @@ Syncfusion.Pdf.UWP contains fundamental and base classes for creating PDF. You can refer [here](https://help.syncfusion.com/uwp/installation-and-upgrade/system-requirements) to know the assemblies installation location on your machine. -### Creating simple application with SfTreeGrid +### Creating simple application with TreeGrid -In this walk through, you will create UWP application with SfTreeGrid control. +In this walk through, you will create UWP application with TreeGrid control. 1. [Creating project](https://help.syncfusion.com/uwp/treegrid/getting-started#creating-the-project) 2. [Adding control via Designer](https://help.syncfusion.com/uwp/treegrid/getting-started#adding-control-via-designer) 3. [Adding control manually in XAML](https://help.syncfusion.com/uwp/treegrid/getting-started#adding-control-manually-in-xaml) 4. [Adding control manually in C# ](https://help.syncfusion.com/uwp/treegrid/getting-started#adding-control-manually-in-c) -5. [Binding self-relational data in SfTreeGrid](https://help.syncfusion.com/uwp/treegrid/getting-started#binding-self-relational-data-in-sftreegrid) +5. [Binding self-relational data in TreeGrid](https://help.syncfusion.com/uwp/treegrid/getting-started#binding-self-relational-data-in-sftreegrid) 6. [Binding nested collection](https://help.syncfusion.com/uwp/treegrid/getting-started#binding-nested-collection-with-sftreegrid) -7. [Populate SfTreeGrid in on-demand](https://help.syncfusion.com/uwp/treegrid/getting-started#populate-sftreegrid-in-on-demand-unbound-mode) +7. [Populate TreeGrid in on-demand](https://help.syncfusion.com/uwp/treegrid/getting-started#populate-sftreegrid-in-on-demand-unbound-mode) 8. [Populate child nodes asynchronously](https://help.syncfusion.com/uwp/treegrid/getting-started#Populate-child-nodes-asynchronously) 9. [Defining Columns](https://help.syncfusion.com/uwp/treegrid/getting-started#defining-columns) 10. [Selection](https://help.syncfusion.com/uwp/treegrid/getting-started#selection) @@ -117,13 +117,13 @@ In this walk through, you will create UWP application with SfTreeGrid control. ### Creating the project -Create new Universal Windows Platform project in Visual Studio to display SfTreeGrid with data objects. +Create new Universal Windows Platform project in Visual Studio to display TreeGrid with data objects. ### Adding control via Designer -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 +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 -![Add control via designer in UWP treegrid](GettingStarted_images/GettingStarted_img1.png) +![Add control via designer](GettingStarted_images/GettingStarted_img1.png) ### Adding control manually in XAML @@ -136,9 +136,9 @@ In order to add control manually in XAML, do the below steps, * Syncfusion.SfInput.UWP * Syncfusion.SfShared.UWP -2.Import SfTreeGrid control namespace `Syncfusion.UI.Xaml.TreeGrid` in XAML page. +2.Import TreeGrid control namespace `Syncfusion.UI.Xaml.TreeGrid` in XAML page. -3.Declare SfTreeGrid control in XAML page. +3.Declare TreeGrid control in XAML page. {% tabs %} {% highlight xaml %} @@ -169,9 +169,9 @@ In order to add control manually in C#, do the below steps, * Syncfusion.SfInput.UWP * Syncfusion.SfShared.UWP -2.Import SfTreeGrid namespace `Syncfusion.UI.Xaml.TreeGrid`. +2.Import TreeGrid namespace `Syncfusion.UI.Xaml.TreeGrid`. -3.Create SfTreeGrid control instance and add it to the Page. +3.Create TreeGrid control instance and add it to the Page. {% tabs %} {% highlight c# %} @@ -193,9 +193,9 @@ namespace GettingStarted {% endhighlight %} {% endtabs %} -### Binding self-relational data in SfTreeGrid +### Binding self-relational data in TreeGrid -SfTreeGrid supports to bind self-relational data by setting [SfTreeGrid.ParentPropertyName](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) properties where tree structure is formed based on these two properties. +TreeGrid supports to bind self-relational data by setting [SfTreeGrid.ParentPropertyName](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/uwp/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. @@ -205,7 +205,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 create binding to the control, you must create data model for application. +TreeGrid is a data-bound control. So before create binding to the control, you must create data model for application. 1.Creating data object class named `EmployeeInfo` and declare properties as shown below, @@ -334,7 +334,7 @@ private ObservableCollection GetEmployees() {% endtabs %} #### Binding to Data -To bind the SfTreeGrid to data, set [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ParentPropertyName) and [SfTreeGrid.ChildPropertyName](https://help.syncfusion.com/cr/uwp/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, @@ -388,11 +388,11 @@ public sealed partial class MainPage : Page {% endhighlight %} {% endtabs %} -![Binding data to UWP treegrid](GettingStarted_images/GettingStarted_img3.png) +![Binding data](GettingStarted_images/GettingStarted_img3.png) -### Binding Nested collection with SfTreeGrid +### Binding Nested collection with 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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) which holds the child collection. +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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName) which holds the child collection. #### Creating Data Model for nested collection @@ -488,7 +488,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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_ChildPropertyName). Each row in TreeGrid 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/uwp/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, @@ -535,17 +535,17 @@ namespace NestedCollectionDemo {% endhighlight %} {% endtabs %} -![Binding nested collection in UWP treegrid](GettingStarted_images/GettingStarted_img4.png) +![Binding nested collection](GettingStarted_images/GettingStarted_img4.png) -### Populate SfTreeGrid in on-demand (unbound mode) +### Populate TreeGrid in on-demand (unbound mode) -SfTreeGrid support to load the data in on-demand through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. RequestTreeItems event is triggered at the time of loading and when user expand any row at runtime. +TreeGrid support to load the data in on-demand through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. RequestTreeItems event is triggered at the time of loading and when user expand any row at runtime. -In the below example SfTreeGrid is populated through `SfTreeGrid.RequestTreeItems` instead of setting `SfTreeGrid.ItemsSource`. +In the below example TreeGrid is populated through `SfTreeGrid.RequestTreeItems` instead of setting `SfTreeGrid.ItemsSource`. #### Creating Data Model -You must create data model for application to populate the SfTreeGrid in on-demand. +You must create data model for application to populate the TreeGrid in on-demand. 1.Creating data object class named `EmployeeInfo` and declare properties as shown below, @@ -673,8 +673,8 @@ public class ViewModel {% endtabs %} #### Populating TreeGrid -Populate the data for SfTreeGrid in on-demand through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. 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. +Populate the data for TreeGrid in on-demand through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. TreeGrid 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. {% tabs %} {% highlight c# %} @@ -702,13 +702,13 @@ private void TreeGrid_RequestTreeItems(object sender, TreeGridRequestTreeItemsEv {% endhighlight %} {% endtabs %} -You can let SfTreeGrid to populate the data at runtime by calling [SfTreeGrid.RepopulateTree()](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RepopulateTree) method. +You can let TreeGrid to populate the data at runtime by calling [SfTreeGrid.RepopulateTree()](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RepopulateTree) method. -![Populate UWP treegrid](GettingStarted_images/GettingStarted_img3.png) +![Populate TreeGrid](GettingStarted_images/GettingStarted_img3.png) ### Populate child nodes asynchronously -SfTreeGrid supports to load the child items asynchronously through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. RequestTreeItems event is triggered at the time of loading and when user expand any node at runtime. +TreeGrid supports to load the child items asynchronously through [SfTreeGrid.RequestTreeItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RequestTreeItems) event. RequestTreeItems event is triggered at the time of loading and when user expand any node at runtime. In the below example child nodes are populated asynchronously through SfTreeGrid.RequestTreeItems event. @@ -877,7 +877,7 @@ public class ViewModel {% endhighlight %} {% endtabs %} -#### Populate treegrid +#### Populate TreeGrid You can populate the child nodes asynchronously using async and await at runtime when retrieving data from web services or any database. This can be performed by [PopulateChildNodes](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeNode.html#Syncfusion_UI_Xaml_TreeGrid_TreeNode_PopulateChildNodes_System_Collections_Generic_IEnumerable_System_Object__) method from [TreeGridRequestTreeItemsEventArgs.ParentNode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRequestTreeItemsEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRequestTreeItemsEventArgs_ParentNode) property. @@ -918,7 +918,7 @@ You can download the sample [here](https://github.com/SyncfusionExamples/how-to- ### Defining Columns -By default, the SfTreeGrid control generates the columns automatically when value assigned to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/uwp/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 TreeGrid control generates the columns automatically when value assigned to [SfTreeGrid.ItemsSource](https://help.syncfusion.com/cr/uwp/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 it’s constraints for auto column generation. @@ -972,7 +972,7 @@ Property of type Uri
-Syncfusion.SfGridConverter.UWP contains static extension classes for exporting SfTreeGrid to excel and PDF in Syncfusion.UI.Xaml.TreeGrid.Converter namespace. +Syncfusion.SfGridConverter.UWP contains static extension classes for exporting TreeGrid to excel and PDF in Syncfusion.UI.Xaml.TreeGrid.Converter namespace.
-When columns are auto-generated, you can handle the [SfTreeGrid.AutoGeneratingColumn](https://help.syncfusion.com/cr/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AutoGenerateColumns) property to false. When `SfTreeGrid.AutoGenerateColumns` property is `false`, you have to define the columns to be displayed as below, @@ -995,7 +995,7 @@ You can prevent the automatic column generation by setting [SfTreeGrid.AutoGener {% endhighlight %} {% endtabs %} -Below are the list of column types provided in SfTreeGrid. +Below are the list of column types provided in TreeGrid. @@ -1011,7 +1011,7 @@ Comments TreeGridTextColumn @@ -1019,7 +1019,7 @@ Represents SfTreeGrid column that hosts textual content in its cells. TreeGridNumericColumn @@ -1027,7 +1027,7 @@ Represents SfTreeGrid column that hosts `SfNumericTextBox`controls in its cells TreeGridDateTimeColumn @@ -1035,7 +1035,7 @@ Represents SfTreeGrid column that hosts `SfDatePicker` controls in its cells whi TreeGridComboBoxColumn @@ -1043,7 +1043,7 @@ Represents SfTreeGrid column that hosts `ComboBox`controls in its cells. TreeGridCheckBoxColumn @@ -1051,7 +1051,7 @@ Represents SfTreeGrid column that hosts `CheckBox` controls in its cells. TreeGridHyperlinkColumn @@ -1059,20 +1059,20 @@ Represents SfTreeGrid column that hosts `HyperLink` controls in its cells. TreeGridTemplateColumn
-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 `SfNumericTextBox`controls in its cells which is used to format and display Numeric values. +Represents TreeGrid column that hosts `SfNumericTextBox`controls in its cells which is used to format and display Numeric values.
-Represents SfTreeGrid column that hosts `SfDatePicker` controls in its cells which is used to display and format DateTime values. +Represents TreeGrid column that hosts `SfDatePicker` controls in its cells which is used to display and format DateTime values.
-Represents SfTreeGrid column that hosts `ComboBox`controls in its cells. +Represents TreeGrid column that hosts `ComboBox`controls in its cells.
-Represents SfTreeGrid column that hosts `CheckBox` controls in its cells. +Represents TreeGrid column that hosts `CheckBox` controls in its cells.
-Represents SfTreeGrid column that hosts `HyperLink` controls in its cells. +Represents TreeGrid column that hosts `HyperLink` controls 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/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionChanging) and [SfTreeGrid.SelectionChanged](https://help.syncfusion.com/cr/uwp/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/uwp/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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SortColumnDescriptions) property. You can customize sorting by handling the [SfTreeGrid.SortColumnChanging](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortColumnsChanging) and [SfTreeGrid.SortColumnChanged](https://help.syncfusion.com/cr/uwp/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.SortColumnChanging` event. diff --git a/uwp/TreeGrid/Helpers.md b/uwp/TreeGrid/Helpers.md index 751649b5..5501bc9f 100644 --- a/uwp/TreeGrid/Helpers.md +++ b/uwp/TreeGrid/Helpers.md @@ -11,7 +11,7 @@ documentation: ug ## IndexResolver -SfTreeGrid has [TreeGridIndexResolver](https://help.syncfusion.com/cr/uwp/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. +UWP TreeGrid has [TreeGridIndexResolver](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridIndexResolver.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridIndexResolver_GetNodeAtRowIndex_Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_System_Int32_) method. @@ -40,7 +40,7 @@ ResolveToNodeIndex(int rowindex) -Resolves the node index from the row index. When the row index does not find any record, it returns -1. The NodeIndex denotes the index of node in SfTreeGrid.View.Nodes. +Resolves the node index from the row index. When the row index does not find any record, it returns -1. The NodeIndex denotes the index of node in TreeGrid.View.Nodes. @@ -121,4 +121,4 @@ 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 have to call the [SfTreeGrid.Dispose](https://help.syncfusion.com/cr/uwp/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 for the control. So, the memory occupied using the control is reclaimed. You have to call the [SfTreeGrid.Dispose](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Dispose_System_Boolean_) method to release the memory. diff --git a/uwp/TreeGrid/Interactive-Features.md b/uwp/TreeGrid/Interactive-Features.md index 7ac64057..51633d07 100644 --- a/uwp/TreeGrid/Interactive-Features.md +++ b/uwp/TreeGrid/Interactive-Features.md @@ -11,7 +11,7 @@ documentation: ug ## 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. +UWP 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 example 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 for SfTreeGrid based on rows. +You can set different context menus for TreeGrid based on rows. #### ContextMenu for nodes @@ -150,7 +150,7 @@ this.treeGrid.RecordContextMenu.Items.Add(new MenuItem() { Header = "Paste" }); {% endhighlight %} {% endtabs %} -![ContextMenu for nodes in sfTreeGrid uwp](ContextMenu_images/ContextMenu_img1.png) +![ContextMenu for nodes](ContextMenu_images/ContextMenu_img1.png) When binding the menu item using CommandBinding, you can get the command parameter as [TreeGridNodeContextMenuInfo](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridNodeContextMenuInfo.html), which contains the node of the corresponding row. @@ -207,7 +207,7 @@ this.treeGrid.HeaderContextMenu.Items.Add(new MenuItem() { Header = "ClearFilter {% endhighlight %} {% endtabs %} -![ContextMenu for header in sfTreeGrid uwp](ContextMenu_images/ContextMenu_img2.png) +![ContextMenu for header](ContextMenu_images/ContextMenu_img2.png) When binding the menu item using CommandBinding, you can get the parameter as [TreeGridColumnContextMenuInfo](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html): Occurs when opening the context menu in SfTreeGrid. [TreeGridContextMenuEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html) has the following members, which provides information about the `TreeGridContextMenuOpening ` event: +The [TreeGridContextMenuOpening](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html): Occurs when opening the context menu in TreeGrid. [TreeGridContextMenuEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html) has the following members, which provides information about the `TreeGridContextMenuOpening ` event: [ContextMenu](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridContextMenuEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridContextMenuEventArgs_ContextMenu) – Gets the corresponding context menu. [ContextMenuInfo](https://help.syncfusion.com/cr/uwp/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 %} -![ContextMenu for opening the menu items in sfTreeGrid uwp](ContextMenu_images/ContextMenu_img3.png) +![ContextMenu for opening the menu items](ContextMenu_images/ContextMenu_img3.png) #### Changing background to ContextMenu @@ -365,4 +365,4 @@ You can change the appearance of the context menu by customizing the style with {% endhighlight %} {% endtabs %} -![ContextMenu for appearance in sfTreeGrid uwp](ContextMenu_images/ContextMenu_img4.png) \ No newline at end of file +![ContextMenu for appearance](ContextMenu_images/ContextMenu_img4.png) \ No newline at end of file diff --git a/uwp/TreeGrid/Localization.md b/uwp/TreeGrid/Localization.md index 5c729d21..89ace97c 100644 --- a/uwp/TreeGrid/Localization.md +++ b/uwp/TreeGrid/Localization.md @@ -9,7 +9,7 @@ documentation: ug # Localization in UWP 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. Application culture can be changed by setting [CurrentUICulture](https://msdn.microsoft.com/en-us/library/system.globalization.cultureinfo.currentuiculture.aspx) before InitializeComponent method. +Localization is the process of translating the application resources into different language for the specific cultures. You can localize the control by adding resource file. Application culture can be changed by setting [CurrentUICulture](https://msdn.microsoft.com/en-us/library/system.globalization.cultureinfo.currentuiculture.aspx) before InitializeComponent method. Below application culture changed to German. @@ -23,9 +23,9 @@ public MainPage() {% 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 control, drag and drop window based on CurrentUICulture using resource files, follow the below steps. 1.Right-click on the project, select `Add` and then `NewItem`. @@ -44,15 +44,15 @@ To localize the treegrid, drag and drop window based on CurrentUICulture using 6.Add the Name/Value pair in Resource Designer of `Syncfusion.SfGrid.UWP.Resources.de.resw` file and change its corresponding value to corresponding culture. ![Providing the resources as per culture](Localization_images/Localization_img3.jpeg) -You can get the SfTreeGrid’ s key from default resource [Syncfusion.SfGrid.UWP.Resources.resw](http://www.syncfusion.com/downloads/support/directtrac/general/ze/Syncfusion.SfGrid.UWP.Resources-531431521.zip). +You can get the TreeGrid’ s key from default resource [Syncfusion.SfGrid.UWP.Resources.resw](http://www.syncfusion.com/downloads/support/directtrac/general/ze/Syncfusion.SfGrid.UWP.Resources-531431521.zip). -![Drag drop window of UWP treegrid with localized string](Localization_images/Localization_img4.jpeg) +![Drag drop window with localized string](Localization_images/Localization_img4.jpeg) You can download the sample [here](https://github.com/SyncfusionExamples/how-to-localize-the-drag-and-drop-window-text-in-treegrid/tree/master/UWP). ## Edit default culture resource -You can edit default resource file by adding it to your application where the treegrid reads the static texts from here. You can download the default resource file from [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/Syncfusion.SfGrid.UWP.Resources-531431521.zip). +You can edit default resource file by adding it to your application where TreeGrid reads the static texts from here. You can download the default resource file from [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/Syncfusion.SfGrid.UWP.Resources-531431521.zip). ![Default resource file](Localization_images/Localization_img5.jpeg) @@ -61,5 +61,5 @@ Now, change the Name/Value pair in Resource Designer of `Syncfusion.SfGrid.UWP. ![Modifying the default localization in resource](Localization_images/Localization_img6.jpeg) -![Drag and drop window of UWP treegrid with modified resource](Localization_images/Localization_img7.jpeg) +![Drag and drop window with modified resource](Localization_images/Localization_img7.jpeg) diff --git a/uwp/TreeGrid/MVVM.md b/uwp/TreeGrid/MVVM.md index ee0cfc3f..42b6030a 100644 --- a/uwp/TreeGrid/MVVM.md +++ b/uwp/TreeGrid/MVVM.md @@ -9,11 +9,11 @@ documentation: ug # MVVM in UWP 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/uwp/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/uwp/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/uwp/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/uwp/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. @@ -129,7 +129,7 @@ You can download the sample [here](https://github.com/SyncfusionExamples/how-to- ## Bind columns from view model -You can bind the [SfTreeGrid.Columns](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) property in ViewModel by having the binding property of `Syncfusion.SfGrid.UI.Xaml.TreeGrid.Columns` type. Thus, you can set binding to the SfTreeGrid.Columns property that provides DataContext of treegrid in ViewModel. +You can bind the [SfTreeGrid.Columns](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_Columns) property in ViewModel by having the binding property of `Syncfusion.SfGrid.UI.Xaml.TreeGrid.Columns` type. Thus, you can set binding to the SfTreeGrid.Columns property that provides DataContext of TreeGrid in ViewModel. {% tabs %} {% highlight xaml %} @@ -148,7 +148,7 @@ You can bind the [SfTreeGrid.Columns](https://help.syncfusion.com/cr/uwp/Syncfus {% endhighlight %} {% endtabs %} -Refer to the following code example in which the treegrid column is populated with some [TreeGridTextColumn](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridTextColumn.html) when creating the ViewModel instance. +Refer to the following code example in which the TreeGrid column is populated with some [TreeGridTextColumn](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridTextColumn.html) when creating the ViewModel instance. {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/Node-CheckBox.md b/uwp/TreeGrid/Node-CheckBox.md index 4815242e..01a3fe8f 100644 --- a/uwp/TreeGrid/Node-CheckBox.md +++ b/uwp/TreeGrid/Node-CheckBox.md @@ -8,7 +8,7 @@ documentation: ug --- # Node CheckBox in UWP 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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CheckBoxSelectionMode) property. +UWP 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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CheckBoxSelectionMode) property. {% tabs %} {% highlight xaml %} @@ -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/uwp/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/uwp/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. @@ -271,7 +271,7 @@ Here, node CheckBox is collapsed for leaf nodes. ## 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. diff --git a/uwp/TreeGrid/Row-Drag-And-Drop.md b/uwp/TreeGrid/Row-Drag-And-Drop.md index 7f4fe4b2..3aee3648 100644 --- a/uwp/TreeGrid/Row-Drag-And-Drop.md +++ b/uwp/TreeGrid/Row-Drag-And-Drop.md @@ -8,7 +8,7 @@ documentation: ug --- # Row Drag and Drop in UWP TreeGrid -You can allow end-users to drag and drop the rows in SfTreeGrid and between two SfTreeGrid by setting [SfTreeGrid.AllowDraggingRows](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowDraggingRows) to `true`.It is also possible to drag and drop to and from any other control. +You can allow end-users to drag and drop the rows in TreeGrid and between two TreeGrid by setting [SfTreeGrid.AllowDraggingRows](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AllowDraggingRows) to `true`.It is also possible to drag and drop to and from any other control. {% tabs %} {% highlight xaml %} @@ -22,10 +22,10 @@ treeGrid.AllowDraggingRows = true; {% endhighlight %} {% endtabs %} -![Row drag in UWP TreeGrid.](row-drag-and-drop_images/uwp-treegrid-row-drag.png) +![Row drag.](row-drag-and-drop_images/uwp-treegrid-row-drag.png) While dropping, the dragged node(s) can be added above or below or as a child node based on its drop position. For example, if you drop at the bottom of node, it will be added below the node and if you are dropping over the node, the it will be added as child of that node. -![Row drop in UWP TreeGrid.](row-drag-and-drop_images/uwp-treegrid-row-drop.png) +![Row drop.](row-drag-and-drop_images/uwp-treegrid-row-drop.png) ## Auto expanding the node on drag over @@ -42,12 +42,12 @@ N> When drop position is “Drop as child”, drag indicators will not be shown. ## Dragging multiple nodes -SfTreeGrid allows user to drag multiple selected nodes. You can enable multiple selection by setting [SfTreeGrid.SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) as `Multiple` or `Extended`. -![Dragging multiple nodes in UWP TreeGrid.](row-drag-and-drop_images/uwp-treegrid-dragging-multiple-nodes.png) +TreeGrid allows user to drag multiple selected nodes. You can enable multiple selection by setting [SfTreeGrid.SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) as `Multiple` or `Extended`. +![Dragging multiple nodes.](row-drag-and-drop_images/uwp-treegrid-dragging-multiple-nodes.png) ## Drag and Drop between TreeGrids -SfTreeGrid provides build built in support for drag and drop nodes between SfTreeGrid’s. +TreeGrid provides build built in support for drag and drop nodes between TreeGrid’s. ### Disabling drag and drop between TreeGrid @@ -69,7 +69,7 @@ public class TreeGridRowDragDropControllerExt : TreeGridRowDragDropController if (args.DataView.Properties.ContainsKey("SourceTreeGrid")) sourceTreeGrid = args.DataView.Properties["SourceTreeGrid"] as SfTreeGrid; - // Disable drop operation if source tree grid is different. + // Disable drop operation if source TreeGrid is different. if (sourceTreeGrid != TreeGrid) return DropPosition.None; @@ -80,11 +80,11 @@ treeGrid.RowDragDropController = new TreeGridRowDragDropControllerExt(treeGrid); {% endhighlight %} {% endtabs %} -If source tree grid and target tree grid are different, drop operation is disabled. +If source TreeGrid and target TreeGrid are different, drop operation is disabled. ## Customizing Row drag and drop -SfTreeGrid processes row drag and drop operations in [TreeGridRowDragDropController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html) class. You can customize the row drag and drop operations by overriding `TreeGridRowDragDropController` and set it to[SfTreeGrid.RowDragDropController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RowDragDropController). +TreeGrid processes row drag and drop operations in [TreeGridRowDragDropController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowDragDropController.html) class. You can customize the row drag and drop operations by overriding `TreeGridRowDragDropController` and set it to[SfTreeGrid.RowDragDropController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_RowDragDropController). ### Disable dragging of certain nodes @@ -430,5 +430,5 @@ public class TreeGridRowDragDropControllerExt : TreeGridRowDragDropController {% endhighlight %} {% endtabs %} -After dropping in tree grid, dragged item is added to TreeGrid based on the dropped position. +After dropping in TreeGrid, dragged item is added to TreeGrid based on the dropped position. You can download the sample from [here](http://www.syncfusion.com/downloads/support/directtrac/general/ze/DragAndDrop_ListViewAndTreeGrid796052425). diff --git a/uwp/TreeGrid/Rows.md b/uwp/TreeGrid/Rows.md index 8e17aa6b..1dc6655c 100644 --- a/uwp/TreeGrid/Rows.md +++ b/uwp/TreeGrid/Rows.md @@ -9,7 +9,7 @@ documentation: ug # Rows in UWP TreeGrid -This section explains about various row types in treegrid and its customizations. +This section explains about various row types in TreeGrid and its customizations. 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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_ShowRowHeader) property. @@ -107,13 +107,13 @@ You can display the row index value in row header by customizing the `Tr {% endhighlight %} {% endtabs %} -![Row header with row index displayed in UWP treegrid](Rows_images/Rows_img5.jpeg) +![Row header with row index displayed](Rows_images/Rows_img5.jpeg) -## Rows in UWP TreeGrid (SfTreeGrid) +## Rows in UWP TreeGrid (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. +Header row is present in top of TreeGrid which has column headers in it. Column header describes the caption to identify the column content. -![HeaderRow of UWP treegrid](Rows_images/Rows_img6.jpeg) +![HeaderRow](Rows_images/Rows_img6.jpeg) ## Hiding header row @@ -244,7 +244,7 @@ By default, the `sort icon` appears at the right of the header text. You ca {% endhighlight %} {% endtabs %} -![Sort icon position changed in UWP treegrid](Rows_images/Rows_img7.jpeg) +![Sort icon position changed](Rows_images/Rows_img7.jpeg) ## Customize style of header row @@ -270,7 +270,7 @@ You can change the header cell background and foreground for specific column or {% endhighlight %} {% endtabs %} -![Style of HeaderRow in UWP treegrid customized](Rows_images/Rows_img8.jpeg) +![Style of HeaderRow customized](Rows_images/Rows_img8.jpeg) You can change the style of the particular column header by using the [HeaderStyle](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridColumnBase.html#Syncfusion_UI_Xaml_Grid_GridColumnBase_HeaderStyle) property in column, @@ -280,5 +280,5 @@ You can change the style of the particular column header by using the [HeaderSty {% endhighlight %} {% endtabs %} -![Style of a column header in UWP treegrid customized](Rows_images/Rows_img9.jpeg) +![Style of a column header customized](Rows_images/Rows_img9.jpeg) diff --git a/uwp/TreeGrid/Selection.md b/uwp/TreeGrid/Selection.md index 38880bd0..e04c3319 100644 --- a/uwp/TreeGrid/Selection.md +++ b/uwp/TreeGrid/Selection.md @@ -9,7 +9,7 @@ documentation: ug # Selection in UWP TreeGrid -SfTreeGrid allows you select one or more rows. +UWP TreeGrid allows you select one or more rows. ## Current cell navigation @@ -17,7 +17,7 @@ Keyboard navigation through the rows is determined based on the [NavigationMode] ## Selection modes -The [SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property define the behavior of selection in tree grid. +The [SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property define the behavior of selection in TreeGrid. @@ -65,7 +65,7 @@ Allows selection of more than one row. Selection is not cleared when selecting m Extended
-Allows selecting multiple rows. You can select multiple rows in the SfTreeGrid by dragging the mouse or by using the key modifiers Ctrl and Shift. +Allows selecting multiple rows. You can select multiple rows in the TreeGrid by dragging the mouse or by using the key modifiers Ctrl and Shift.
@@ -85,7 +85,7 @@ Allows selecting multiple rows. You can select multiple rows in the SfTreeGrid b {% endhighlight %} {% endtabs %} -![Row selected in UWP treegrid](Selection_images/Selection_img1.jpeg) +![Row selected](Selection_images/Selection_img1.jpeg) ## Disable selection for rows and columns @@ -93,7 +93,7 @@ You can disable selection and navigation on a particular column by setting the [ ## Multiple row selection -The tree grid allows you select multiple rows by setting the [SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property to [Extended](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html) or [Multiple](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html), where you can select multiple rows by dragging the mouse on tree grid and using the key modifiers. +TreeGrid allows you select multiple rows by setting the [SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) property to [Extended](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html) or [Multiple](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html), where you can select multiple rows by dragging the mouse on TreeGrid and using the key modifiers. When using Extended, you can select multiple rows by pressing the key modifiers Ctrl and Shift. @@ -112,13 +112,13 @@ When using Extended, you can select multiple rows by pressing the key modifiers {% endhighlight %} {% endtabs %} -![Multiple rows selected in UWP treegrid](Selection_images/Selection_img2.jpeg) +![Multiple rows selected](Selection_images/Selection_img2.jpeg) N> When [SelectionMode](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectionMode) is [Multiple](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionMode.html), you can select or deselect multiple rows by clicking the respective rows. In multiple selection, pressing navigation keys moves only the current cell, and you can select or deselect by pressing the space key. ## Get selected rows -The [SelectedItem](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedIndex) property returns the index of the SelectedItem in SfTreeGrid. SelectedItem denotes the first selected row in multiple selection. +The [SelectedItem](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedIndex) property returns the index of the SelectedItem in TreeGrid. SelectedItem denotes the first selected row in multiple selection. The [CurrentItem](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentColumn) denotes the [GridColumn](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridColumn.html) that currently has focus. @@ -130,7 +130,7 @@ You can get all the selected records using the [SelectedItems](https://help.sync ### CurrentItem Vs SelectedItem -Both [SelectedItem](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) and [CurrentItem ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentItem) return the same data object when a single row is selected in tree grid. When you select more than one rows or cells, the record that had been selected initially is maintained in SelectedItem, and the record that currently has focus is maintained in CurrentItem. +Both [SelectedItem](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) and [CurrentItem ](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_CurrentItem) return the same data object when a single row is selected in TreeGrid. When you select more than one rows or cells, the record that had been selected initially is maintained in SelectedItem, and the record that currently has focus is maintained in CurrentItem. ## Programmatic selection @@ -165,7 +165,7 @@ foreach (var order in viewModel.PersonDetails) {% endhighlight %} {% endtabs %} -![UWP treegrid shows row with LastName as Buchanan added to SelectedItems collection](Selection_images/Selection_img3.jpeg) +![Row with LastName as Buchanan added to SelectedItems collection](Selection_images/Selection_img3.jpeg) ### Process selection using methods @@ -179,7 +179,7 @@ this.treeGrid.SelectRows(3, 7); {% endhighlight %} {% endtabs %} -![UWP treegrid shows with rows from 3 to 7 are selected](Selection_images/Selection_img4.jpeg) +![Rows from 3 to 7 are selected](Selection_images/Selection_img4.jpeg) ### Process current cell @@ -211,7 +211,7 @@ this.treeGrid.SelectionController.ClearSelections(true); ### Automatic scrolling on drag selection -SfTreeGrid allows scrolling rows and columns automatically when you try to perform the drag selection like in Excel. You can enable or disable auto scrolling by setting the [AutoScroller.AutoScrolling](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoScroller) property. +TreeGrid allows scrolling rows and columns automatically when you try to perform the drag selection like in Excel. You can enable or disable auto scrolling by setting the [AutoScroller.AutoScrolling](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_AutoScroller) property. {% tabs %} {% highlight c# %} @@ -330,7 +330,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. @@ -339,7 +339,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 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 the first row. @@ -420,7 +420,7 @@ Commits only the changes when the current cell is in edit mode and retains the f -If the tree grid property is true and the +If the TreeGrid property is true and the {{'[GridColumn.AllowEditing](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.GridColumnBase.html#Syncfusion_UI_Xaml_Grid_GridColumnBase_AllowEditing)'| markdownify }} property is true for the current column, the current cell enters into the edit mode. @@ -659,7 +659,7 @@ private void TreeGrid_SelectionChanging(object sender, Syncfusion.UI.Xaml.Grid.G ### SelectionChanged -The [SelectionChanged](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs after the selection process has been completed for a particular row or cell in tree grid. [GridSelectionChangedEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionChangedEventArgs.html) has the following members, which provide information to the `SelectionChanged` event: +The [SelectionChanged](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html) event occurs after the selection process has been completed for a particular row or cell in TreeGrid. [GridSelectionChangedEventArgs](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionChangedEventArgs.html) has the following members, which provide information to the `SelectionChanged` event: [AddedItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionChangedEventArgs.html#Syncfusion_UI_Xaml_Grid_GridSelectionChangedEventArgs_AddedItems): Collection of GridRowInfo where selection has been processed. @@ -710,7 +710,7 @@ You can change the selection background and foreground using the [SelectionBackG {% endhighlight %} {% endtabs %} -![Background and foreground of the selected rows are changed in UWP treegrid](Selection_images/Selection_img5.jpeg) +![Background and foreground of the selected rows are changed](Selection_images/Selection_img5.jpeg) ### Change current cell border style @@ -735,7 +735,7 @@ You can change the current cell's border thickness and border color using the [C {% endhighlight %} {% endtabs %} -![Style of current cell border is customized in UWP treegrid](Selection_images/Selection_img6.jpeg) +![Style of current cell border is customized](Selection_images/Selection_img6.jpeg) ### Customize row selection border @@ -827,7 +827,7 @@ You can customize the row selection by editing the control template of TreeGridR ## Customize selection behaviors -The tree grid processes the selection operations in selection controller. [GridSelectionController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html) processes selection operations when `SelectionUnit` is `Row`. +The TreeGrid processes the selection operations in selection controller. [GridSelectionController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html) processes selection operations when `SelectionUnit` is `Row`. You can customize the default row selection behaviors by overriding the [GridSelectionController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.GridSelectionController.html) class and set it to [SfTreeGrid.SelectionController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SelectionController). @@ -848,7 +848,7 @@ public class GridSelectionControllerExt : TreeGridRowSelectionController You can scroll to a record programmatically using the [ScrollInView](https://help.syncfusion.com/cr/uwp/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 by using the [ResolveToRowIndex](https://help.syncfusion.com/cr/uwp/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 a record programmatically by setting the [SelectedItem](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property in tree grid. +You can select a record programmatically by setting the [SelectedItem](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItem) property in TreeGrid. {% tabs %} {% highlight c# %} @@ -869,7 +869,7 @@ You can download the [sample](https://github.com/SyncfusionExamples/how-to-scrol ### 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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html) and overriding the [ProcessPointerPressed](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_ProcessPointerPressed_Windows_UI_Xaml_Input_PointerRoutedEventArgs_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_). +You can prevent the selection when right-clicking in TreeGrid by customizing the [SelectionController](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html) and overriding the [ProcessPointerPressed](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_ProcessPointerPressed_Windows_UI_Xaml_Input_PointerRoutedEventArgs_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_). {% tabs %} {% highlight c# %} @@ -890,7 +890,7 @@ You can download the [sample](https://github.com/SyncfusionExamples/how-to-preve ### Select rows based on cell value -In tree grid, you can select the rows based on cell value by adding the corresponding records to [SelectedItems](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_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](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_SelectedItems). You can get the cell value of a particular cell using the `View.GetPropertyAccessProvider` method. {% tabs %} {% highlight c# %} @@ -926,7 +926,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# %} @@ -974,7 +974,7 @@ You can get the cell values of [SelectedItems](https://help.syncfusion.com/cr/uw private void Button_Click(object sender, RoutedEventArgs e) { listBox.Items.Clear(); - // Get the selected items of SfTreeGrid + // Get the selected items of TreeGrid var reflector = this.treeGrid.View.GetPropertyAccessProvider(); foreach (var row in this.treeGrid.SelectedItems) { @@ -991,7 +991,7 @@ private void Button_Click(object sender, RoutedEventArgs e) {% endhighlight %} {% endtabs %} -### Show the selection of row/cell when setting the background to SfTreeGrid +### Show the selection of row/cell when setting the background to TreeGrid The `Row`/`Cell` selection border is behind the grid cell content. So, when you apply the background for row, the selection is not displayed in `UI`. You can overcome this by setting opacity in `TreeGridCell`. @@ -1007,9 +1007,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/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridRowSelectionController.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridRowSelectionController_MoveCurrentCell_Syncfusion_UI_Xaml_ScrollAxis_RowColumnIndex_System_Boolean_) method. {% tabs %} {% highlight c# %} diff --git a/uwp/TreeGrid/Sorting.md b/uwp/TreeGrid/Sorting.md index f5d950cb..a4add057 100644 --- a/uwp/TreeGrid/Sorting.md +++ b/uwp/TreeGrid/Sorting.md @@ -10,7 +10,7 @@ documentation: ug # Sorting in UWP 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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowSorting) property to `true`. +UWP 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/uwp/Syncfusion.UI.Xaml.Grid.SfGridBase.html#Syncfusion_UI_Xaml_Grid_SfGridBase_AllowSorting) property to `true`. {% tabs %} {% highlight xaml %} @@ -93,7 +93,7 @@ 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 <kbd>Ctrl</kbd> 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 <kbd>Ctrl</kbd> 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 <kbd>Ctrl</kbd> key. The sorting state of `First Name` column is preserved and `Employee ID` column sorted against `First Name` column. ![Sorting_img2](Sorting_images/Sorting_img2.png) @@ -183,7 +183,7 @@ this.treeGrid.SortColumnDescriptions.Clear(); ## Custom sorting -SfTreeGrid allows you to sort the columns based on the custom logic. +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/uwp/Syncfusion.Data.SortComparer.html) instance to [SfTreeGrid.SortComparers](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.SfTreeGrid.html#Syncfusion_UI_Xaml_TreeGrid_SfTreeGrid_SortComparers). The [SortComparer](https://help.syncfusion.com/cr/uwp/Syncfusion.Data.SortComparer.html) have the following properties, @@ -245,7 +245,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/uwp/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. diff --git a/uwp/TreeGrid/ToolTip.md b/uwp/TreeGrid/ToolTip.md index 6ac59e05..65fd63b6 100644 --- a/uwp/TreeGrid/ToolTip.md +++ b/uwp/TreeGrid/ToolTip.md @@ -11,7 +11,7 @@ documentation: ug ## Tooltip -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 TreeGrid. ### Record cell tooltip @@ -175,7 +175,7 @@ You can get the sample [here](http://www.syncfusion.com/downloads/support/direc ### CellToolTipOpening event The [CellToolTipOpening ](https://help.syncfusion.com/cr/uwp/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/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCellToolTipOpeningEventArgs.html# "")as argument which has the following properties: -* [Column:](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.CellToolTipOpeningEventArgs.html#Syncfusion_UI_Xaml_Grid_CellToolTipOpeningEventArgs_Column) Gets the hovered cell column in the SfTreeGrid. +* [Column:](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.CellToolTipOpeningEventArgs.html#Syncfusion_UI_Xaml_Grid_CellToolTipOpeningEventArgs_Column) Gets the hovered cell column in the TreeGrid. * [Node:](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.TreeGrid.TreeGridCellToolTipOpeningEventArgs.html#Syncfusion_UI_Xaml_TreeGrid_TreeGridCellToolTipOpeningEventArgs_Node) Gets the hovered cell node. * [Record:](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.CellToolTipOpeningEventArgs.html#Syncfusion_UI_Xaml_Grid_CellToolTipOpeningEventArgs_Record) Gets the data context of hovered cell. * [RowColumnIndex:](https://help.syncfusion.com/cr/uwp/Syncfusion.UI.Xaml.Grid.CellToolTipOpeningEventArgs.html#Syncfusion_UI_Xaml_Grid_CellToolTipOpeningEventArgs_RowColumnIndex) Gets the row and column index of the hovered cell.