mirror of
https://github.com/fltk/fltk.git
synced 2026-06-07 09:13:58 +08:00
converted html tags to doxygen commands in documentation/src/editor.dox
git-svn-id: file:///fltk/svn/fltk/branches/branch-1.3@6697 ea41ed52-d2ee-0310-a9c1-e6b18d33e121
This commit is contained in:
@@ -24,7 +24,7 @@ lets define what we want our text editor to do:
|
||||
|
||||
Now that we've outlined the goals for our editor, we can begin with
|
||||
the design of our GUI. Obviously the first thing that we need is a
|
||||
window, which we'll place inside a class called <tt>EditorWindow</tt>:
|
||||
window, which we'll place inside a class called \p EditorWindow:
|
||||
|
||||
\code
|
||||
class EditorWindow : public Fl_Double_Window {
|
||||
@@ -54,15 +54,14 @@ char filename[256] = "";
|
||||
Fl_Text_Buffer *textbuf;
|
||||
\endcode
|
||||
|
||||
The <tt>textbuf</tt> variable is the text editor buffer for
|
||||
The \p textbuf variable is the text editor buffer for
|
||||
our window class described previously. We'll cover the other
|
||||
variables as we build the application.
|
||||
|
||||
\section editor_menubars Menubars and Menus
|
||||
|
||||
The first goal requires us to use a menubar and menus that
|
||||
define each function the editor needs to perform. The
|
||||
<A href="Fl_Menu_Item.html"><tt>Fl_Menu_Item</tt></A>
|
||||
define each function the editor needs to perform. The Fl_Menu_Item
|
||||
structure is used to define the menus and items in a menubar:
|
||||
|
||||
\code
|
||||
@@ -98,7 +97,7 @@ Fl_Menu_Item menuitems[] = {
|
||||
\endcode
|
||||
|
||||
Once we have the menus defined we can create the
|
||||
<tt>Fl_Menu_Bar</tt> widget and assign the menus to it with:
|
||||
Fl_Menu_Bar widget and assign the menus to it with:
|
||||
|
||||
\code
|
||||
Fl_Menu_Bar *m = new Fl_Menu_Bar(0, 0, 640, 30);
|
||||
@@ -110,8 +109,7 @@ We'll define the callback functions later.
|
||||
\section editor_editing Editing the Text
|
||||
|
||||
To keep things simple our text editor will use the
|
||||
<A HREF="Fl_Text_Editor.html"><tt>Fl_Text_Editor</tt></A>
|
||||
widget to edit the text:
|
||||
Fl_Text_Editor widget to edit the text:
|
||||
|
||||
\code
|
||||
w->editor = new Fl_Text_Editor(0, 30, 640, 370);
|
||||
@@ -126,7 +124,7 @@ textbuf->add_modify_callback(changed_cb, w);
|
||||
textbuf->call_modify_callbacks();
|
||||
\endcode
|
||||
|
||||
Finally, we want to use a mono-spaced font like <tt>FL_COURIER</tt>:
|
||||
Finally, we want to use a mono-spaced font like FL_COURIER:
|
||||
|
||||
\code
|
||||
w->editor->textfont(FL_COURIER);
|
||||
@@ -140,13 +138,14 @@ custom window. To keep things simple we will have a
|
||||
"find" string, a "replace" string, and
|
||||
"replace all", "replace next", and
|
||||
"cancel" buttons. The strings are just
|
||||
<tt>Fl_Input</tt> widgets, the "replace all" and
|
||||
"cancel" buttons are <tt>Fl_Button</tt> widgets, and
|
||||
Fl_Input widgets, the "replace all" and
|
||||
"cancel" buttons are Fl_Button widgets, and
|
||||
the "replace next " button is a
|
||||
<tt>Fl_Return_Button</tt> widget:
|
||||
Fl_Return_Button widget:
|
||||
|
||||
\image html editor-replace.gif "Figure 4-1: The search and replace dialog"
|
||||
\image latex editor-replace.eps "The search and replace dialog" width=10cm
|
||||
|
||||
\code
|
||||
Fl_Window *replace_dlg = new Fl_Window(300, 105, "Replace");
|
||||
Fl_Input *replace_find = new Fl_Input(70, 10, 200, 25, "Find:");
|
||||
@@ -164,7 +163,7 @@ need to define our callback functions.
|
||||
\subsection editor_changed_cb changed_cb()
|
||||
|
||||
This function will be called whenever the user changes any text in the
|
||||
<tt>editor</tt> widget:
|
||||
\p editor widget:
|
||||
|
||||
\code
|
||||
void changed_cb(int, int nInserted, int nDeleted,int, const char*, void* v) {
|
||||
@@ -175,15 +174,14 @@ void changed_cb(int, int nInserted, int nDeleted,int, const char*, void* v) {
|
||||
}
|
||||
\endcode
|
||||
|
||||
The <tt>set_title()</tt> function is one that we will write to set
|
||||
The \p set_title() function is one that we will write to set
|
||||
the changed status on the current file. We're doing it this way
|
||||
because we want to show the changed status in the window's
|
||||
title bar.
|
||||
|
||||
\subsection editor_copy_cb copy_cb()
|
||||
|
||||
This callback function will call
|
||||
<A href="Fl_Text_Editor.html#Fl_Text_Editor.kf_copy"><tt>kf_copy()</tt></A>
|
||||
This callback function will call Fl_Text_Editor::kf_copy()
|
||||
to copy the currently selected text to the clipboard:
|
||||
|
||||
\code
|
||||
@@ -195,8 +193,7 @@ void copy_cb(Fl_Widget*, void* v) {
|
||||
|
||||
\subsection editor_cut_cb cut_cb()
|
||||
|
||||
This callback function will call
|
||||
<A href="Fl_Text_Editor.html#Fl_Text_Editor.kf_cut"><tt>kf_cut()</tt></A>
|
||||
This callback function will call Fl_Text_Editor::kf_cut()
|
||||
to cut the currently selected text to the clipboard:
|
||||
|
||||
\code
|
||||
@@ -208,9 +205,7 @@ void cut_cb(Fl_Widget*, void* v) {
|
||||
|
||||
\subsection editor_delete_cb delete_cb()
|
||||
|
||||
This callback function will call
|
||||
<A href="Fl_Text_Buffer.html#Fl_Text_Buffer.remove_selection">
|
||||
<tt>remove_selection()</tt></A>
|
||||
This callback function will call Fl_Text_Buffer::remove_selection()
|
||||
to delete the currently selected text to the clipboard:
|
||||
|
||||
\code
|
||||
@@ -222,8 +217,7 @@ void delete_cb(Fl_Widget*, void* v) {
|
||||
\subsection editor_find_cb find_cb()
|
||||
|
||||
This callback function asks for a search string using the
|
||||
<A href="functions.html#fl_input2"><tt>fl_input()</tt></A>
|
||||
convenience function and then calls the <tt>find2_cb()</tt>
|
||||
fl_input() convenience function and then calls the \c find2_cb()
|
||||
function to find the string:
|
||||
|
||||
\code
|
||||
@@ -266,14 +260,13 @@ void find2_cb(Fl_Widget* w, void* v) {
|
||||
}
|
||||
\endcode
|
||||
|
||||
If the search string cannot be found we use the
|
||||
<A href="functions.html#fl_alert"><tt>fl_alert()</tt></A>
|
||||
If the search string cannot be found we use the fl_alert()
|
||||
convenience function to display a message to that effect.
|
||||
|
||||
\subsection editor_new_cb new_cb()
|
||||
|
||||
This callback function will clear the editor widget and current
|
||||
filename. It also calls the <tt>check_save()</tt> function to give the
|
||||
filename. It also calls the \p check_save() function to give the
|
||||
user the opportunity to save the current file first as needed:
|
||||
|
||||
\code
|
||||
@@ -292,7 +285,7 @@ void new_cb(Fl_Widget*, void*) {
|
||||
|
||||
This callback function will ask the user for a filename and then load
|
||||
the specified file into the input widget and current filename. It also
|
||||
calls the <tt>check_save()</tt> function to give the user the
|
||||
calls the \p check_save() function to give the user the
|
||||
opportunity to save the current file first as needed:
|
||||
|
||||
\code
|
||||
@@ -304,12 +297,11 @@ void open_cb(Fl_Widget*, void*) {
|
||||
}
|
||||
\endcode
|
||||
|
||||
We call the <tt>load_file()</tt> function to actually load the file.
|
||||
We call the \p load_file() function to actually load the file.
|
||||
|
||||
\subsection editor_paste_cb paste_cb()
|
||||
|
||||
This callback function will call
|
||||
<A href="Fl_Text_Editor.html#Fl_Text_Editor.kf_paste"><tt>kf_paste()</tt></A>
|
||||
This callback function will call Fl_Text_Editor::kf_paste()
|
||||
to paste the clipboard at the current position:
|
||||
|
||||
\code
|
||||
@@ -452,7 +444,7 @@ void save_cb(void) {
|
||||
}
|
||||
\endcode
|
||||
|
||||
The <tt>save_file()</tt> function saves the current file to the
|
||||
The \p save_file() function saves the current file to the
|
||||
specified filename.
|
||||
|
||||
\subsection editor_saveas_cb saveas_cb()
|
||||
@@ -468,7 +460,7 @@ void saveas_cb(void) {
|
||||
}
|
||||
\endcode
|
||||
|
||||
The <tt>save_file()</tt> function saves the current file to the
|
||||
The \p save_file() function saves the current file to the
|
||||
specified filename.
|
||||
|
||||
\section editor_other_functions Other Functions
|
||||
@@ -500,7 +492,7 @@ int check_save(void) {
|
||||
|
||||
\subsection editor_load_file load_file()
|
||||
|
||||
This function loads the specified file into the <tt>textbuf</tt> class:
|
||||
This function loads the specified file into the \p textbuf variable:
|
||||
|
||||
\code
|
||||
int loading = 0;
|
||||
@@ -521,10 +513,9 @@ void load_file(char *newfile, int ipos) {
|
||||
}
|
||||
\endcode
|
||||
|
||||
When loading the file we use the
|
||||
<A href="Fl_Text_Buffer.html#Fl_Text_Buffer.loadfile"><tt>loadfile()</tt></A>
|
||||
When loading the file we use the Fl_Text_Buffer::loadfile()
|
||||
method to "replace" the text in the buffer, or the
|
||||
<A href="Fl_Text_Buffer.html#Fl_Text_Buffer.insertfile"><tt>insertfile()</tt></A>
|
||||
Fl_Text_Buffer::insertfile()
|
||||
method to insert text in the buffer from the named file.
|
||||
|
||||
\subsection editor_save_file save_file()
|
||||
@@ -544,7 +535,7 @@ void save_file(char *newfile) {
|
||||
|
||||
\subsection editor_set_title set_title()
|
||||
|
||||
This function checks the <tt>changed</tt> variable and updates the
|
||||
This function checks the \p changed variable and updates the
|
||||
window label accordingly:
|
||||
\code
|
||||
void set_title(Fl_Window* w) {
|
||||
@@ -568,8 +559,8 @@ void set_title(Fl_Window* w) {
|
||||
\section editor_main_function The main() Function
|
||||
|
||||
Once we've created all of the support functions, the only thing left
|
||||
is to tie them all together with the <tt>main()</tt> function.
|
||||
The <tt>main()</tt> function creates a new text buffer, creates a
|
||||
is to tie them all together with the \p main() function.
|
||||
The \p main() function creates a new text buffer, creates a
|
||||
new view (window) for the text, shows the window, loads the file on
|
||||
the command-line (if any), and then enters the FLTK event loop:
|
||||
|
||||
@@ -590,7 +581,7 @@ int main(int argc, char **argv) {
|
||||
\section editor_compiling Compiling the Editor
|
||||
|
||||
The complete source for our text editor can be found in the
|
||||
<tt>test/editor.cxx</tt> source file. Both the Makefile and Visual C++
|
||||
\p test/editor.cxx source file. Both the Makefile and Visual C++
|
||||
workspace include the necessary rules to build the editor. You can
|
||||
also compile it using a standard compiler with:
|
||||
|
||||
@@ -598,18 +589,16 @@ also compile it using a standard compiler with:
|
||||
CC -o editor editor.cxx -lfltk -lXext -lX11 -lm
|
||||
\endcode
|
||||
|
||||
or by using the <tt>fltk-config</tt> script with:
|
||||
or by using the \p fltk-config script with:
|
||||
|
||||
\code
|
||||
fltk-config --compile editor.cxx
|
||||
\endcode
|
||||
|
||||
As noted in
|
||||
<A href="basics.html">Chapter 1</A>,
|
||||
you may need to
|
||||
As noted in \ref basics "FLTK Basics", you may need to
|
||||
include compiler and linker options to tell them where to find the FLTK
|
||||
library. Also, the <tt>CC</tt> command may also be called <tt>gcc</tt>
|
||||
or <tt>c++</tt> on your system.
|
||||
library. Also, the \p CC command may also be called \p gcc
|
||||
or \p c++ on your system.
|
||||
|
||||
Congratulations, you've just built your own text editor!
|
||||
|
||||
@@ -619,15 +608,16 @@ The final editor window should look like the image in Figure 4-2.
|
||||
|
||||
\image html editor.gif "Figure 4-2: The completed editor window"
|
||||
\image latex editor.eps "The completed editor window" width=12cm
|
||||
|
||||
\section editor_advanced_features Advanced Features
|
||||
|
||||
Now that we've implemented the basic functionality, it is
|
||||
time to show off some of the advanced features of the
|
||||
<CODE>Fl_Text_Editor</CODE> widget.
|
||||
Fl_Text_Editor widget.
|
||||
|
||||
\subsection editor_syntax Syntax Highlighting
|
||||
|
||||
The <CODE>Fl_Text_Editor</CODE> widget supports highlighting
|
||||
The Fl_Text_Editor widget supports highlighting
|
||||
of text with different fonts, colors, and sizes. The
|
||||
implementation is based on the excellent
|
||||
<A HREF="http://www.nedit.org/">NEdit</A>
|
||||
@@ -636,8 +626,8 @@ uses a parallel "style" buffer which tracks the font, color, and
|
||||
size of the text that is drawn.
|
||||
|
||||
Styles are defined using the
|
||||
<CODE>Fl_Text_Display::Style_Table_Entry</CODE> structure
|
||||
defined in <CODE><FL/Fl_Text_Display.H></CODE>:
|
||||
Fl_Text_Display::Style_Table_Entry structure
|
||||
defined in <tt><FL/Fl_Text_Display.H></tt>:
|
||||
|
||||
\code
|
||||
struct Style_Table_Entry {
|
||||
@@ -648,10 +638,10 @@ struct Style_Table_Entry {
|
||||
};
|
||||
\endcode
|
||||
|
||||
The <CODE>color</CODE> member sets the color for the text,
|
||||
the <CODE>font</CODE> member sets the FLTK font index to use,
|
||||
and the <CODE>size</CODE> member sets the pixel size of the
|
||||
text. The <CODE>attr</CODE> member is currently not used.
|
||||
The \p color member sets the color for the text,
|
||||
the \p font member sets the FLTK font index to use,
|
||||
and the \p size member sets the pixel size of the
|
||||
text. The \p attr member is currently not used.
|
||||
|
||||
For our text editor we'll define 7 styles for plain code,
|
||||
comments, keywords, and preprocessor directives:
|
||||
@@ -672,7 +662,7 @@ You'll notice that the comments show a letter next to each
|
||||
style - each style in the style buffer is referenced using a
|
||||
character starting with the letter 'A'.
|
||||
|
||||
You call the <CODE>highlight_data()</CODE> method to associate the
|
||||
You call the highlight_data() method to associate the
|
||||
style data and buffer with the text editor widget:
|
||||
|
||||
\code
|
||||
@@ -690,7 +680,7 @@ that changes to the text buffer are mirrored in the style buffer:
|
||||
textbuf->add_modify_callback(style_update, w->editor);
|
||||
\endcode
|
||||
|
||||
The <CODE>style_update()</CODE> function, like the <CODE>change_cb()</CODE>
|
||||
The \p style_update() function, like the \p change_cb()
|
||||
function described earlier, is called whenever text is added or removed from
|
||||
the text buffer. It mirrors the changes in the style buffer and then updates
|
||||
the style data as necessary:
|
||||
@@ -775,7 +765,7 @@ style_update(int pos, // I - Position of update
|
||||
}
|
||||
\endcode
|
||||
|
||||
The <CODE>style_parse()</CODE> function scans a copy of the
|
||||
The \p style_parse() function scans a copy of the
|
||||
text in the buffer and generates the necessary style characters
|
||||
for display. It assumes that parsing begins at the start of a line:
|
||||
|
||||
|
||||
Reference in New Issue
Block a user