1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
/**
\page page_interactive Interactive Mode
\tableofcontents
<!-- ---------------------------------------------------------------------- -->
In interactive mode, FLUID allows users to construct and modify their GUI
design by organizing widgets hierarchically through drag-and-drop actions.
The project windows provide a live preview of the final UI layout.
Most widget attributes can be adjusted in detail using the
\ref page_widget_panel.
Users can also incorporate C++ coding elements such as functions, code blocks,
and classes. FLUID supports the integration of external sources, for
example images, text, or binary data, by embedding them directly into the
generated source code.
\image html fluid_gui_overview_800.png
\image latex fluid_gui_overview_800.png "FLUID Overview"
A typical FLUID session manages the widget hierarchy in the main application
window on the left. The project file name is shown in the title bar. In the
example above, we edit the FLTK _Preferences_ example file
`test/preferences.fl`.
\see \ref page_main_window
The layout editor window left of center, titled
"My Preferences" shows the GUI design as it will be generated by the C++
source file. The widgets "shower", "shave", and "brush teeth" are shown
in their selected state and can now be resized or moved by grabbing any of
the red boxes around the selection frame.
\see \ref page_edit_window
To the right, we have the "Widget Properties" panel. We can use this to
edit many more parameters of the selected widget. If multiple widgets are
selected, changes are applied to all of them where appropriate.
\see \ref page_widget_panel
The Widget Bin at the top is an optional tool bar (__Edit > Show Widget Bin__,
Alt-B). It gives quick access to all widget and code types. Widgets can
be added by clicking onto the tool, or by dragging them out of the tool box
into the layout editor.
\see \ref page_widgetbin_panel
The optional panel on the right shows a live source code preview. This is
very helpful for verifying how changes in the GUI will be reflected in the
generated C++ code (__Edit > Show Code View__, Alt-C).
\see \ref page_codeview_panel
*/
|