I want to create a Tree View with right aligned delete icon on each node. Alignment of all delete icon should be proper for each node. Also i need checboxes in each and every node.
Till now i have developed below code. But in that delete icon is not aligned properly.
<ig:XamDataTree x:Name="MyTree" Margin="2,40,2,2" Grid.Row="0" Grid.Column="0" ActiveNodeChanged="MyTree_ActiveNodeChanged" NodeExpansionChanged="MyTree_NodeExpansionChanged" NodeCheckedChanged="MyTree_NodeCheckedChanged" KeyDown="MyTree_KeyDown" KeyUp="MyTree_KeyUp" > <ig:XamDataTree.SelectionSettings> <ig:TreeSelectionSettings NodeSelection="Single"/> </ig:XamDataTree.SelectionSettings> <!-- Enable Check Boxes--> <ig:XamDataTree.CheckBoxSettings> <ig:CheckBoxSettings CheckBoxVisibility="Visible" IsCheckBoxThreeState="True"/> </ig:XamDataTree.CheckBoxSettings> <ig:XamDataTree.GlobalNodeLayouts> <ig:NodeLayout Key="RegionLayout" TargetTypeName="Region" DisplayMemberPath="Name" CheckBoxMemberPath="isChecked"> <ig:NodeLayout.ItemTemplate> <DataTemplate> <DockPanel Width="200"> <Button Tag="{Binding Data.Name}" Background="Transparent" HorizontalAlignment="Right" DockPanel.Dock="Left" BorderBrush="Transparent" BorderThickness="0" Padding="-4" Click="Button_Click_1"> <StackPanel> <Image Source="/Images/trash.png" Height="15" Width="15" /> </StackPanel> </Button> <TextBlock Width="5"></TextBlock> <TextBlock FontWeight="Bold" Text="{Binding Data.Name}"/>
</DockPanel> </DataTemplate> </ig:NodeLayout.ItemTemplate> </ig:NodeLayout> <ig:NodeLayout Key="Zone" TargetTypeName="Zone" DisplayMemberPath="Name" CheckBoxMemberPath="isChecked"> <ig:NodeLayout.ItemTemplate> <DataTemplate> <DockPanel Width="200"> <Button Tag="{Binding Data.Name}" Background="Transparent" HorizontalAlignment="Right" DockPanel.Dock="Left" BorderBrush="Transparent" BorderThickness="0" Padding="-4" Click="Button_Click_2"> <StackPanel> <Image Source="/Images/trash.png" Height="15" Width="15" /> </StackPanel> </Button> <TextBlock Width="5"></TextBlock> <TextBlock FontWeight="Bold" Text="{Binding Data.Name}"/>
</DockPanel> </DataTemplate> </ig:NodeLayout.ItemTemplate> <!-- Disable Check Boxes at the Product Level --> <ig:NodeLayout.CheckBoxSettings> <ig:CheckBoxSettingsOverride CheckBoxVisibility="Visible"/> </ig:NodeLayout.CheckBoxSettings> </ig:NodeLayout> </ig:XamDataTree.GlobalNodeLayouts> <ig:XamDataTree.EditingSettings> <ig:TreeEditingSettings AllowDeletion="True"/> </ig:XamDataTree.EditingSettings> </ig:XamDataTree>
Please suggest if we can achive it in a different way. But mostly i want to to do it with XamDataTree only not with XAMGrid.
I have attached an problem image also. PFA.
Hello Vikas,
I am just checking if you got this worked out or you still require any assistance or clarification on the matter.
Hi,
Problem is horizontal scroll bar is coming in tree view. Can you please provide me solution to avoid horizontal scroll bar. Vertical scroll bar is fine.
Thanks
Vikas
Thanks for all your help Stefan, appreciate it. I will log the idea.
Hello Hagashen,
After investigating further it turns out that the XamDataTree is not designed for a scenario like yours and the best workaround is to hide the horizontal scrollbar. The thing you can do is logging a Product idea for auto fitting of the nodes. You can do this here:
http://ideas.infragistics.com/
Hi Stefan,
I am sorry must of been a dull moment of mine, did not mean to confuse things. Are you able to now see the problem I am facing?
In some of your previous posts you said that you don't want a horizontal scroll bar to appear, this is why I used this code - to disable the horizontal scrollbar.
In your sample simply change the MainWindow.xaml.cs method
private void ScrollBar_Loaded(object sender, RoutedEventArgs e) { if ((sender as ScrollBar).Orientation == Orientation.Horizontal) { //(sender as ScrollBar).MinHeight = 0; //(sender as ScrollBar).Height = 0; } else xamDataTree1.Tag = sender; }
i.e. allow the horizontal scrollbars. Then expand one of the parents, notice that the horizontal scrollbars appear even though there no need for them space wise.