Problems when using a SyntaxEditor inside a GridView

[Patrick]

Hello,

I'm trying to use a read-only syntax editor inside a GridView. The goal is to display XML data in the grid view with syntax highlighting.
As the SyntaxEditor needs code to populate it, I defined a descendant class with Language and Text dependency properties

My first try was to use the following code for the cell:

<tk:GridViewDataColumn.CellTemplate>
  <DataTemplate>
    <os:osRadSyntaxEditor Background="Transparent"
                    IsReadOnly="True"
                    Language="Xml"
                    Text="{Binding Request}" />
  </DataTemplate>
</tk:GridViewDataColumn.CellTemplate>

 

The problems are the following:

1. The display has line numbers and unnecessary scroll bars.
2. When I try to zoom in with the mouse wheel, the height doesn't change.
3. When I try to zoom out with the mouse wheel, the control seems to have an infinite height and the application freezes, using 100% of a CPU core.

 

To avoid problem 3, I've tried to set a maximum height for the control, using MaxHeight="150". Now, each grid view row has a height of 150, even if the content is smaller.

[Dinko | Tech Support Engineer]

Hello Patrick,

Thank you for the provided code snippet.

I need to point first that RadSyntaxEditor is complex control, and placing it in every cell of RadGridView will affect performance. In a scenario, when you want to show more complex information in the cell, I would recommend checking the RadGridView Row Details feature. The Row Details template provides a more compact layout. This way, you can show only needed information in the cell, and in the row details, you can add additional information about the expanded row.

In your case, you can place the RadSyntaxEditor inside the row details. For your convenience, I have prepared a sample project which demonstrates this approach.

Regards,
Dinko
Progress Telerik

Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.

[Patrick]

Hello Dinko,

[quote]Dinko said:

I need to point first that RadSyntaxEditor is complex control, and placing it in every cell of RadGridView will affect performance.[/quote]

The goal was to show color highlighting of XML in the grid view, to make it more readable.

The grid view displays a log of the requests made by the application. Double clicking on a row displays both the request and response in a pop-up window.

But the problem is that the control doesn't work correctly.

[Dinko | Tech Support Engineer]

Hi Partick,

I will return back to your first post as using RowDetails is not an option. 

• To hide the line numbers you will need to clear the Margins.ScrollableLeft collection.
• To remove the scrollbars you can use the HorizontalScrollBarVisibility or VerticalScrollBarVisibility property of the RadSyntaxEditor.
• To zoom the RadSyntaxEditor you will need to press and hold the Ctrl key. While zoom the height of the control will not be changed.
• I will suggest here to set the Height property of the RadSyntaxEditor so that the control does not measure with infinity.

I have modified the sample project which demonstrate the above approaches. Hope they will work for you.

Regards,
Dinko
Progress Telerik

Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allows you to write beautiful native mobile apps using a single shared C# codebase.