Row Selector's Column

[Joel Palmer]

Space is premium on my TreeListView.  I removed the Row Selector but I still seem to have a column reserved for it.  Is there a way to set that column to zero width or eliminate it all together?

Thanks for your help,

Joel.

Data Templates:

<DataTemplate
    x:Key="TreeNodeTemplate">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="auto"/>
        </Grid.ColumnDefinitions>

        <Image
            Grid.Column="0"
            Source="{Binding Image, Mode=TwoWay}"
            ToolTip="{Binding Barcode, Mode=TwoWay}"/>

        <Image
            Grid.Column="0"
            Height="20"
            Width="20"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Margin="-20,0,0,0"
            Source="{Binding StatusImage, Mode=TwoWay}"
            ToolTip="{Binding StatusName, Mode=TwoWay}"/>

        <TextBlock
            Grid.Column="1"
            Text="{Binding Name, Mode=TwoWay}"
            Margin="5"
            ToolTip="{Binding Description}"/>
    </Grid>
</DataTemplate>
<DataTemplate
    x:Key="TreeNodeEditTemplate">

    <StackPanel
        Orientation="Horizontal">

        <StackPanel
            Orientation="Vertical">

            <Image
                Height="20"
                Width="20"
                HorizontalAlignment="Left"
                VerticalAlignment="Top"
                Source="{Binding StatusImage, Mode=TwoWay}"
                ToolTip="{Binding StatusName, Mode=TwoWay}"/>

            <Image
                Source="{Binding Image, Mode=TwoWay}"
                VerticalAlignment="Top"/>
        </StackPanel>

        <Grid
            Margin="5"
            Background="Cornsilk">
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>

            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="125"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>

                <Grid.RowDefinitions>
                    <RowDefinition Height="28"/>
                    <RowDefinition Height="28"/>
                    <RowDefinition Height="28"/>
                    <RowDefinition Height="28"/>
                    <RowDefinition Height="auto"/>
                </Grid.RowDefinitions>

                <Label
                    Content="ID:"
                    Grid.Column="0"
                    Grid.Row="0"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Center"/>

                <TextBlock
                    Grid.Column="1"
                    VerticalAlignment="Center"
                    Text="{Binding ID, Mode=TwoWay}"/>

                <Label
                    Content="Name:"
                    Grid.Column="0"
                    Grid.Row="1"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Center"/>

                <TextBox
                    Grid.Column="1"
                    Grid.Row="1"
                    VerticalAlignment="Center"
                    Text="{Binding Name, Mode=TwoWay}"
                    IsEnabled="{Binding IsEditableStatus}"
                    IsReadOnly="{Binding IsEditableStatus, Converter={StaticResource BoolToOppositeBoolConverter}}"/>

                <Label
                    Content="Description:"
                    Grid.Column="0"
                    Grid.Row="2"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Center"/>

                <TextBox
                    Grid.Column="1"
                    Grid.Row="2"
                    VerticalAlignment="Center"
                    Text="{Binding Description, Mode=TwoWay}"
                    IsEnabled="{Binding IsEditableStatus}"
                    IsReadOnly="{Binding IsEditableStatus, Converter={StaticResource BoolToOppositeBoolConverter}}"/>

                <Label
                    Content="Barcode:"
                    Grid.Column="0"
                    Grid.Row="3"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Center"/>

                <TextBox
                    Grid.Column="1"
                    Grid.Row="3"
                    VerticalAlignment="Center"
                    Text="{Binding Barcode, Mode=TwoWay}"/>
            </Grid>

            <GroupBox
                Header="Status"
                Grid.Row="4"
                Margin="5">

                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="125"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Grid.RowDefinitions>
                        <RowDefinition Height="28"/>
                        <RowDefinition Height="28"/>
                    </Grid.RowDefinitions>

                    <Label
                        Content="CRUD Status:"
                        Grid.Column="0"
                        Grid.Row="0"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Center"/>

                    <TextBlock
                        Grid.Column="1"
                        Grid.Row="0"
                        VerticalAlignment="Center"
                        Text="{Binding StatusName, Mode=TwoWay}"/>

                    <Label
                        Content="Inspect Status:"
                        Grid.Column="0"
                        Grid.Row="1"
                        HorizontalAlignment="Right"
                        VerticalAlignment="Center"/>

                    <TextBlock
                        Grid.Column="1"
                        Grid.Row="1"
                        Text="{Binding InspectStatusName, Mode=TwoWay}"
                        VerticalAlignment="Center"/>
                </Grid>
            </GroupBox>

        </Grid>
    </StackPanel>
</DataTemplate>

 

Control Configuration:

<telerik:RadTreeListView
    x:Name="treeListView"
    AutoGenerateColumns="False"
    HorizontalAlignment="Stretch"
    VerticalAlignment="Stretch"
    CanUserFreezeColumns="False"
    CanUserReorderColumns="False"
    SelectionMode="Single"
    Grid.Row="1"
    Margin="5"
    IsReadOnly="{Binding IsReadOnly}"
    ItemsSource="{Binding Hierarchy, Mode=TwoWay}"
    SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
    IsExpandedBinding="{Binding IsExpanded, Mode=TwoWay}"
    AutoExpandItems="True"
    ShowGroupPanel="False"
    IsFilteringAllowed="False"
    ShowColumnHeaders="False"
    EditTriggers="F2"
    HierarchyIndent="12"
    MinColumnWidth="12"
    RowIndicatorVisibility="Hidden"
    MouseDoubleClick="treeListView_MouseDoubleClick"
    PreviewMouseLeftButtonDown="treeListView_PreviewMouseLeftButtonDown">

    <telerik:RadTreeListView.ChildTableDefinitions>
        <telerik:TreeListViewTableDefinition
            ItemsSource="{Binding Children}"/>
    </telerik:RadTreeListView.ChildTableDefinitions>
    <telerik:RadTreeListView.Columns>

        <telerik:GridViewDataColumn
            DataMemberBinding="{Binding Name, Mode=TwoWay}"
            CellTemplate="{StaticResource TreeNodeTemplate}"
            CellEditTemplate="{StaticResource TreeNodeEditTemplate}"
            IsReadOnly="False"
            Width="*"/>

        <telerik:GridViewComboBoxColumn
            x:Name="itemTypeColumn"
            Header="Item Type"
            DataMemberBinding="{Binding ItemTypeID, Mode=TwoWay}"
            DisplayMemberPath="Name"
            SelectedValueMemberPath="ID"
            SortMemberPath="Order"
            SortingState="Ascending"
            ItemsSource="{Binding TypeModel.Items, Mode=TwoWay}"
            IsReadOnly="True"
            Width="150"/>

        <telerik:GridViewDataColumn
            DataMemberBinding="{Binding IsActive, Mode=TwoWay}"
            Header="Include"/>

    </telerik:RadTreeListView.Columns>
</telerik:RadTreeListView>

[Ivan Ivanov]

Hi Joel,

Can you please confirm what do you mean by mentioning "Row Selector"? A picture that illustrates the UI would be very helpful.

Regards,
Ivan Ivanov
Telerik

[Joel Palmer]

See attached.  I gracefully tried to highlight the column.

[Vanya Pavlova]

Hi Joel,


The part you are trying to hide is the row indicator of each TreeListViewRow. RowIndicatorVisibility property of RadTreeListView set to Hidden cause this behavior.

Generally setting Visibility.Hidden hides the element, but reserves space in the layout.
Set this property to Collapsed and the border will disappear, you may check the following:

<telerik:RadTreeListView
    x:Name="treeListView"
    .....
    RowIndicatorVisibility="Collapsed"
    MouseDoubleClick="treeListView_MouseDoubleClick"
    PreviewMouseLeftButtonDown="treeListView_PreviewMouseLeftButtonDown">
</telerik:RadTreeListView>

Regards,
Vanya Pavlova
Telerik

[Joel Palmer]

Awesome.  I love an easy fix.  Thanks for catching that.