Cannot bind the width of dockable RadSplitContainers to parent window width in order to set the widths of docked RadSplitContainers

1 posts, 0 answers
  1. Raghavendar
    Raghavendar avatar
    4 posts
    Member since:
    Jan 2017

    Posted 10 Jan Link to this post

     Hi,

    I have two RadSplitContainers that are DockedLeft and a DocumentHost which internally contains another RadSplitContainer in my window.

    I'm trying the set the default widths of the two RadSplitContainers to occupy 20% and 30% of the MainWindow width and the rest 50% to be occupied by the DocumentHost.

    To achieve this the two RadSplitContainers Widths and binded to the parent window width and using a converter the widths are split.

    Problem: The converter is not invoked for these two docked RadSplitContainers that are outside the DocumentHost.

    However, the converter is invoked for the RadSplitContainer in DocumentHost.

    Attaching the screenshot. The docked RadSplitContainers have default widths, ideally they should occupy 20% and 30% of the window and they should maintain the same when the window is restored or resized.

    Version used: 2014.3.1117.45

    Below is the code sample:

    xaml:

    <Window x:Class="DockingWPF.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
            xmlns:dockingWpf="clr-namespace:DockingWPF"
            Title="MainWindow" WindowState="Maximized" >
        <Window.Resources>
            <dockingWpf:WidthRatioConverter x:Key="WidthRatioConverter"/>
        </Window.Resources>
        
        
        <Grid>
                <telerik:RadDocking>
                <telerik:RadDocking.DocumentHost>
                    <telerik:RadSplitContainer>
                        <telerik:RadPaneGroup>
                            <telerik:RadPane Header="Canvas" CanFloat="False"  CanUserPin="False">
                                <Grid Background="Aqua">
                                </Grid>
                            </telerik:RadPane>
                        </telerik:RadPaneGroup>
                    </telerik:RadSplitContainer>
                </telerik:RadDocking.DocumentHost>

                <telerik:RadSplitContainer InitialPosition="DockedLeft" Orientation="Vertical" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=ActualWidth, Converter={StaticResource WidthRatioConverter}, ConverterParameter=TempBrowser, Mode=OneWay}">
                    <telerik:RadPaneGroup x:Name="ApplicationPanesGroup" >
                            <telerik:RadPane Header="TemplateBrowser" CanFloat="False" CanDockInDocumentHost="False" IsPinned="True" CanUserClose="False" ScrollViewer.HorizontalScrollBarVisibility="Auto" />
                        </telerik:RadPaneGroup>
                    </telerik:RadSplitContainer>

                <telerik:RadSplitContainer Orientation="Vertical" InitialPosition="DockedLeft" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Window}}, Path=ActualWidth, Converter={StaticResource WidthRatioConverter}, ConverterParameter=AppBrowser, Mode=OneWay}">
                    <telerik:RadPaneGroup>
                        <telerik:RadPane Header="ApplicationTree" IsPinned="True" CanUserClose="False"/>
                        </telerik:RadPaneGroup>
                </telerik:RadSplitContainer>
            </telerik:RadDocking>
        </Grid>
    </Window>

    Converter:

    public class WidthRatioConverter : IValueConverter
        {
            public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
            {
                var param = parameter as string;
                if (!string.IsNullOrEmpty(param))
                {
                    switch (param)
                    {
                        case "TempBrowser":
                            return ((double) value/5);

                        case "AppBrowser":
                            return ((double) value/3);
                    }
                }

                return null;
            }

            public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
            {
                return null;
            }
        }

Back to Top