Collection Editor - How to change the Label Column Width in xaml?

6 posts, 2 answers
  1. Joel
    Joel avatar
    53 posts
    Member since:
    Sep 2013

    Posted 12 Sep Link to this post

    Hi,

      The Collection Editor is part of RadPropertyGrid defined below:
       

    <telerik:RadPropertyGrid x:Name="grdTestProperty"
                             Item="{Binding TestProperty, Mode=OneWay}"
                             SearchBoxVisibility="Collapsed"
                             SearchInNestedProperties="False"
                             FieldIndicatorVisibility="Collapsed"
                             IsVirtualizing="False"
                             AutoGeneratePropertyDefinitions="True"
                             NestedPropertiesVisibility="Visible"
                             LabelColumnWidth="150"                                 
                             RenderMode="Hierarchical"
                             IsReadOnly="{Binding IsReadOnly, Mode=OneWay}"/>

       Please see attached picture showing the desired output.

     

  2. Answer
    Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    371 posts

    Posted 13 Sep Link to this post

    Hello Joel,

    I'm attaching a sample project to demonstrate how you can achieve the desired behavior.

    Please have a look at it and let me know whether such an approach would be suitable for you.

    Regards,
    Dilyan Traykov
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. UI for WPF is Visual Studio 2017 Ready
  4. Joel
    Joel avatar
    53 posts
    Member since:
    Sep 2013

    Posted 13 Sep Link to this post

    Hi Dilyan,

      After applying the AutoColumnWidthBehavior, the PropertyGrid inside the CollectionEditor is showing acceptable Label Column Width behavior. However, the Items listbox width is also increased - which is not desirable. Please see attached screenshot.
    It could be caused by the following Grid ColumnDefinition in CollectionEditor_Template.

    <Grid Background="Transparent">
       <Grid.ColumnDefinitions>
       <ColumnDefinition Width="2*"/>
       <ColumnDefinition Width="3*"/>
    </Grid.ColumnDefinitions>

      Is there any way to just change the Label Column Width of the PropertyGrid without affecting the Item width?

     

  5. Joel
    Joel avatar
    53 posts
    Member since:
    Sep 2013

    Posted 13 Sep Link to this post

    Hi Dilyan,

    private static void PropertyGrid_Loaded(object sender, RoutedEventArgs e)
    {
        Application.Current.Dispatcher.BeginInvoke((Action)(() =>
        {
            var propertyGrid = sender as RadPropertyGrid;
            double maxWidth = 0;
            var propertyDefinitions = propertyGrid.ChildrenOfType<PropertyGridField>().ToList();
     
            foreach (var item in propertyDefinitions)
            {
                var label = item.ChildrenOfType<TextBlock>().Where(x => x.Name == "PART_FieldLabelN").First();
                maxWidth = Math.Max(label.DesiredSize.Width, maxWidth);
            }
     
            propertyGrid.LabelColumnWidth = new GridLength(Math.Max(maxWidth, propertyGrid.LabelColumnWidth.Value));
     
            //var collectionEditor = propertyGrid.ParentOfType<CollectionEditor>();
            //if (collectionEditor != null)
            //{
            //    collectionEditor.Width += maxWidth;
            //}
        }), DispatcherPriority.Background);
    }

     

    I have commented out the collectionEditor.Width assignment.

    It is causing the collection editor to increase its width indefinitely every time it is loaded.

    The Label Column Width is behaving as expected now.

     

  6. Answer
    Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    371 posts

    Posted 14 Sep Link to this post

    Hello Joel,

    I do apologize for neglecting this undesired effect. Replacing the code from my previous reply with the snippet below should result in the expected behavior:

    private static void PropertyGrid_Loaded(object sender, RoutedEventArgs e)
    {
        Application.Current.Dispatcher.BeginInvoke((Action)(() =>
        {
            var propertyGrid = sender as RadPropertyGrid;
            double maxWidth = 0;
            var propertyDefinitions = propertyGrid.ChildrenOfType<PropertyGridField>().ToList();
     
            foreach (var item in propertyDefinitions)
            {
                var label = item.ChildrenOfType<TextBlock>().Where(x => x.Name == "PART_FieldLabelN").First();
                maxWidth = Math.Max(label.DesiredSize.Width, maxWidth);
            }
     
            var collectionEditor = propertyGrid.ParentOfType<CollectionEditor>();
            if (collectionEditor != null && propertyGrid.LabelColumnWidth.Value != maxWidth)
            {
                collectionEditor.Width += maxWidth;
            }
             
            propertyGrid.LabelColumnWidth = new GridLength(Math.Max(maxWidth, propertyGrid.LabelColumnWidth.Value));
     
        }), DispatcherPriority.Background);
    }

    I hope this works for you.

    Regards,
    Dilyan Traykov
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  7. Joel
    Joel avatar
    53 posts
    Member since:
    Sep 2013

    Posted 15 Sep in reply to Dilyan Traykov Link to this post

    Perfect!
Back to Top
UI for WPF is Visual Studio 2017 Ready