VDKBuilder Tutorial
STEP 3
Return to Index
In this chapter we learn how use fixed and auto-layout capability
togheter
Here the final result:
1. ABOUT FIXED WIDGET
The fixed widget
(icon is showed on the main toolbar under containers),
is a container widget that does not implement automatic layout feauture.
Widgets contained into a fixed do not expand and can be resized/moved
programmatically by the user.
Fixed widget moving/Resizing operations
These operations can be done both with the mouse and the keyboard
Keyboard
-
arrows keys up,down,left,right: move the selected widget in the
arrow
key direction (fine tuning)
-
shift+arrow keys, move snapping to the grid
-
ctrl+arrow keys, resize the selected widget in the arrow key
direction (fine tuning)
-
ctrl+shift+arrow keys, resize snapping to the grid
Mouse
-
left button mouse click: selects the widget and drags it for a fine
tuning
-
shift+left button mouse click: selects the widget and drags
it snapping to grid
in both cases mouse pointer have the "move" shape
-
left button mouse click on the right bottom corner: selects the
widget and drags resizing
it for a fine tuning
-
shift + left button mouse click on the right bottom corner: selects
the widget and drags resizing
it snapping to grid
Warning:
Unfortunately moving/resizing with the mouse
does not work perfectly , with a "gummy"
behaviour and in some case do not move at
all. In these cases i suggest to move/resize
using keyboard that is assured to work
near perfectly.
2. NOW LET'S BEGIN
-
Make a new project into your-home/vdkb-examples/ named step3.prj
as you learned on previous step1.
-
Select step3 MainForm window and drop a Menubar
-
Select Menubar0, click right mouse button and choose "Add
menu item" from pop menu
a new MenuItem0 item will be added to Menubar0
-
Select MenuItem0 and into WI and edit Caption field
writing "_Quit", press Enter.
Tip: The underscore prefixed to "Q" makes
a keyboard accelerator: alt+q
-
Select again MenuItem0 , click right mouse button and choose
"Set min size " from pop menu
Adjust horizontal size to 50
-
Drop a fixed into step3 main Form, you will see the fixed widget
showing a grid with a default spacing of 8.
Tip: grid can be removed and/or customized using
WI
-
Drop a Custom List (with 2 columns) into the fixed.
-
Move/resize the custom list to occupy the rightmost part of the window
-
Click on custom list Title#0
-
Edit on WI the Column Title field to write "Name" and press
Enter
-
Click on custom list Title#1
-
Edit on WI the Column Title field to write "Address" and press Enter
-
Drop a frame into fixed widget. move/resize it to occupy the leftmost part
of the window.
-
Select frame and edit on WI the field Label to write "Actions",
press Enter.
-
Drop 2 LabelButtons into the frame
-
Drop a CustomButton into the frame
-
Drop again a LabelButton into the frame.
-
Using WI select buttons and edit Caption fields accordlyng
to the picture above:
Add, Remove, Edit, Sort
-
Select the CustomButton and use WI SetGlyph button to choose some
pixmap around
Tip: if you go into vdkbuilder dir you can
find: vdkbuilder/pixmaps/simpson1.xpm.
-
Click on "Set xpm to project dir" button, this causes the xpm files
to be copied into
your project dir.
-
Select frame and adjust the size using both mouse or keyboard to make all
contained
buttons a bit narrow.
Tip: resizing a container causes all contained
widgets to be resized as well. Recall
only direct childs of a fixed can be resized
with mouse/keyboard, in this case resizing
on button basis does not work.
-
Press run icon on main toolbar and wait for the program running,
you should be able to see the above picture.
-
Close application and VDKBuilder Maker
3. CONNECTING TO QUIT APPLICATION
-
Select MenuItem0 on WI and switch on Signal page
-
Click on ActivateSignal button
-
Click on signal map the item that shows: ON_SIGNAL(MenuItemo0,activate_signal,OnMenuItem0Activate)
-
Click list column button entitled "Write or jump to response method"
(or double click on list item)
You will see the editor popup showing your signal response defintion into
source code.
-
Edit the response method to read:
// signal
response method
bool
Step3Form::OnMenuItem0Activate(VDKObject*
sender)
{
Close();
return
true;
}
-
Choose from main menu the item Project->Make and wait for program
compilation
-
Close VDKBuilder maker
-
Click on run Icon, no you can close the application also using
keyboard
accelerator "alt+q"