How to close the CollectionEditor on button click

[Semih]

Hello, 

Below is a part of the template of CollectionEditor. I've added a new button named "ButtonClose" in to the footer of the collection editor. What should I do in code behind to make the collection editor close? Simply change the visibility?



<Border x:Name="FooterPanel_Background" Grid.Row="3" BorderBrush="{StaticResource ControlOuterBorder}" BorderThickness="0,1,0,0"  Grid.ColumnSpan="2" Background="{StaticResource CollectionEditor_FooterPanel_Background}">
                            <Grid>
                                <StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
                                    <telerik:RadButton IsEnabled="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsReadOnly, Converter={StaticResource InvertedBooleanConverter}}" 
                                                       MinWidth="48"  MinHeight="21"  Margin="4,6,4,7" 
                                                       telerik:StyleManager.Theme="{StaticResource Theme}" 
                                                       telerik:LocalizationManager.ResourceKey="CollectionEditorAdd"
                                                       Command="{x:Static propertyGrid:CollectionEditorCommands.AddNew}"/>
                                    <telerik:RadButton IsEnabled="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsReadOnly, Converter={StaticResource InvertedBooleanConverter}}" 
                                                       MinWidth="48" MinHeight="21"  Margin="0,6,4,7" 
                                                       telerik:StyleManager.Theme="{StaticResource Theme}" 
                                                       telerik:LocalizationManager.ResourceKey="CollectionEditorRemove"
                                                       Command="{x:Static propertyGrid:CollectionEditorCommands.Delete}"/>
                                    <telerik:RadButton MinWidth="48" MinHeight="21"  Margin="0,6,4,7" Name="ButtonClose"
                                                       telerik:StyleManager.Theme="{StaticResource Theme}" 
                                                       Content="Close"
                                                       Click="ButtonClose_Click"/>
                                </StackPanel>
                                <Thumb x:Name="PART_ResizeThumb" Style="{StaticResource CollectionEditorGripperStyle}" Visibility="{TemplateBinding ResizeGripperVisibility}"/>
                            </Grid>
                        </Border>

[Dimitrina]

Hi,

The CollectionEditor is placed in a RadDropDownButton. Below you can find the exact way it is defined in the template of RadPropertyGrid:

<ControlTemplate x:Key="CollectionEditorPicker_Template" TargetType="propertyGrid:CollectionEditorPicker">
    <Border Background="{TemplateBinding Background}" CornerRadius="1" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <TextBlock Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Source}" Margin="4,0,0,0" VerticalAlignment="Center" x:Name="PART_CollectionEditorTextBlock"/>
            <telerik:RadDropDownButton
                    IsEnabled="{TemplateBinding IsEnabled}"
                    Grid.Column="1"
                    Margin="0,-1,-1,-1"
                    Padding="0"
                    PopupPlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}">
                <telerik:RadDropDownButton.DropDownContent>
                    <propertyGrid:CollectionEditor x:Name="PART_CollectionEditor"
                            BorderThickness="0"
                            IsReadOnly="{TemplateBinding IsReadOnly}"
                            Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay, Path=Source}"
                            Header="{Binding RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay, Path=Header}"
                            ResizeGripperVisibility="Visible"/>
                </telerik:RadDropDownButton.DropDownContent>
            </telerik:RadDropDownButton>
        </Grid>
    </Border>
</ControlTemplate>

In order to be able to close it on a button click, you can try finding its parent of type RadDropDownButton and close it directly.

How does such an approach work for you?

Regards,
Dimitrina
Telerik