summaryrefslogtreecommitdiff
path: root/fluid/documentation/src/page_interactive.dox
diff options
context:
space:
mode:
authorMatthias Melcher <github@matthiasm.com>2024-04-17 17:51:32 +0200
committerGitHub <noreply@github.com>2024-04-17 17:51:32 +0200
commitfd791a068e39e06785adc44693f4c533d3d6c903 (patch)
treeef7ff684b38f646165e80c142e454cd7ef077e2e /fluid/documentation/src/page_interactive.dox
parentb4cf1a9824f2c4ba9596044962d3af36e3ca3d99 (diff)
Separate FLUID user documentation, screen shot automation (#936)
* CMake integration, no autotiools * alignment panel is now correctly renamed to setting panel * source view is now correctly renamed to code view * Merge FLTK FLUID docs into FLUID user manual. * Add two simple entry tutorials * Remove FLUID chapter form FLTK docs. * GitHub action to generate HTML and PDF docs and make the available as artefacts
Diffstat (limited to 'fluid/documentation/src/page_interactive.dox')
-rw-r--r--fluid/documentation/src/page_interactive.dox57
1 files changed, 57 insertions, 0 deletions
diff --git a/fluid/documentation/src/page_interactive.dox b/fluid/documentation/src/page_interactive.dox
new file mode 100644
index 000000000..58f46b130
--- /dev/null
+++ b/fluid/documentation/src/page_interactive.dox
@@ -0,0 +1,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
+
+*/