I’m really pleased to announce a new free and open source control for Xojo called SyntaxArea.
SyntaxArea is a fast, customisable, Canvas-based source code editor written in 100% API 2.0 Xojo code with no proprietary plugin requirements.
For those that know me, you may realise that this is the second open source code editor I’ve released (the other being XUICodeEditor). What differentiates SyntaxArea from XUICodeEditor is that it’s faster, much simpler to define new language definitions and is more robust.
The code is heavily based on / ported from Alex Restrepo’s CustomEditField (CEF) control that is currently under the stewardship of Thomas Tempelmann. CEF is API 1.0 only and has a number of outstanding bugs. This is a complete rewrite with standardisation / documentation of the source code and complete migration to API 2.0.
Here are a few of the features of SyntaxArea (improvements over CEF are in bold):
Cross platform (macOS and Windows tested)
API 2.0
Based on TextInputCanvas so it has full support for internationalisation and proper keyboard commands including emoji insertion
Native scrollbars on macOS
Syntax highlighting with easy to define regex-based syntax definitions
Support for autocompletion
Undo/redo engine
Powerful theming engine for robust light/dark mode support
Fast (handles 100s or 1000s lines of Xojo code for example)
Optional block / line folding
Vertical ruler support (with a definable column width)
Symbol support to allow easy navigation within a source code document
The control is MIT licensed so you’re free to use it how you see fit.
You can see how to use it by checking out the repo home page, looking at the wiki or trying the demo.
Pull requests are very welcome.
Requirements
As detailed on the repo home page, you’ll need to put the open source TextInputCanvas plugin in Xojo’s plugins folder and restart the Xojo IDE for the control to work.
Future plans
I have significantly refactored the control from CEF to allow future support of the control on mobile (iOS at first). This is something I am currently actively working on and has been made possible due to recently added support for the keyboard in the iOS canvas control in the latest version of Xojo.
The only issue for me, and it’s not a big one, is the time it takes to syntax-color 20,000 lines of Xojoscript code (c. 10 seconds). OK, I’m comparing it to MBS’s Scintilla plugin which is pretty much instantaneous (but requires a lot of extra code shenanigans in order to make it as usable as your solution). I would certainly use your solution in any new project, since it is otherwise superior to Scintilla (and editing 20,000 lines of code is not something I do often).
I suspect one way that it could be sped up would be to replace the Xojo RegEx class in the syntax highlighting engine with the RegEx engine from MBS (since it’s much faster). Unfortunately that’s not an option if I want to keep the control open source.
I’m pleased to announce version 1.1 of SyntaxArea.
New
Added definition extension support. Syntax definitions can now import other definitions into their own contexts. This permits functionality like syntax highlighting within Markdown code fences and inline PHP / Javascript in HTML documents.
Added Markdown definition.
Added PHP definition.
Added Javascript definition.
Xojo definition can now highlight URLs within comments.
Can now specify the case-sensitivity of matches a the highlight context level. Previously this could only be specified at the context level.
The demo app can now export the current editor styles as a theme.
The key combination Cmd-Return on macOS and Alt-Return on Windows allows the host app to offer code completion to the editor. This allows you to do things like complete an if...end if block for example.
Fixed
The editor now correctly updates all styles when loading a theme.
Tokens with a background colour now actually display a background colour.
The background colour of whitespace now correctly inherits its enclosing text’s background colour.
This is an awesome amount of work @GarryPettet and it looks great!
I’m considering implementing SyntaxArea. It looks pretty feature complete, but I have one question:
How to perform a word search?
I looked through the API and I can see how to replace a word (once I have the position of the word), but how to find a specific word in the first place?
Forgive me if I’m blind.
Thank you for contributing so much to the community!
Thanks for the kind words - it sure has been a labour of love
There isn’t a specific find API for the contents of the editor (yet). You’d have to grab the contents of the editor with Editor.Text, use Xojo’s native String searching methods (e.g. RegEx or IndexOf) and then set the text again.
Sorry for the delay @Scott_C, I’m currently without much internet on holiday in a forrest.
I’ll put some thought into the best way to engineer an API for find and replace. I’m currently working on an app that will use SyntaxArea so it will benefit me. I’ve opened an issue on GitHub if you’d like to track it.
Probably iterating over the LineManager would be a bad idea because of how line endings are managed…
@Scott_C: If you check out the latest commit on the finding branch I’ve implemented a SyntaxArea.Editor.Find() method. Check it out to see if it works for you. I’ve not yet done a Replace() equivalent but, like I said, I’m currently on holiday so time is a little short.
No need to apologize @GarryPettet, you’re on holiday and I’m not in a big hurry. I’ve got lots to keep me busy before I tackle fully wiring up the Editor, and I don’t move as fast as I used to. It’s just nice to know that feature will be there.
I like that you added an option for highlighting the found word
I’ll get back to you with some feedback as soon as I can. I should probably start a new thread, because I think I hijacked this one. Sorry about that
