Building a text editor part 2
Adding highlighting and more...
This part of the tutorial uses our basic program from part one to make an editor
that supports syntax highlighting and other features such as the ability to hide
Toolbars and menu's when they aren't needed...
You will need:
The program from last time
Everything you needed for the last tutorial.
Adding syntax highlighting:
As you should know... different languages have different syntax...
A bit like how human languages loook and sound different...
Something written in... say... C++ will look different to domething done BASIC...
Syntax highlighting works by locating keywords in your text as you type...
If I typed memo1.lines.add('text here'); the highlighter would highlight it using
A certain color from which, I could tell if I messed up, what it is (Variable, object etc)
Or if it's not code at all the highlighter shouldn't highlight it at all... (That text
Wouldn't be highlighted by a HTML highlighter but it might be by a PASCAL one)
The more highlighters you include, the bigger your program will need to be to house
The files for the highlighters and the files used by them.
To add highlighters the easy way you can just change the Memo1 to a synmemo component.
To make the synmemo work you will have to change your code so that memo1 is synmemo1.
There are other highlighter packages around but synedit is free and has no nag
screens and you can add your own highlighters without writing masses of code...
You now need to add the highlighters you want to your program (NETcoder, which this
tutorial is working towards mainly uses Internet highlighters like PHP and SQL)
Once you have inserted your highlighters your going to need some way to switch between them...
I chose a simple menu system similar to the file or edit dropdowns...
First though, we need to add some more events to our eventlist1 component...
add a category called syntax or highlighters and add an action for each of your highlighters
(If you have 5 highlighters make 5 actions...)
If action one is for HTML then change it's properties (Caption = HTML) and double
Click it...
In the code editor put this under Begin:
synmemo1.Highlighter := synhtmlsyn1;
This set's synmemo1's highlighter property to synhtmlsyn1...
Do the same for all the other highlighters (Give the action a recognisable name and
Add that code but with the name of the highlighter instead of synhtmlsyn1)
To add the syntax dropdown to the menu bar simply open the MainMenu1 editor and add
A new category called syntax and start adding your new actions to it...
I have also added a button to the toolbar that, when clicked, shows a menu containing
A list of all your highlighters...
To do this just add a button to your toolbar and add a popup menu with all your
Highlighter actions on it and set the button's dropdownmenu property to the name
Of your popup menu...
You can change the colors that the highlighters use in the object inspector but
we don't need to so leave them as they are...
Save and run your program to see what you have... (It should allow you to pick a
Highlighter and when you put code in it should highlight it...)
Making it possible for the end user (person using your editor) to show and
hide toolbars, windows or anything else with a single button click:
This is laughably simple to do and it requires no new actions and very little code...
Simply select the object you wish to use this trick on (the second toolbar in NETcoder...)
Set it's visible property to FALSE (skip that if you want it visible upon starting
The editor) to make it invisible when the editor starts...
Add a button which the user presses to show or hide it and add:
If(toolbar2.Visible) then
toolbar2.Hide
Else
toolbar2.Show;
To it's code (if you can see toolbar2 then hide it otherwise make it visible).
Replace toolbar2 with the name of whatever your doing this to or it won't work...
Save and run to see if it worked...
Adding a link to your homepage:
This is simple to do and it lets your usesrs go directly to your website...
Simply add a browseurl action to your actionlist (found under Internet)...
Set it's caption and add your URL (http://www.something.com) to the URL property.
Then you just add it to the menu bar (best put in File, Help or Internet).
Now, when a user clicks on the browseurl button (Or whatever you called it) their
browser SHOULD open and load your site...
Adding a browser like toolbar:
This will tell you how to add a toolbar in which you can type an URL and launch
Your browser with that URL loaded (http://www.tutorial.net would launch a browser
Showing tutorial.net...).
You will need to add another browseURL and another toolbar...
Add an edit box to the new toolbar and then add a button...
Modify their properties (Adding a spacer between the two would look better).
Put this code in under begin in the buttons code:
Browseurl2.url := edit2.Text;
Browseurl2.Execute;
Which basically translates into:
When I click this button browseurl2's url property will be whatever was in edit2
and then a browser window will be opened with whatever was in edit2 in it...
Changing the color of synmemo using a colorbox component:
Add a colorbox component to one of your toolbars and change it's properties...
Doulbe click it to go to it's code and type this under begin:
synmemo1.Color := colorbox1.Selected;
This changes the color of synmemo1 to match that of colorbox1 when colorbox1 is
Changed (Notice how you put this under the colorbox1change procedure).
Changing the project settings for your program:
Go to options in the project menu and click application...
From this page you can edit title (it apears in the task bar), helpfile location and
Icon... (Make sure you use a .ico file... :])
Click the version info tab to edit the version information that apears in the
PROPERTIES section when users right click on your .exe file...
You should be able to compile your program into an .exe file that will run on PC's that don't have the IDE...
So far in this tutorial series you (should) have learned:
What a form is and what it does...
How to add components to a form...
The basics of writing event handlers that tie your components together...
How to build a GUI (Graphical User Interface) visually and add a working menu system.
How to use synedit components...
How to modify components and code from an existing program to make a new one (Like making a framework)
How to add removable objects using Show and Hide commands...
The basics of using BrowseURL actions...
And other small tricks...
|
