TextTrimming on the property editor

[HDC]

Hi,

The property editor is split in 2 columns:

Label Column
Editor Column

I want to create a property editor with following features:

It must show a readonly textbox that contains the path of a file
At the right side i must have a button that allows opening a filedialog
I do not want the property editor to show a horizontal scrollbar

I have created a readonly textbox that contains the path of the file, it will contain a button with which i can open a filedialog. I have made a template that will show a texttrimmed textblock. So far so good...

I know the horizontal scrollbar can be turned of in the property editor. But the textbox always resizes so it can show the entire path. This means that if the text in it is to long, i will not see the button on the right.

I have found there is a property for the Width of the label column but not for the width of the editor column, so how can i set the MaxWidth of my editor match the width of the Editor column?

What i want to achieve is like the visual studio property editor... that there is no horizontal scrollbar shown at any time... but that the user would have to resize the propertygrid for seeing the entire path of the file.

Is this possible?

[Ivan Ivanov]

Hello Peter,

In order to achieve this you have to find the ScrollViewer element in RadPropertyGrid's template, named PART_ItemsScrollViewer and set its HorizontalScrollBarVisibility to Disabled. Then set the TextBox's TextWrapping property to Wrap. Please, test this approach and let us know whether it is applicable in your scenario.

Greetings,
Ivan Ivanov
the Telerik team

[HDC]

Hi Ivan,

Is there really no other way then to overhaul the entire style?

I'm suffering the same problem as this guy:

http://www.telerik.com/community/forums/silverlight/property-grid/exception-when-using-extracted-template.aspx

I'm also getting ... StyleManager.BasedOn threw an exception, is there any progress on this issue?

This should be as simple as saying Scrollviewer.HorizontalScrollbar = "Disabled", but that doesn't work either.

Best Regards,

Peter

[Ivan Ivanov]

Hello Peter,

Actually you do not need to modify the template. You may try searching for the ScrollViewer element in the visual tree at runtime instead.

Regards,
Ivan Ivanov
the Telerik team

[HDC]

Hi Ivan,

How do i do that?

When i execute:

VisualTreeHelper.GetParent(SlidePropertyGrid);

I get null as value?

Best Regards,

Peter

[Ivan Ivanov]

Hi Peter,

Please, try using this extension method instead:

ScrollViewer sv = radPropertyGrid.ChildrenOfType<ScrollViewer>().FirstOrDefault();

Kind regards,
Ivan Ivanov
the Telerik team

[HDC]

Sorry Ivan... always returns NULL

Here is the xaml code where i define the property grid, maybe it is of use to you.

<telerikDocking:RadDocking Grid.Row="1">
     <telerikDocking:RadSplitContainer InitialPosition="DockedRight" Orientation="Vertical" Width="400">
       <telerikDocking:RadPaneGroup x:Name="PropertiesRadPaneGroup">
         <telerikDocking:RadPane x:Name="Properties" Header="Properties">
           <telerik:RadPropertyGrid x:Name="SlidePropertyGrid"
                                    AutoGeneratePropertyDefinitions="True"
                                    LabelColumnWidth="160"
                                    Item="{Binding PropertyGridItem, Mode=TwoWay}"
                                    HorizontalAlignment="Stretch"
                                    >
           </telerik:RadPropertyGrid>
         </telerikDocking:RadPane>
       </telerikDocking:RadPaneGroup>
     </telerikDocking:RadSplitContainer>

[Eric]

Is there a resolution for this? I am having the same issue. I have a label and button in the property editor and the property grid ignores the TextTrimming property on the textblock allowing the textblock width to grow causing the button to be hidden.

[HDC]

Sorry Eric,

Never did get this to work... seems like a "normal" request for a property editor.

If you can find a solution, please share.

Best Regards,

Peter

[Eric]

Peter

I was able to get the implementation I needed to work. Below is the code:

XAML:

<telerik:PropertyDefinition DisplayName="Remote Directory" Description="The base remote path of the directory." GroupName="Mappings" OrderIndex="6">
    <telerik:PropertyDefinition.EditorTemplate>
        <DataTemplate>
            <Grid>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <TextBlock Text="{Binding BaseRemoteDirectory, Mode=OneWay}" TextTrimming="WordEllipsis" VerticalAlignment="Center">
                        <ToolTipService.ToolTip>
                            <TextBlock Text="{Binding BaseRemoteDirectory, Mode=OneWay}" TextTrimming="WordEllipsis" TextWrapping="Wrap" MaxHeight="85" MaxWidth="275"/>
                        </ToolTipService.ToolTip>
                    </TextBlock>
                    <telerik:RadButton Content="View" Grid.Column="1" Width="55" Click="OnViewRemoteVirtualDirectory_Click" Margin="1"/>
                </Grid>
            </Grid>
        </DataTemplate>
    </telerik:PropertyDefinition.EditorTemplate>
</telerik:PropertyDefinition>

Code Behind:

PropertyGridPresenter presenter     = null;
ScrollViewer          scroll_viewer = null;
void OnPropertyGrid_LayoutUpdated(object sender, EventArgs e)
{
    try
    {
        if (presenter != null)
        {
            // Set the presenters width to the property grids actual width accounting for the width
            // of the verticle scrollbar which may or may not be currently visible.
            presenter.Width = prop_grid.ActualWidth - (prop_grid.ActualWidth - scroll_viewer.ViewportWidth);
        }
    }
    catch (Exception ex)
    {
        ApplicationExceptionManager.Add(new ApplicationException(ApplicationExceptionCodes.Exception, ex));
    }
}
void OnPropertyGrid_Loaded(object sender, RoutedEventArgs e)
{
    try
    {
        // Grab a reference to the property grid presenter.
        presenter = prop_grid.ChildrenOfType<PropertyGridPresenter>().First();
        // Grab a reference to the scrollviewer containing the presenter.
        scroll_viewer = presenter.GetVisualParent<ScrollViewer>();
        // Hide the horizontal scrollbar.
        scroll_viewer.HorizontalScrollBarVisibility = ScrollBarVisibility.Hidden;
    }
    catch (Exception ex)
    {
        ApplicationExceptionManager.Add(new ApplicationException(ApplicationExceptionCodes.Exception, ex));
    }
}

You can also used the SizeChanged event on the RadPropertyGrid instead of the LayoutUpdated event. However the SizeChanged event is not triggered when collapsing or expanding property groups so I needed to use LayoutUpdated instead. It is called more often than I like but its not an expensive call.

This give me the functionality I was after which was to have a property editor with a TextBlock with TextTrimming enabled and a button. The TextBlock also shows a tooltip with a larger TextBlock that also has TextTrimming enabled.

Thanks

Eric

[HDC]

Hi Eric,

Thanks a lot for sharing that... i will surely give this a spin and see if it is applicable to my situation also.

Did you do this in the latest release? Because we are running a bit behind schedule on our project and we didn't find the time yet to upgrade to the latest version.

Best Regards,

Peter

[Ivan Ivanov]

Hi Peter,

Please, let me clarify that the mentioned workaround is proposed by another community member and it is not natively supported by any version of RadControls. However, I am very glad to know that you have managed to handle this scenario. As a side note, please let me propose you to send us a runnable project implementing this solution, so that we could test it and inform you of any possible concerns for  its integration with the current latest version of RadControls.

Regards,
Ivan Ivanov
the Telerik team

[Eric]

Peter

We are currently using version 2011.3.1205.1040.

[HDC]

Hi Eric,

I cannot thank you enough for this solution, it works like a charm and it really makes a big difference for our application. Hopefully Telerik sees the necessity of this feature being supported out of the box and tries to work out an easier solution.

Somebody should give you some points for this Eric, definately a nice job!

Best Regards,

Peter

[HDC]

Hi Ivan,

I understand that this solution is not natively supported. Normally speaking we plan to migrate our codebase to the latest telerik version tomorrow. I will verify if this still works with the latest version.

It is not easy for us to pull this our of our application (and it's a large application) and we have done some heavy integration of the property grids features including dynamically loading custom editors per displayed datatype. But the code submitted by Eric is actually
quite complete, the only thing i needed to do was implement the two events exactly as Eric has described. 

I think that this is a valid scenario that many people are looking for and that should be supported by Telerik in some future version.

Best Regards,

Peter

[Ivan Ivanov]

Hello Peter,

We have had a few similar layout requirements for client's scenarios, but the most appropriate solution always turns out to require hardcoded measurement values. In order to implement a native behavior that deals with such scenarios, we should not rely on any hardcoded values, as we target a universal solution to the whole class of problems. Currently, I cannot specify any time span for the implementation of such mechanism, so that I will advise you to stick to the custom workarounds. However, I will be glad to help you if you have any specific problems on this, so that do not hesitate to contact us if you have any further inquiries.

Regards,
Ivan Ivanov
the Telerik team

[Karthik]

Hi,

Has there been a better to tackle this issue? We are currently using 2019.3.1023 version.

[Dilyan Traykov]

Hi Karthik,

Although we have not introduced a generic mechanism that will work in all similar user scenarios, if you would specify your current setup and describe why Eric's approach would not work for you, I'd be more than happy to try and suggest a viable solution for your particular case.

Regards,
Dilyan Traykov
Progress Telerik

[Karthik]

Hi,

Thanks for the response. We are trying to avoid code behind much as possible as we are using a MVVM approach.And this control is used in many of our screens so we would like to avoid repeating the code behind. A template/XAML only approach would be appreciated.

[Dilyan Traykov]

Hi Karthik,

Thank you for the clarification.

In such case, I can recommend moving the code Eric provided to an attached behavior and apply this behavior via an implicit style in your App.xaml file to all RadPropertyGrid controls in your application.

Please let me know if you would find this possible. If you need any help with the exact implementation at your end, please open a new support ticket and send over a small sample project which demonstrates your current setup so that we can further assist you.

Regards,
Dilyan Traykov
Progress Telerik