I want to display Row index in syncfusion treegrid. I used this way
<Style TargetType="syncfusion:TreeGridRowHeaderCell">
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="BorderThickness" Value="0.1,0,0.1,0.1" />
<Setter Property="Padding" Value="0" />
<Setter Property="IsTabStop" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="syncfusion:TreeGridRowHeaderCell">
<Border x:Name="PART_RowHeaderCellBorder"
BorderBrush="Gray"
BorderThickness="{TemplateBinding BorderThickness}">
<Grid>
<TextBlock HorizontalAlignment="Center"
VerticalAlignment="Center"
Text="{Binding RowIndex,RelativeSource={RelativeSource Mode=TemplatedParent}}"
TextAlignment="Center"/>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Grid Background="{ThemeResource SystemControlAcrylicWindowBrush}">
<syncfusion:SfTreeGrid Name="treeGrid"
AutoGenerateColumns="False"
ChildPropertyName="Children"
AllowDraggingRows="True"
AllowDrop="True"
AutoExpandMode="AllNodesExpanded"
SelectionMode="Extended"
HeaderStyle="{StaticResource syncTreeHeader}"
ShowRowHeader="True"
>
but this Row index is include stacked header row like this
How to display without this?
You can achieve your requirement to “Display the row index only for the DataRow” will be achievable by using the below code snippet,
XAML:
<Page.Resources>
<local:RowIndexValueConverter x:Key="rowIndexValueconverter"/>
<Style TargetType="syncfusion:TreeGridRowHeaderCell">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="syncfusion:TreeGridRowHeaderCell">
<Border x:Name="PART_RowHeaderCellBorder"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<Grid>
<TextBlock HorizontalAlignment="Center"
VerticalAlignment="Center"
Text="{Binding RowIndex,
RelativeSource={RelativeSource TemplatedParent},
ConverterParameter =treeGridComponents,
Converter={StaticResource rowIndexValueconverter}}"
TextAlignment="Center"/>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
RowIndexValueConverter.CS:
public class RowIndexValueConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
var currentPage = MainPage.CurrentPage;
var treeGrid = (currentPage.Content as Grid).Children[0] as SfTreeGrid;
int firstRowIndex = treeGrid.GetFirstDataRowIndex();
int lastRowIndex = treeGrid.GetLastDataRowIndex();
if (value == null || (int)value > lastRowIndex || (int)value < firstRowIndex)
return string.Empty;
return (int)value - firstRowIndex + 1;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
throw new NotImplementedException();
}
}
MainPage.XAML.CS:
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
CurrentPage = this;
}
public static MainPage CurrentPage;
}
Here I have attached the sample with the above suggestion, please have a look at this.
Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SfTreeGridDemo1600759656