SyntaxEditor Wrapping and scrolling

Hi Dinko

Thanks for the solution to the scrolling - it works very well.

For the theme I am using Fluent

Regards

Hi Dinko,

Nope, only the customization you suggested for the wheel scroll. I have my RadSyntaxEditor docked in a LayoutControlGroup.

The editor had a padding of Left=5 which I had forgotten why I did it but after removing it I can see why though it doesn't help.

I've attached a screenshot of the whole left side of the form. With no padding whatsoever the 2 is getting cut off outside of the component. Very strange :|

Regards

Hi Dinko,

Sorry I didn't get back sooner, I had put this aside to work on other things. Revisiting it now as it's becoming a bit annoying :)

There is one thing I realized that I didn't mention earlier but the LayoutControlGroup I'm using is not Telerik's. 

I've managed to track down exactly where it's going wrong via debugging but I'm not sure how to override it, so hoping you might have an idea how.

The Telerik.WinControls.SyntaxEditor library has the namespace Telerik.WinForms.Controls.SyntaxEditor.UI.Margins.

Under there, there is this class:

public class LineNumberMargin : SyntaxEditorMargin
{
	....  lots of stuff...

	protected override void UpdateUIOverride(UIUpdateContext updateContext)
	{
		double num = Math.Max(1.0, base.Editor.ScaleFactor);
		double num2 = this.CalculateWidth();  // Always returns 45.75 for me
		..... and so on.....
	}

	protected internal virtual double CalculateWidth()
	{
		int num = this.GetMaxLineCount().ToString().Length;
		num = Math.Max(num, 5);
		this.measureBlock.Text = new string('0', num);
		return this.measureBlock.GetWidth() + 10.0;
	}

}

The CalculateWidth double is responsible for clipping my text. If I manually edit the return value in memory to 50 (instead of 45.75), it resolves the clipping perfectly. If I could get that CalculateWidth calculation to add 15.0 instead of 10.0 it would be perfect.

As to why this is only an issue for me, I have no idea.

Regards

Upon checking the LineNumberMargin class the 10.0 value is a constant name  LineNumberMargin.RightMargin is equal to 10. As I am not able to reproduce it I can't be sure what will be the best approach here. Still what you could try on your side is to create a custom class that derives from LineNumberMargin. Then you could override the CalculateWidth() method and modify the value return from the base method. Now replacing the default LineNumberMargin class will require to use of reflection as the RadSyntaxEditor control does not provide API to do that. Here you could subscribe to the Load method of the Form and replace the default class with the custom one.

private void Form1_Load(object sender, EventArgs e)
{
    BindingFlags bindFlags = BindingFlags.Instance | BindingFlags.Public | BindingFlags.NonPublic
| BindingFlags.Static;
    FieldInfo field = this.radSyntaxEditor1.SyntaxEditorElement.GetType().GetField("defaultLineNumberMargin", bindFlags);
    field.SetValue(this.radSyntaxEditor1.SyntaxEditorElement, new MyLineNumberMargin(this.radSyntaxEditor1.SyntaxEditorElement));
}     

public class MyLineNumberMargin : LineNumberMargin
{
    public MyLineNumberMargin(RadSyntaxEditorElement syntaxEditor) : base(syntaxEditor)
    {

    }
    protected override double CalculateWidth()
    {
        return base.CalculateWidth() +10;
    }
}

You can test it and share how it goes.

Hi Dinko,

Thanks so much for your example override, really appreciate that. I implemented your suggestion exactly and while I got no errors, it didn't make any change. Even if I hardcode a double to return, same result so i guess the override is not triggering.

Maybe something small to tweak?

Regards

After debugging the source code it turns out that is not easy to trigger the override method of the CalculateWidth. After searching for a simple solution I think I have found one. What you can do is to use the Margins collection of the control and insert an additional element with Width 5 to offset the line numbers a little bit.

this.radSyntaxEditor1.SyntaxEditorElement.Margins.ScrollableLeft.Insert(0,new Telerik.WinControls.SyntaxEditor.UI.Rectangle() { Fill = Brushes.LightBlue, Width = 5 });
// you can set transparent color

Hi Dinko,

Thanks very much for that. Unfortunately it didn't work, it has a similar effect to adding padding when I used Brushes.Transparent

I guess I need to specifically address the LineNumberMargin that's getting cropped somehow. I think being able to override CalculateWidth is my only hope.

Regards

Hi Dinko,

The size of the margin does indeed increase, for example this is the 50 you suggested to test:

And just to test I colored the margin:

While debugging I found the CalculateWidth() was used to measure how much space the lineNumber text actually needs so if CalculateWidth() does not return sufficient space, it's going to clip the text regardless of the margin. This is what I tested when I patched it in memory to return a larger double.

As for the LayoutControlGroup it is the DevExpress version of it I am using. I think it is similar to the Telerik version. There are two sections. The top section is a sort of header that provides limited information, the bottom section is where I have the radsyntaxcontrol inside which presents the entire log. The top section is minimizable  which allows the radsyntaxcontrol to take up almost the entire form.

I guess this screenshot shows exactly what is going on. Top section has two datagrids.

Nothing that special really, which makes it all confusing why the sytax control margin is behaving like this I guess.

Regards

EDIT: Just to add, if I can permanently fix the size of the Line number margin that would also be acceptable. The number of lines will never go over 6 digits - because the performance starts becoming  a huge problem at this point. So I would be happy to hard code the size to be 6 digits worth of width.

Thank you for the additional details.

Modifying the value of the CalculateWidth() method will require numerous reflection methods to get private properties and fields and changed their values. That is why this won't be an option. In the first place, I suggested it but it seems that I haven't tested this approach well. However, in your post, you mentioned "Line number margin". This gives me an idea to test. By default, the Margin property of the LineNumberMargin is 0 on all sides. If I apply 5 px on the left, the line number values are clipped. Can you check the Margin property on your side and set all sides to 0. You could do that in the Load event of the Form.

private void Form1_Load1(object sender, EventArgs e)
{
// the first element in the collection should be LineNumberMargin object
    this.radSyntaxEditor1.SyntaxEditorElement.Margins.ScrollableLeft[0].Margin = new Padding(0, 0, 0, 0);
}

Hi Dinko,

Thanks for that.

I checked the default for me is indeed set to 0

I experimented with adding 5 to the left which is the top part of the screenshot. The bottom part is the default/0.

The 5 pushes the line number across and clips the separator line but other than that the number is always clipped.

Hi Dinko,

I tried your suggestions but made no difference however I think I know how you can replicate it now.

I started thinking it might be a font issue. I have a completely unrelated issue (that's extremely low priority) with using custom monospaced fonts but as an experiment I also tried to see how the clipping is:

It's actually worse! This font is size 13. Impossible for me to use this custom font. This is very interesting.. so i did some experimenting.

During initialization of the form I set the EditorFontFamily:

this.logViewer.SyntaxEditorElement.EditorFontFamily = new Telerik.WinControls.SyntaxEditor.UI.FontFamily("Courier New");

But on the designer, it's just the default since I wanted to programmatically handle it and allow users to select a font:

I disabled my EditorFontFamily initialization so it uses the default to test.

BINGO! No more clipping! It's right up against the edge, but that's easily solved by padding.

Next I changed the font on the designer to be the initially desired one:

Then:

No clipping, but it's also not respecting the font I wanted.

So I readded my EditorFontFamily initializer while keeping the font set to Courier New

Back to clipping!

I *think* the issue is with the RadSytaxEditor not handling other font sizes well somehow when it comes to calculating the width required.

If I set the EditorFontSize to be 12 or less there is also no clipping, but the text of course becomes too small at that point. 13 (default) is the sweet spot.

Regards

Hi Histro,

Yes that's exactly it and thanks so much for the workaround. It works!

This is working great for using Courier New now which was my default intentionally.

It actually also partially solves the issue I was having with a third party custom font - Comic Code.

Since this might be related I'll mention it here. It was a low priority for me as I was more focused on getting the basics working.

I was having massive character spacing issues which was very strange for a monospace font. With this work-around it is significantly better however there are a few odd behaviors that occur in the RadSyntaxEditor but not other standalone editors using the same font.

Here is an example:

Line 9 really shows several weird things going on especially with databasepropertyex.

Thanks so much for the workaround though! My apologies for how long it took for me to find that it was a font issue - I was rather focused on it being a line margin issue.

Regards

Hi Dinko,

The Comic Code does have a free free version you can grab from the same place you purchase it from. I don't think the license permits me to share the commercial version.

However I do have the Comic Mono loaded up as I was also testing that one when I was having the spacing issue.

Different results but also serious spacing issues.

Just to add, these results are similar to what I was previously seeing with the Comic Code font before the line margin fix. So it seems these are linked somehow.

Regards

Hi Dinko,

Yeah that sounds like the demo. I can use the freely available Comic mono to test so I have the same settings as you.

I have the following code (just before the work-around code for margin size)

this.logViewer.SyntaxEditorElement.UseMonospacedFontOptimization = true; 
using (Stream stream = Assembly.GetAssembly(this.GetType()).GetManifestResourceStream("Application.Resources.ComicMono.ttf"))
{
	ThemeResolutionService.LoadFont(stream);
}
this.logViewer.SyntaxEditorElement.EditorFontFamily = new Telerik.WinControls.SyntaxEditor.UI.FontFamily("Comic Mono");
this.logViewer.SyntaxEditorElement.EditorFontSize = 13;

I do indeed have custom folding, 3 of them. 

ReportEngineFoldingeTagger foldingTagger = new ReportEngineFoldingeTagger(this.logViewer.SyntaxEditorElement);
foldingTagger.FoldingRegionDefinitions.Add(new FoldingRegionDefinition("START REPORT", "END REPORT"));
foldingTagger.FoldingRegionDefinitions.Add(new FoldingRegionDefinition("Prepare cursor", "Close cursor"));
foldingTagger.FoldingRegionDefinitions.Add(new FoldingRegionDefinition("Open cursor on", "Close cursor on"));
this.logViewer.TaggersRegistry.RegisterTagger(foldingTagger);

I wasn't sure if you were suggesting they might be a problem so I disabled them all to test but same result using Comic Mono:

Regards

Hello, Simon,   

My colleague, Dinko, is out of office today so I will be assisting you with this case. After further testing, I was able to replicate the undesired spacing when the font is NOT installed on the current machine:

After installing the font locally, everything seems to work as expected with the following code snippet:

Please try installing the custom font and let me know what is the observed result then.

            this.radSyntaxEditor1.SyntaxEditorElement.UseMonospacedFontOptimization = true; 
            using (Stream stream = File.OpenRead(@"..\..\Resources\ComicMono.ttf"))
            {
                ThemeResolutionService.LoadFont(stream);
            }
            this.radSyntaxEditor1.SyntaxEditorElement.EditorFontFamily = new Telerik.WinControls.SyntaxEditor.UI.FontFamily("Comic Mono");
            this.radSyntaxEditor1.SyntaxEditorElement.EditorFontSize = 13;

Hi Dess,

Thanks for that. I can confirm the same behavior happens for me. Everything works fine if the font is installed, interesting.

Is there a work-around so the font isn't required to be installed on the target machine?

Regards

Hi Dinko,

What is the approach by Desislava?

I am sorry for the misunderstanding. What I was trying to say is to as Desislava mentioned in her post, you need to install the custom font first. Otherwise, the font won't be visualized correctly in the control.

If you have any other questions regarding our controls, please feel free to open a new thread with your questions inside, and will be happy to help.