GridView columns headers disappearing after binding to ControlPanel

1 Answer 44 Views
GridView
Lukasz
Top achievements
Rank 1
Lukasz asked on 05 Aug 2021, 06:17 AM | edited on 05 Aug 2021, 09:39 AM

Hi,

I've a problem with GridView and ControlPanel. I'd like to control visibility of GridView columns by using ControlPanel with ControlPanelItem containing ListBox with bounded Columns collection. Listbox contains checkboxes bounded to IsVisible property of GridViewColumn and content with column header.

Everything works fine until I want to show the list of columns in ControlPanelItem. After click on ControlPanelItem some of columns headers disappering. I've noticed that it's strictly related to columns with more complex headers (i.e. textblock with set text and toolTip properties).For columns with simple text header, everything is ok.

I can inverse that effect and click on column header, then column header appears, but Checkbox in ControlPanel doesn't contain any text.

 

TextBlockForDataGridHeader is a TextBlock control with overriden ToString() method.

ControlPanel definition is the same with example you've provided on ControlPanel section in telerik controls for WPF guidance.


<telerik:RadGridView ItemsSource="{Binding Results, Mode=OneWay}"
                                     SelectedItem="{Binding SelectedResult, Mode=TwoWay}">
                        <telerik:RadGridView.ControlPanelItems>
                            <telerik:ControlPanelItemCollection> 
                                <telerik:ControlPanelItem ButtonTooltip="{x:Static localization:Resources.ColumnsVisibility}"
                                                          ButtonContent="{StaticResource EyeOff}"> 
                                    <telerik:ControlPanelItem.ContentTemplate> 
                                        <DataTemplate> 
                                            <ListBox ItemsSource="{Binding Columns, Mode=OneTime}"  
                                                     BorderThickness="0"> 
                                                <ListBox.ItemTemplate> 
                                                    <DataTemplate> 
                                                        <CheckBox Content="{Binding Header, Mode=OneTime}" 
                                                                  IsChecked="{Binding IsVisible, Mode=TwoWay}" /> 
                                                    </DataTemplate> 
                                                </ListBox.ItemTemplate> 
                                            </ListBox> 
                                        </DataTemplate> 
                                    </telerik:ControlPanelItem.ContentTemplate> 
                                </telerik:ControlPanelItem> 
                            </telerik:ControlPanelItemCollection>
                        </telerik:RadGridView.ControlPanelItems> 
                        <telerik:RadGridView.Columns>
                            <telerik:GridViewDataColumn Header="{x:Static localization:Resources.Number}" 
                                                        DataMemberBinding="{Binding Index, Mode=OneTime}" />
                            <telerik:GridViewDataColumn Header="{x:Static localization:Resources.Name}" 
                                                        DataMemberBinding="{Binding Node.Name, Mode=OneTime}" />
                            <telerik:GridViewDataColumn Header="{x:Static localization:Resources.Container}" 
                                                        DataMemberBinding="{Binding ContainerName, Mode=OneTime}" />
                            <telerik:GridViewDataColumn DataMemberBinding="{Binding Real, Mode=OneTime}"
                                                        DataFormatString="{}{0:F3}">
                                <telerik:GridViewDataColumn.Header>
                                    <controls:TextBlockForDataGridColumnHeader Text="Re {U} (kV)" 
                                                                               ToolTipService.ToolTip="{x:Static localization:Resources.RealVoltage}" />
                                </telerik:GridViewDataColumn.Header>
                            </telerik:GridViewDataColumn>
                            <telerik:GridViewDataColumn DataMemberBinding="{Binding Imaginary, Mode=OneTime}"
                                                        DataFormatString="{}{0:F3}">
                                <telerik:GridViewDataColumn.Header>
                                    <controls:TextBlockForDataGridColumnHeader Text="Im {U} (kV)" 
                                                                               ToolTipService.ToolTip="{x:Static localization:Resources.RealVoltage}" />
                                </telerik:GridViewDataColumn.Header>
                            </telerik:GridViewDataColumn>
                            <telerik:GridViewDataColumn DataMemberBinding="{Binding Magnitude, Mode=OneTime}"
                                                        DataFormatString="{}{0:F3}">
                                <telerik:GridViewDataColumn.Header>
                                    <controls:TextBlockForDataGridColumnHeader Text="U (kV)" 
                                                                               ToolTipService.ToolTip="{x:Static localization:Resources.RealVoltage}" />
                                </telerik:GridViewDataColumn.Header>
                            </telerik:GridViewDataColumn>
                        </telerik:RadGridView.Columns>
                    </telerik:RadGridView>

 

I had similar problem with WPF resources. When I want to reuse some resources (i.e. icons or paths) in the same view, I have to use x:Shared clause with false value.

 

In addition, I'd like to avoid declaring seperate resources with columns for each GridView control used in my app.

Thanks for your help!
Ɓukasz

1 Answer, 1 is accepted

Sort by
1
Dinko
Telerik team
answered on 09 Aug 2021, 11:11 AM

Hello Lukasz,

Thank you for the provided image and code snippet.

You are right that the content of the Checkbox disappears. The binding transfers the TextBlock element to the CheckBox's Content in the ControlPanel and this is why the header of the column disappears. In this case, to make it work for these columns you can add the dot property access and bind to the Text property. 

 <CheckBox Content="{Binding Header.Text, Mode=OneWay}" 
                                                                  IsChecked="{Binding IsVisible, Mode=TwoWay}" />

However, in this case, other columns which do not have TextBlock in their header won't have headers. What you can try is to apply normal TextBlock to the other columns and set their Text property to the desired value. Could this approach work for you?

Regards,
Dinko
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
GridView
Asked by
Lukasz
Top achievements
Rank 1
Answers by
Dinko
Telerik team
Share this question
or