Telerik Forums / UI for Silverlight Forum / GridView /

HierarchyChild table scroll/performance

Telerik UI for Silverlight
Resources Buy Try

3 posts, 0 answers

Vit100

66 posts

Member since:
Oct 2012
Posted 04 Jan 2012 Link to this post

According to doc (http://www.telerik.com/help/silverlight/gridview-troubleshooting-performance.html) child table can not be used without setting width/height.
But how to achive result that child grid takes all horizontal space with any screen resolution?
See attached pictures

On Picture1 size is set to 800 and 400 px but in this case space is not used properly - there are unused borders on left and right sides.

If maxWidth and MaxHeight are removed (picture2) than there are other problems - performance and column width (no scrolling) screwed.....

?????

Another question abt sample here http://demos.telerik.com/silverlight/#GridView/Hierarchy/HierarchyChildTemplate
Sample code doesn't define width/height for child. Does it mean that performance is suffering?
Also if browser window is narrow, horizontal scroll bar doesn't appear. Why?

And last thing related to this problem - pls have a look at this clip

. You see how strange scroll bars work?

Capture.PNG

Capture2.PNG
Maya
Admin

4062 posts

Posted 05 Jan 2012 Link to this post

Hello Vitaliy,
Generally, it is not obligatory to set width and height of the child grids. It will indeed lead to performance improvements, but this will be noticeable if you handle a lot of data items.
Considering synchronizing the width of the inner grids so that they take up the available space, I would suggest to take a look at this forum thread for a reference on a possible approach.
As for the appearance of the scroll bars, will it be possible to share some more information about the way you define your RadGridView ? Do you place it in another control ? Basically, any relevant code-snippet or detail will be helpful.

All the best,
Maya
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
Vit100

66 posts

Member since:
Oct 2012

Posted 05 Jan 2012 Link to this post

approach in mentioned forum thread is not good.
Child table width is not dynamic and if parent width changes, child stays with the same width when it was created.

Regarding video this is xaml:

<Grid>

       <Grid.RowDefinitions>

           <RowDefinition Height="Auto"/>

           <RowDefinition Height="*"/>

       </Grid.RowDefinitions>

       <Border Style="{StaticResource HeaderBackground}">

           <TextBlock Grid.Row="0" Text="Customer Search Results" Style="{StaticResource HeaderTextBlock}"/>

       </Border>

       <telerik:RadGridView x:Name="CustomerSearch_CustomersGrid" Grid.Row="1" IsReadOnly="True"

                            IsBusy="{Binding IsCustomerTableBusy}"

                            ItemsSource="{Binding Customers}"

                            AutoGenerateColumns="False"

                            ShowColumnFooters="True"

                            RowIndicatorVisibility="Collapsed"

                            SelectionMode="Extended" SelectionUnit="Cell"

                            RowIsExpandedChanging="CustomerSearchResult_RowIsExpandedChanging"

                            RowLoaded="CustomerSearchResult_RowLoaded" RowHeight="15"

                            RowStyleSelector="{StaticResource RowStyleSelector}"

                            ScrollViewer.HorizontalScrollBarVisibility="Disabled"

                            RowActivated="CustomerRowActivated"

                                 >

           <telerik:RadGridView.Columns>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding SiteCount}" Width="SizeToHeader" IsFilterable="False" IsGroupable="False"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding FirstName}" TextTrimming="WordEllipsis" Width="*"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding LastName}" TextTrimming="WordEllipsis" Width="*">

                   <telerik:GridViewDataColumn.AggregateFunctions>

                       <telerik:CountFunction Caption="Count:"/>

                   </telerik:GridViewDataColumn.AggregateFunctions>

               </telerik:GridViewDataColumn>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding BusinessName}" Width="*" TextTrimming="WordEllipsis"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding CustomerClassification}" Width="SizeToHeader"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding CustomerRCE}" Width="SizeToHeader" TextTrimming="WordEllipsis"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding PhoneNumber}" Width="Auto"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding Address}" Width="*" TextTrimming="WordEllipsis"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding City}" Width="Auto"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding JurisdictionIdentifier}" Width="Auto"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding Country}" Width="SizeToHeader" TextTrimming="WordEllipsis"/>

               <telerik:GridViewDataColumn DataMemberBinding="{Binding PostalCode}" Width="SizeToHeader" TextTrimming="WordEllipsis"/>

               <telerik:GridViewColumn Width="30">

                   <telerik:GridViewColumn.CellTemplate>

                       <DataTemplate>

                           <HyperlinkButton x:Name="CustomerSearch_CustomerDetailsBtn" Content="..." Style="{StaticResource DetailsLinkBtns}" Click="CustomerSearchClick"/>

                       </DataTemplate>

                   </telerik:GridViewColumn.CellTemplate>

               </telerik:GridViewColumn>

           </telerik:RadGridView.Columns>

           <telerik:RadGridView.ChildTableDefinitions>

               <telerik:GridViewTableDefinition />

           </telerik:RadGridView.ChildTableDefinitions>

           <telerik:RadGridView.HierarchyChildTemplate>

               <DataTemplate>

                   <Grid MaxWidth="950" MaxHeight="300">

                       <Grid.RowDefinitions>

                           <RowDefinition Height="*"/>

                           <RowDefinition Height="Auto"/>

                       </Grid.RowDefinitions>

                       <telerik:RadGridView ItemsSource="{Binding PagedSource, ElementName=SitesPager}" x:Name="CustomerSearch_SiteGrid"

                                            ShowGroupPanel="False" IsReadOnly="True"

                                            AutoGenerateColumns="False"

                                            RowHeight="15"

                                            RowIndicatorVisibility="Collapsed"

                                            RowActivated="SiteRowActivated"

                                            SelectionMode="Extended"

                                            SelectionUnit="Cell"

                                            >

                           <telerik:RadGridView.Columns>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Utility.CommodityTypeIdentifier}"

                                                           Width="SizeToCells"

                                                           TextTrimming="WordEllipsis"

                                                           IsFilterable="False"

                                                           IsGroupable="False"

                                                           />

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Utility.UtilityProviderAccount}" Width="Auto"

                                                           IsFilterable="False"

                                                           IsGroupable="False"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Utility.MarketParticipantIdentifier}" Width="SizeToHeader" TextTrimming="WordEllipsis"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Address.Street}" Width="SizeToCells" TextTrimming="WordEllipsis"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Address.City}" Width="Auto" TextTrimming="WordEllipsis"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Address.Country}" Width="SizeToHeader" IsFilterable="False"

                                                           IsGroupable="False"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding Address.PostalCode}" Width="SizeToHeader"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding RetailerID}" Width="Auto" IsFilterable="False"

                                                           IsGroupable="False"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding StartDate}" DataFormatString="{}{0:d}" Width="Auto" IsFilterable="False"

                                                           IsGroupable="False"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding ContractClassification}" Width="Auto" Header="Con Class"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding ContractRCE}" Width="Auto" Header="Con RCE"/>

                               <telerik:GridViewDataColumn DataMemberBinding="{Binding ContractStatusIdentifier}" Width="Auto" Header="Status"/>

                               <telerik:GridViewColumn Width="30">

                                   <telerik:GridViewColumn.CellTemplate>

                                       <DataTemplate>

                                           

                                           <HyperlinkButton x:Name="CustomerSearch_SiteDetailsBtn" Content="..." Style="{StaticResource DetailsLinkBtns}" Click="siteSearch_Click"/>

                                           

                                       </DataTemplate>

                                   </telerik:GridViewColumn.CellTemplate>

                               </telerik:GridViewColumn>

                           </telerik:RadGridView.Columns>

                        </telerik:RadGridView>

                       <telerik:RadDataPager Grid.Row="1" x:Name="SitesPager" Source="{Binding Sites}" PageSize="100" DisplayMode="All" NumericButtonCount="10" />

                   </Grid>

               </DataTemplate>

           </telerik:RadGridView.HierarchyChildTemplate>

       </telerik:RadGridView>

   </Grid>

HierarchyChild table scroll/performance

Vit100

Maya

Vit100