GRIDPLUS - Example 2 | ![]() |
||||||
|
A More Complex Example |
Window:
Source Code:
package require gridplus 2.4 namespace import gridplus::* gridplus button .toolbar -style Toolbutton -padding 0 -space 0 -takefocus 0 { {.add :actitemadd16 "?Add Part"} {.delete :actitemdelete16 "?Delete Part"} | \ {.process :filenew16 "?Process Order"} {.cancel :fileclose16 "?Cancel Update"} | \ {.exit :actexit16 "?Exit Customer Order"} } gridplus entry .customer -width 20 -title "Customer Details" { {"Customer ID " .id 8} {"Company " .company} {&d "Title " .title 4 {+Mr Mrs Miss Ms Dr}} {"Address " .address} {"Firstname " .firstname} {"Town/City " .town} {"Lastname " .lastname} {"State/County " .state} {} {"Zip/Post Code " .zip 10} {|&c "Use as Delivery Address" .delivery_address +} {"Country " .country} } gridplus entry .order_details -width 12 -title "Order Details" { {"Received " .received} {} {"Warehouse " .warehouse} {"Ready " .ready} {"Sent " .sent} {"Paid " .paid} } gridplus tablelist .order_parts \ -width 98 \ -height 10 \ -tableoptions stripe \ -relief theme \ -scroll y { 3 "Part No" 0 "Description" 3 "Price" right 3 "Quantity" right 3 "Cost" right } gridplus entry .delivery_address -width 20 -title "Delivery Address" { {"Name " .name} {"Company " .company} {"Address " .address} {"Town/City " .town} {"State/County " .state} {"Zip/Post Code " .zip 10} {"Country " .country} } gridplus radiobutton .delivery_time -title "Delivery Time" { {} {"AM"} {"PM"} {"Monday"} {. -monam} {. -monpm} {"Tuesday"} {. -tueam} {. -tuepm} {"Wednesday"} {. -wedam} {. -wedpm} {"Thursday"} {. -thuam} {. -thupm} {"Friday"} {. -friam} {. -fripm} } gridplus entry .payment -width 12 -labelstyle bold -title "Payment" { {"Sub Total " .sub_total} {} {"Delivery " .delivery} {"Tax " .tax} {} {"Total " .total} } gridplus button .control -width 9 { {"Process" .process} {"Cancel" .cancel} } gridplus layout .main -taborder row -wtitle "Customer Order" { .toolbar - - = - - .customer:nsew - .order_details:ns .order_parts:ew - - .delivery_address:nsw .delivery_time:ns .payment:n ^ ^ .control:ew } pack .main
Comments:
package require gridplus namespace import gridplus::*
gridplus button .toolbar -style Toolbutton -padding 0 -space 0 -takefocus 0 { {.add :actitemadd16 "?Add Part"} {.delete :actitemdelete16 "?Delete Part"} | \ {.process :filenew16 "?Process Order"} {.cancel :fileclose16 "?Cancel Update"} | \ {.exit :actexit16 "?Exit Customer Order"} }
The buttons use the Tile "Toolbutton" style.
Five button widgets are created: The colon (":") prefix for a GRIDPLUS button indicates that an Icon button is to be created. This facility requires the ICONS packages to be installed. The text following the colon is the name of an icon from the ICONS package.
To create an Icon button it is only neccessary to specify an icon. In this case the command invoked by the button would be based on the name of the button Grid and the name of the icon.
For Example: "{:actitemadd16 "?Add Part"}".
In this example the widget would be called ".toolbar,actitemadd16" and the command invoked when the button is pressed would be "toolbar,actitemadd16".
However, in this example a widget Identifier (begining with a dot (".") is also specified to explicitly define the name of the widget and the command invoked when the button is pressed.
For Example: "{.add :actitemadd16 "?Add Part"}".
".add" is the widget Identifier. ":actitemadd16" is the name of the icon from the ICONS package. The text begining with a question mark ("?") specifies (optional) pop-up/balloon help text.
The rest of the items are for options specific to the button. The vertical bar ("|") can be used in place of a widget to create a separator bar.
The layout of the button widgets in the window matches the layout of the button details in the code. In this case they are one next to the other (horizontal) and will appear in the window accordingly as a single row. The backslash ("\") is the line continuation character.
When the button is activated a procedure called "toolbar,add" will be invoked.
gridplus entry .customer -width 20 -title "Customer Details" { {"Customer ID " .id 8} {"Company " .company} {&d "Title " .title 4 {+Mr Mrs Miss Ms Dr}} {"Address " .address} {"Firstname " .firstname} {"Town/City " .town} {"Lastname " .lastname} {"State/County " .state} {} {"Zip/Post Code " .zip 10} {|&c "Use as Delivery Address" .delivery_address +} {"Country " .country} }
Nine entry widgets are created: Generally for GRIDPLUS entry the first two items of each entry detail are the label text and the widget Identifier. The rest of the items are for options specific to the entry.
For Example: "{"Customer ID " .id 8}".
"Customer ID" is the label text to be associated with an entry with Identifier ".id". The entry widget is actually created with the name ".customer,id". The item beginning with a dot (".") is considered to be the entry Identifier. In this case the leftmost item is the label and the next the Identifier. This causes the label to be to the left of the associated entry. If the items were reversed the label would be to the right of the entry.
The number options "8" and "10" for widgets ".id" and ".zip", override the default size and sets these entries to have a size of 8 and 10 characters respectively.
The "&d" in "{&d "Title " .title 4 {+Mr Mrs Miss Ms Dr}}" overrides the default widget type (entry) to create a dropdown list with Identifier ".title" which is "4" characters wide. The list has four options " Mr Mrs Miss Ms Dr".
The "Use as Delivery Address" checkbutton has different column positions than the rest of the widgets in the ".customer" grid. This is done by embedding another widget grid.
For Example: "{|&c "Use as Delivery Address" .delivery_address +}"
This widget is created using the Embedded Grid syntax. The "|&c" specfies that an Embedded (checkbutton) Grid be created. The columns are specified as for a "normal" checkbutton grid. The the value of the checkbutton will be accessed as "$(.customer,delivery_address)".
The null widget ("{}") creates an empty cell in the GRIDPLUS grid.
The layout of the entry widgets in the window matches the layout of the entry details in the code. In this case there are two columns (each with six rows) and will appear in the window accordingly.
gridplus entry .order_details -width 12 -title "Order Details" { {"Received " .received} {} {"Warehouse " .warehouse} {"Ready " .ready} {"Sent " .sent} {"Paid " .paid} }
Five entry widgets are created: Generally for GRIDPLUS entry the first two items of each entry detail are the label text and the widget Identifier.
The "null" cell definition allows the border to stretch with empty space to the right of the entry widgets. Therefore, the entries are in effect left justified within the stretched border.
The layout of the entry widgets in the window matches the layout of the entry details in the code. In this case they are one above the other (vertical) and will appear in the window accordingly as a single column.
gridplus tablelist .order_parts \ -width 98 \ -height 10 \ -options stripe \ -relief groove \ -scroll y { 3 "Part No" 0 "Description" 3 "Price" right 3 "Quantity" right 3 "Cost" right }
The tablelist will have five columns, four of which have a fixed size of "3". The "Description" column, which has a size of "0", will automatically size to fit the remaining space. The last three colums are also "right" justified.
gridplus entry .delivery_address -width 20 -title "Delivery Address" { {"Name " .name} {"Company " .company} {"Address " .address} {"Town/City " .town} {"State/County " .state} {"Zip/Post Code " .zip 10} {"Country " .country} }
Seven entry widgets are created: Generally for GRIDPLUS entry the first two items of each entry detail are the label text and the widget Identifier.
The layout of the entry widgets in the window matches the layout of the entry details in the code. In this case they are one above the other (vertical) and will appear in the window accordingly as a single column.
The number options "10" for widget ".zip", overrides the default size and sets the entry to have a size of 10 characters.
gridplus radiobutton .delivery_time -title "Delivery Time" { {} {"AM"} {"PM"} {"Monday"} {. -monam} {. -monpm} {"Tuesday"} {. -tueam} {. -tuepm} {"Wednesday"} {. -wedam} {. -wedpm} {"Thursday"} {. -thuam} {. -thupm} {"Friday"} {. -friam} {. -fripm} }
Ten radiobutton widgets are created: Generally for GRIDPLUS entry the first two items of each radiobutton detail are the label text and the widget Identifier. The rest of the items are for options specific to the radiobutton. However, in this case the label is to relate to a whole row in the Grid. This Layout is achieved by creating the labels as a separate column.
For Example: "{. -monam}".
"." is the widget identifier. As no name is specified as part of the widget identifier GRIDPLUS will automatically generate widget names based on the name of the grid.The item begining "-" specifies the value ("monam") of the radiobutton group when this button is selected. The "-" also indicates that this button will not be selected when the group/grid is created. To create the button as selected when created the value must be prefixed with "+" (For example: "+monam").
The top row simply creates three column width labels (No widget identifiers are specified).
gridplus entry .payment -width 12 -labelstyle bold -title "Payment" { {"Sub Total " .subtotal} {} {"Delivery " .delivery} {"Tax " .tax} {} {"Total " .total} }
The "null" cell definition allows the frame to stretch with empty space to the right of the entry widgets. Therefore, the entries are in effect left justified within the stretched frame.
Four entry widgets are created: Generally for GRIDPLUS entry the first two items of each entry detail are the label text and the widget Identifier.
The layout of the entry widgets in the window matches the layout of the entry details in the code. In this case they are one above the other (vertical) and will appear in the window accordingly as a single column.
The null cell ("{}") creates a blank line in the Grid.
gridplus button .control -width 9 { {"Process" .process} {"Cancel" .cancel} }
Two button widgets are created: Generally for GRIDPLUS button the first two items of each button detail are the button text and the widget Identifier. The rest of the items are for options specific to the button.
For Example: "{"Process" .process}".
"Process" is the text to be displayed on a button with with Identifier ".process". The button widget is actually created with the name ".control,process".
The layout of the button widgets in the window matches the layout of the button details in the code. In this case they are one next to the other (horizontal) and will appear in the window accordingly as a single row.
When the button is activated a procedure called "control,process" will be invoked.
gridplus layout .main -taborder row -wtitle "Customer Order" { .toolbar - - = - - .customer:nsew - .order_details:ns .order_parts:ew - - .delivery_address:nsw .delivery_time:ns .payment:n ^ ^ .control:ew }
By default the "taborder" for a Grid/Layout is "column". This means that the order in which the widgets get focus gives priority to the column.
For Example:
The TAB focus order for the ".customer" entry Grid (which uses the default: "column") is:-
.id .title .firstname .lastname .use .company .address .town .state .zip .country
If the "taborder" had been set to "row" for this Grid the TAB focus order would have been:-
.id .company .title .address .firstname .town .lastname .state .zip .use .country
The "-taborder row" option sets the TAB focus order to "row" for the ".main" Layout. This does not effect the TAB focus order for the contained Grids/Layouts.
For Example: When the TAB key is pressed when ".country" of the ".customer" Grid has focus, the focus will move to ".received" of the ".order_details" Grid.
If the default "taborder" ("column") was in effect, focus would move to ".name" of the ".delivery_address" Grid.
The "=" character specifies that a horizontal libe be created.
The "-" and "^" characters have the same meaning as for the Tk grid widget Relative Placement: "-" increases the column span of the item to the left, "^" increases the rowspan of the item above.
The (optional) colon delimited suffix specifies the required anchor options: north, south, east, west and centre. The default is "w" (Left justified). Anchoring to opposites (north to south, east to west) causes the Grid to be stretched in the specified direction.
pack .main
Setting and Reading GRIDPLUS Widget Values |
The values of the GRIDPLUS widgets are stored in a global array with a null name.
For Example:
global {}
For GRIDPLUS entry and checkbutton widgets the array element has the same name as the widget: Thus the value of ".firstname" in the ".customer" Grid is referenced as "$(.customer,firstname)".
For GRIDPLUS radiobutton widgets the array element has the same name as the raiobutton Grid: Thus the value of the ".delivery_time" radiobutton group is referenced as "$(.delivery_time)".
The values of most GRIDPLUS widgets can be set simply by using the Tcl "set" command.
For Example:
set (.customer,firstname) Mary
...or...
set (.delivery_time) wedpm
However GRIDPLUS provides a "gpset" command. This can be used to set single or multiple widget values and is the supported method to set GRIDPLUS text and tablelist widget values.
For Example:
gpset .customer,firstname Mary
...or...
gpset { .customer,firstname Mary .delivery_time wedpm }