summaryrefslogtreecommitdiff
path: root/fluid/documentation/src/page_interactive.dox
blob: 58f46b13081b901481acb6ba5ac7a6ce8d7ac2f3 (plain)
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

*/