How to make a RadPaneGroup fill available space in splitter

[Terry]

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>

[Terry]

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.

[Miroslav Nedyalkov]

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.

[Terry]

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

[Miroslav Nedyalkov]

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.

[Terry]

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 ) ) );
        }

[Ubuntu]

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

Regards

[Miroslav Nedyalkov]

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.