How to make a RadPaneGroup fill available space in splitter

8 posts, 0 answers
  1. Terry
    Terry avatar
    157 posts
    Member since:
    Jul 2009

    Posted 09 May 2010 Link to this post

    I've got two RadPaneGroups in a vertical  RadSplitContainer.  The first one needs to always be 130 pixels high.  The second one needs to always fill the remaining space.  Because of the differences in user screen resolutions and full screen or not, I can't use relative heights.  I've attached a screenshot that shows the splitter, outlined in aqua and the second RadPaneGroup, outlined in red.  As you can see, the second pane is scrolling, even though there is lots of available space in the splitter.

    How can I make the second pane fill the available space?

    Here's the appropriate portion of my xaml:

                <telerikDocking:RadSplitContainer Orientation="Vertical" InitialPosition="DockedRight" VerticalAlignment="Stretch" BorderBrush="Aqua" BorderThickness="3">  
                    <telerikDocking:RadPaneGroup Height="130" VerticalAlignment="Top" > 
                        <telerikDocking:RadPane Header="Toolbox" ScrollViewer.VerticalScrollBarVisibility="Visible" VerticalAlignment="Top">  
                                <ScrollViewer VerticalScrollBarVisibility="Auto">  
                                    <msCore:ListBox x:Name="lstToolbox" Grid.Column="0" dragDrop:RadDragAndDropManager.AllowDrop="True" 
                                             ItemContainerStyle="{StaticResource draggableItemStyle}" > 
                                        <ListBox.ItemTemplate> 
                                            <DataTemplate> 
                                                <StackPanel Orientation="Horizontal">  
                                                    <Image Source="{Binding IconPath}" Height="16" /> 
                                                    <TextBlock Text="{Binding Name}" Margin="5,0,5,0" /> 
                                                </StackPanel> 
                                            </DataTemplate> 
                                        </ListBox.ItemTemplate> 
                                    </msCore:ListBox> 
                                </ScrollViewer> 
                            </telerikDocking:RadPane> 
                    </telerikDocking:RadPaneGroup> 
     
                      
                    <telerikDocking:RadPaneGroup BorderBrush="Red" BorderThickness="5" VerticalAlignment="Stretch" > 
                        <telerikDocking:RadPane Header="Properties" VerticalAlignment="Stretch">  
                                <ScrollViewer VerticalScrollBarVisibility="Auto" VerticalAlignment="Stretch">  
                                    <radGridView:RadGridView x:Name="gvProperties" VerticalAlignment="Stretch" AutoGenerateColumns="False"   
                                        ScrollViewer.HorizontalScrollBarVisibility="Auto" ShowColumnHeaders="False" CanUserSelect="False" GridLinesVisibility="Both"  ShowGroupPanel="False" 
                                        ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollMode="Deferred"  RowIndicatorVisibility="Collapsed" CanUserDeleteRows="False" CanUserInsertRows="False" 
                                        BeginningEdit="gvProperties_BeginningEdit"  CellEditEnded="gvProperties_CellEditEnded"  CellValidating="gvProperties_CellValidating">  
                                          
                                        <radGridView:RadGridView.Columns>    
                                            <radGridView:GridViewDataColumn UniqueName="PropAlias" Width="100"/>    
                                            <radGridView:GridViewDataColumn UniqueName="PropValue" Width="1*"/>    
                                        </radGridView:RadGridView.Columns>    
                                    </radGridView:RadGridView> 
                                      
                                </ScrollViewer> 
                        </telerikDocking:RadPane> 
                    </telerikDocking:RadPaneGroup> 
     
                </telerikDocking:RadSplitContainer> 
     


  2. Terry
    Terry avatar
    157 posts
    Member since:
    Jul 2009

    Posted 09 May 2010 Link to this post

    I tried using the splitter SizeChanged event:

            private void Right_Splitter_SizeChanged( object sender, SizeChangedEventArgs e )  
            {  
                Properties_Group.Height = Right_Splitter.ActualHeight - 130;  
            }  
     

    it make the group size bigger, but it still crops it at the same exact height.  The net result is that the red border at the bottom disappears.

  3. DevCraft banner
  4. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 11 May 2010 Link to this post

    Hi Terry,

     SplitContainers support only relative sizing and doesn't support absolute one. Because of this limitation you cannot make the top group be 130 pixels in height (fixed) and the bottom one to fill the rest of the space. In order to set the proportions of the two panes you can set the PropertionalStackPanel.RelativeSize attached property to the groups.

    Hope this helps!

    Kind regards,
    Miroslav Nedyalkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  5. Terry
    Terry avatar
    157 posts
    Member since:
    Jul 2009

    Posted 14 May 2010 Link to this post

    Then the way for me to solve this is to set the relative heights of the two groups in the splitter resize event to values that give me the what I want.  There are examples for setting group RelativeSize in XAML, but how can I do this in C#?

    Thanks,

    Terry
  6. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 14 May 2010 Link to this post

    Hi Terry,

     You can set the ProportionalStackPanel.RelativeSize property in C# in the following way:

    ProportionalStackPanel.SetRelativeSize(target, new Size(250, 100));
    Where target is the Group or SplitContainer to which you want to set relative size.

    All the best,
    Miroslav Nedyalkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  7. Terry
    Terry avatar
    157 posts
    Member since:
    Jul 2009

    Posted 14 May 2010 Link to this post

    Thank you, Miroslav.  That works perfectly.  In case anyone else has the same problem, here's what the code looks like:

            private void Right_Splitter_SizeChanged( object sender, SizeChangedEventArgs e )  
            {  
                double toolboxHeight = 130.0;  
                double propertiesHeight = Right_Splitter.ActualHeight - toolboxHeight - 10.0;  
     
                ProportionalStackPanel.SetRelativeSize( Toolbox_Group, new Size( 250, Convert.ToInt32(toolboxHeight ) ) );  
                ProportionalStackPanel.SetRelativeSize( Properties_Group, new Size( 250, Convert.ToInt32(propertiesHeight ) ) );  
            }  
     
     
  8. Ubuntu
    Ubuntu avatar
    89 posts
    Member since:
    Jul 2012

    Posted 21 Oct 2011 Link to this post

    How can I set the ProportionalStackPanel.RelativeSize in XAML relative to other control

    Regards
  9. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 24 Oct 2011 Link to this post

    Hello Terry,

    The RelativeSize property is setting the size relatively to the groups and split containers, contained by the same split container in which is placed the target of the property and it doesn't support pointing a concrete control.

    Hope this information is helpful.

    Sincerely yours,
    Miroslav Nedyalkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top
DevCraft banner