at the moment I'm trying to get into Windows Store App Development and I'm stuck at some point.
I want to implement sort of a "markdown language" like the one on stackoverflow to highlight certain parts of text input.
Besides that I want to give the user the ability to use different font colors on his text.
The RichEditBox seems to be the ideal control for this task, but I don't know how to detect markup entering on the fly.
For example when the user enters **Test** the text should be transformed to Test immediately.
I have tried to approach this by listening to the "TextChanged" event and looking if the user enters **. If this is the case and if he entered the sequence ** already one time before, then I'm setting the character format of the text range from the end of the first annotation sequence (start marker) to the beginning of the second (close marker) annotation to bold.
But this solutions seems to be very quick and dirty.
My second thought was to use the WebView control to render the text after preprocessing it with "Markdown Sharp".
But then the user won't be able to edit text.
So I need to get some advice or tip on approaching this problem. I also looked into writing a custom RichEditBox control, but I have no experience in custom control development and there aren't that many resources on the web for Windows 8 development for now.
Thanks in advance.
As I see it, your problem is that you want to edit the "source" based on Markdown syntax AND show the formatted result in the same place. How would you revert Test to regular, as long as the asterisks are gone? If the answer is "using a button" then why not use the button to make it bold in first place?
However, you could do a hybrid thing: apply formatting in the source text, while maintaining the Markdown markup (not sure if this is entirely doable for all Markdown tricks, though). That is, **Test** would look in the source like **Test**. For the final, formatted result you would use a separate view, such as RichTextBlock.
In order to do the hybrid formatting, an option would be to have a background thread matching regularly the whole text against regular expressions specific to the Markdown syntax. For each match the corresponding text range would then be formatted accordingly.
Related
I want to create a simple editor like Notepad++ with simple functionality... I need to color a specific word in the rich text box area. How can I do that?
For example: when the user write these word, I want to color them to the blue color. These words are: for, while, if, try, etc.
How can I make the richtextbox to select a specific word and then color them?
And, if I want to make a comment and color everything after the //, how is that done in the richtextbox?
How do I number the line in the text box, so I can now the line number when I'm coding in my editor?
Here's some code you can build on in order to achieve the functionality you want.
private void ColourRrbText(RichTextBox rtb)
{
Regex regExp = new Regex("\b(For|Next|If|Then)\b");
foreach (Match match in regExp.Matches(rtb.Text))
{
rtb.Select(match.Index, match.Length);
rtb.SelectionColor = Color.Blue;
}
}
The CodeProject article Enabling syntax highlighting in a RichTextBox shows how to use RegEx in a RichTextBox to perform syntax highlighting. Specifically, look at the SyntaxRichtTextBox.cs for the implementation.
In general, you have to work on the selection in RichTextBox. You can manipulate the current selection using the Find method or using SelectionStart and SelectionLength properties. Then you can change properties of selected text using SelectionXXX properties. For example, SelectionColor would set the color of current selection, etc. So you have to parse text in richtextbox and then select part of texts and change their properties as per your requirements.
Writing a good text editor using RichTextBox can be quite cumbersome. You should use some library such as Scintilla for that. Have a look at ScintillaNet, a .NET wrapper over Scintilla.
Did you know that Notepad++ uses Scintilla?
You actually do not have to reinvent the wheel by going through all the trouble as there is a .NET port of Scintilla named ScintillaNET which you can freely embed in your application as the source code editor :)
But to answer your question, there are few parts that you need to understand
Finding what to color
When to color
How to color
For the first part, there may be different approaches, but I think using regular expressions would be a good choice. I am sorry, but I don't know regular expressions much so I cannot help you in that case.
When to color is very crucial and if you do it wrong, your application will suffer a heavy performance penalty. I suggest you refer to XPath Visualizer which was done by our own Stack Overflow member, Cheeso. Take a look at the source on how the coloring of the syntax was done. But if you ScintillaNET, everything would be taken care of. Anyway, I really can't seem to find this documentation where he clearly showed how the coloring of the text was done. I would most definitely post it here if I find it.
The third question I think is covered by VinayC. But basically you use SelectionColor along with SelectionStart.
here is a good link on c-sharpcorner.com website on basic richtextbox syntax highlighting. I assume that you and any one visiting this page for similar problem want to do it for learning purpose. But if any one wants to do it for some making some comercial level IDE then it must use scintilla or some similar.
An other approach for this is to directly change the RTF of the richtextbox. Look in codeproject.com there are lot of articles similar to this problem.
I had some problems with that and here is my solution, beats me why it has to be done like this, but it works:
// position on end of control...
richTextBox.UpdateLayout();
richTextBox.ScrollToEnd();
richTextBox.UpdateLayout();
// ...then select text and it will be position on top of control.
richTextBox.Focus();
richTextBox.Selection.Select(foundRange.Start, foundRange.End);
richTextBox.BringIntoView();
Vb.net implementation
Imports System.Text.RegularExpressions
Private Sub formatString()
Dim rg =New Regex("\b(for|while|if|try)\b")
Dim m As Match
For Each m In rg.Matches(RichTextBox1.Text)
RichTextBox1.Select(m.Index,m.Length)
RichTextBox1.SelectionColor=Color.Green
Next
End Sub
I would like to design one xml text editor which is based on normal text-box which implements all XML characteristics(i.e., it should implement intelligence to differentiate the text colors by node_name,attribute_name,attribute_value and it should check proper closing the tag).
Can any one give me the idea how I could process the each and every character entered by the user(normally we can call the TextBox1_TextChanged event after fully entered the text in text-box but I need to call this event each and every character entry)? I am good in C#, so that I have decided to transform the control to coding page because I already did one editor using console application which read the input character from the user and change the text color.
I might be wrong to approach this problem like this way so, give your suggestions, valuable reference links and ideas to accomplish this editor.
If you know any plugins to do this task please inform me
Thanks in Advance.
Regards,
--SJ
Use a Rich Text Box and handle the KeyDown event for character processing.
Rich Text Box will allow you to do syntax highlighting, text formatting, etc.
I would also validate entered xml for correctness and possibly highlight incorrect syntax to the user if validation fails.
All this is going to required effort, i am not aware of any QUICK solution. But using the basics i've suggested here, you could achieve what you require if you put in the effort.
The EditArea appears to have the features (and more) that you are looking for.
You could also check the list of Javascript base source code editors
I need to store significant amounts of rich text in a SQL database, retrieve it and display it.
One font throughout is OK but I need different font sizes/bold/colors.
For now I am using a RichTextBox (WPF) to display it, and XamlWriter.Save/XamlReader.Parse to serialize it to strings to store in the DB. It works well but the RichTextBox is so HUGELY SLOW at displaying the text that it's basically unusable.
Is there a quick way to do this with acceptable performance?
I'm considering doing it with GlyphRun objects, drawing each character as a bitmap and computing all the alignment requirements to fit the destination image etc... But reinventing the wheel on simple colored/sizable text seems really strange in 2011.
EDIT:
Thanks for the answers, didn't see them until now, sorry.
Text is entered by the user from RichTextBoxes as well, basically I just save the resulting string XamlWriter.Save(richTextBox.Document) in the database. Other fields (double/int etc) are also entered by the user from TextBoxes.
As the user queries the database, pages of read-only rich text with colors and formatting is generated from scratch using the fields in the database, including the saved rich text fields above: these are converted from FlowDocuments to Spans and some replacement is done on them (InlineUIContainers which host a class derived from UIElement which references a database entry, inlined in the text, like "see [thisbook]" where [thisbook] references some database entry's ID). MSDN says all that is far too much text for a TextBlock.
That text rendering is the really slow part but there is no way around it, I need that formatting and it's just how the WPF RichTextBoxes are: even when entering a little simple text in the RichTextBoxes, there is a delay between typing and the character appearing on the screen...
For now I still use RichTextBoxes but I keep lots of rendered layouts in memory (the Paragraph/Section/Span objects) and I am careful to rerender only the least amount of formatted text possible when changes/queries are made or different views of the database data are requested by the user.
It's still not fast but it's OK, changing the whole structure (AvalonEdit or FormattedText or GlyphRun) doesn't seem worth it right now, too much work, the whole serialization API with XamlWriter.Save and XamlReader.Parse simplifies much (for FormattedText and GlyphRun, I'd have to come up with a file format myself to save the formatted text to the database).
There is also the possibility of using the OpenXML SDK to create Microsoft Word .docx documents but google says rendering performance isn't great either, and I don't know if embedding an UIElement in the text within an InlineUIContainer and serializing that to be saved in the database would be possible (same problem with AvalonEdit).
Consider throwing away RichTextBox because it is so HUGELY SLOW (spot on). Instead of writing your own text editor check AvalonEdit. Performance wise it beats RichTextBox like a baby.
Or if you need read-only text you could try a TextBlock - it supports simple formatting:
<TextBlock>
<Run FontWeight="Bold">Hello</Run>
<Run Foreground="Green">World</Run>
<Run FontSize="24">!</Run>
</TextBlock>
I want to create a simple editor like Notepad++ with simple functionality... I need to color a specific word in the rich text box area. How can I do that?
For example: when the user write these word, I want to color them to the blue color. These words are: for, while, if, try, etc.
How can I make the richtextbox to select a specific word and then color them?
And, if I want to make a comment and color everything after the //, how is that done in the richtextbox?
How do I number the line in the text box, so I can now the line number when I'm coding in my editor?
Here's some code you can build on in order to achieve the functionality you want.
private void ColourRrbText(RichTextBox rtb)
{
Regex regExp = new Regex("\b(For|Next|If|Then)\b");
foreach (Match match in regExp.Matches(rtb.Text))
{
rtb.Select(match.Index, match.Length);
rtb.SelectionColor = Color.Blue;
}
}
The CodeProject article Enabling syntax highlighting in a RichTextBox shows how to use RegEx in a RichTextBox to perform syntax highlighting. Specifically, look at the SyntaxRichtTextBox.cs for the implementation.
In general, you have to work on the selection in RichTextBox. You can manipulate the current selection using the Find method or using SelectionStart and SelectionLength properties. Then you can change properties of selected text using SelectionXXX properties. For example, SelectionColor would set the color of current selection, etc. So you have to parse text in richtextbox and then select part of texts and change their properties as per your requirements.
Writing a good text editor using RichTextBox can be quite cumbersome. You should use some library such as Scintilla for that. Have a look at ScintillaNet, a .NET wrapper over Scintilla.
Did you know that Notepad++ uses Scintilla?
You actually do not have to reinvent the wheel by going through all the trouble as there is a .NET port of Scintilla named ScintillaNET which you can freely embed in your application as the source code editor :)
But to answer your question, there are few parts that you need to understand
Finding what to color
When to color
How to color
For the first part, there may be different approaches, but I think using regular expressions would be a good choice. I am sorry, but I don't know regular expressions much so I cannot help you in that case.
When to color is very crucial and if you do it wrong, your application will suffer a heavy performance penalty. I suggest you refer to XPath Visualizer which was done by our own Stack Overflow member, Cheeso. Take a look at the source on how the coloring of the syntax was done. But if you ScintillaNET, everything would be taken care of. Anyway, I really can't seem to find this documentation where he clearly showed how the coloring of the text was done. I would most definitely post it here if I find it.
The third question I think is covered by VinayC. But basically you use SelectionColor along with SelectionStart.
here is a good link on c-sharpcorner.com website on basic richtextbox syntax highlighting. I assume that you and any one visiting this page for similar problem want to do it for learning purpose. But if any one wants to do it for some making some comercial level IDE then it must use scintilla or some similar.
An other approach for this is to directly change the RTF of the richtextbox. Look in codeproject.com there are lot of articles similar to this problem.
I had some problems with that and here is my solution, beats me why it has to be done like this, but it works:
// position on end of control...
richTextBox.UpdateLayout();
richTextBox.ScrollToEnd();
richTextBox.UpdateLayout();
// ...then select text and it will be position on top of control.
richTextBox.Focus();
richTextBox.Selection.Select(foundRange.Start, foundRange.End);
richTextBox.BringIntoView();
Vb.net implementation
Imports System.Text.RegularExpressions
Private Sub formatString()
Dim rg =New Regex("\b(for|while|if|try)\b")
Dim m As Match
For Each m In rg.Matches(RichTextBox1.Text)
RichTextBox1.Select(m.Index,m.Length)
RichTextBox1.SelectionColor=Color.Green
Next
End Sub
I want my users to be able to enter text in a Rich Text box and the RTF output be saved to the database.
Currently I have the RichTextBox bound to the field in the database, but it strips formatting when it's saved. How can I prevent this?
Also, how can I attach a formatting toolbox, (like what's in Wordpad) so my users can change the formatting?
And, last, I can't right click in the box or use Ctrl+C, Ctrl+V or anything like that, why is that? How can I fix it?
Ok, there are alot of questions there, I'll try to answer what I can.
1) Databinding is great for displaying data, but I personally NEVER use DataBinding for saving stuff back to the database. I've always found it to be "too much magic happening" and that I needed more control. Therefore, I would strongly suggest that you handle the insertion yourself (via LINQ to Sql or ADO.Net whatever). The RichTextBox control has an RTF property which you can get to do the insert manually into the database.
2) As for getting formatting buttons on top, it's not as simple as changing a property and be done with it. You'll have to implement that custom control yourself. Have a look at this CodeProject article. IT's in VB.NET, but maybe it'll give you some ideas: http://www.vbdotnetheaven.com/UploadFile/scottlysle/WordProcessor09122006234320PM/WordProcessor.aspx
3) Not quite sure...
For number 3, isn't there a property on the RichTextBox that enables the Context menu? I might've seen this on a different control but maybe it also has that property.