How to make HierarchichalDataTemplate fill cell

2 posts, 0 answers
  1. David
    David avatar
    30 posts
    Member since:
    Apr 2013

    Posted 09 Sep 2013 Link to this post

    I am using the HierarchicalDataTemplate in my RadTreeView. The content of the data template is a grid and the grid has a context menu specified. The problem is the grid does not fill the RadTreeView cell (it seems to size to the content) so the context menu only displays if you click on the content, not anywhere in the cell. Is there a way to force the template to fill the cell or is there a better way to implement data template specific context menus?

    An example of one of my data templates is:
    <HierarchicalDataTemplate DataType="{x:Type DTMLib:DTMHostsNode}" ItemsSource="{Binding Hosts}">
        <Grid Background="Red" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
            <Image Grid.Column="0" Width="20" Height="20" Source="Images/Remote.png"/>
            <TextBlock Grid.Column="1" Text="{Binding Name}" VerticalAlignment="Center" Margin="5,0,0,0"/>
                <telerik:RadContextMenu  Opening="RootContextMenuOpening">
                    <telerik:RadMenuItem x:Name="ApplyCSVFileColumns" Header="Apply CSV File Columns" Click="ApplyRootCsvColumnsClick"/>
                    <telerik:RadMenuItem x:Name="PlaybackCSVFiles" Header="Playback CSV Files" Click="PlaybackCsvFilesClick"/>

    My RadTreeView instance is:
    <telerik:RadTreeView x:Name="ManagerTreeView" Grid.Row="0" Grid.Column="0" HorizontalContentAlignment="Stretch"/>
  2. David
    David avatar
    30 posts
    Member since:
    Apr 2013

    Posted 09 Sep 2013 Link to this post

    I found a solution, not sure if it is the only/best solution. If I set a style on all RadTreeViewItems and specify the HorizontalContentAlignment=Stretch it works. Note you also have to explicitly set the Grid background to Transparent in order to get mouse events in the grid. Here is the Style I used...

    <Style TargetType="telerik:RadTreeViewItem">
        <Setter Property="IsExpanded" Value="True"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
Back to Top