The FLTK implementation will follow the base benchmark structure.
In order to build the wanted interface as specified in the mockup we need the fltk toolkit, a window, input boxes to insert text, a button to trigger the insertion of notes and a list to display the result of the notes searching. Here we have the needed imports for that.
In FLTK the browser is the list and we will use the box for the labels.
FLTK allows us to import only the widgets we really use.
#include <FL/Fl.H> #include <FL/Fl_Window.H> #include <FL/Fl_Input.H> #include <FL/Fl_Button.H> #include <FL/Fl_Box.H> #include <FL/Fl_Hold_Browser.H>
Added to in section 3:1
Redefined in section 5:1
To have a consistent interface we will use the fixed values for side margin, row spacing and for the widgets height.
#define SIDE_MARGIN 15 #define ROW_SPACE 10 #define WIDGET_HEIGHT 25
Added to in section 2:3
Redefined in section 5:1
We start by setting the window configuration and triggering the building of the main interface.
Fl_Window *window = new Fl_Window(WIDTH, HEIGHT, TITLE); build_window(); window->end(); window->show(argc, argv); status = Fl::run();
To construct the interface we will build two main areas, the insert area where we input new notes to the rememberfile and the search area where we search and filter notes in the same file.
By having this events we will need some logic to handle the notes submition and the notes search, which will go in the callbacks.
{Insert Button Callback, 1} {Search Changed Callback, 1} void build_window(){ {Build Insert Area, 1} {Build Search Area, 1} }
Used in section 2:3
In the insert area we want a label at the top, then an input text field to insert notes and a button to insert the note after writing it.
// Top Label int y_row = ROW_SPACE; new Fl_Box(WIDTH / 3, y_row, WIDTH / 3, WIDGET_HEIGHT, "Create New"); // Insert Text y_row += WIDGET_HEIGHT; int input_w = WIDTH / 4 * 2.5; input = new Fl_Input(SIDE_MARGIN, y_row, input_w, WIDGET_HEIGHT, ""); // Insert Button int button_w = WIDTH - (SIDE_MARGIN * 3 + input_w); Fl_Button * button = new Fl_Button( SIDE_MARGIN * 2 + input_w, y_row, button_w, WIDGET_HEIGHT, "Insert" ); button->callback(insert_note);
The search area we want a label at the the, an input text field to search the notes and a list which will update when changes are made in the text field. The list starts filled with all the notes so we can start searching.
To tell the list to trigger an event when a change occurs when pass the FL_WHEN_CHANGED flag to the search input.
// Search Label
y_row += WIDGET_HEIGHT + ROW_SPACE / 2;
new Fl_Box(WIDTH / 3, y_row, WIDTH / 3, WIDGET_HEIGHT, "Search");
// Search Input text
y_row += WIDGET_HEIGHT;
search_input = new Fl_Input(WIDTH / 4, y_row, WIDTH / 4 * 2, WIDGET_HEIGHT, "");
search_input->when(FL_WHEN_CHANGED);
search_input->callback(search_change);
// Search results list
y_row += WIDGET_HEIGHT + ROW_SPACE;
list = new Fl_Hold_Browser (
SIDE_MARGIN,
y_row,
WIDTH - SIDE_MARGIN * 2,
HEIGHT - y_row - ROW_SPACE,
""
);
char text[NOTE_SIZE] = "";
{Search Notes, 2:3}
When the insert button is pressed we want to read the data from the input field and insert it as a note in the remember file. If no data is in the field we can ignore the submition. After inserting the data we will clear the input field for new notes.
void insert_note(Fl_Widget * w, void * data){
if(input->size() > 0){
char text[NOTE_SIZE] = "";
strncpy(text, input->value(), NOTE_SIZE);
{Insert Note, 2:3}
if(result == 0){
input->value("", 0);
}
}
}
Used in section 3:1
Since we will need to get the text in the input text field from the button callback we make it global.
When the text in the search input field changes we clear the notes list and refresh it with data searched using the received text and fill the list with the results.
void search_change(Fl_Widget * w, void * data){
char text[NOTE_SIZE] = "";
strncpy(text, search_input->value(), NOTE_SIZE);
// Clear current entries
list->clear();
{Search Notes, 2:3}
}
Used in section 3:1
To be able to access the search field and the results list from the search callback we will make the search input and the results list global.
For each item obtained as a result from the search in the .remember file we will add it to the results list.
To compile this program we need ftlk1.3.5 libraries installed, and then we can use the fltk-config.
all: gcc `fltk-config --compile main.cpp` clean: rm -f main
RAM Usage - 9.84MB
Implementation Dificulty - The drawing of elements in the interface was really easy to start since it uses a simple approach of drawing in specific positions. The management of rows and margins needed manual calculations which would make the application harder to scale or resize if needed. The documentation has all the widgets well documented and they cover most use cases.
Supported Platforms - GNU/Linux, Unix, Windows, macOS, AmigaOS 4