FiveWin in Practice 2
FiveWin in Practice part 2
By Patrick Mast INTRODUCTION
In this second article we gonna expand our First Application with buttons, a icon, a cursor and a dialog screen. All these controls are stored in a resource DLL file. TOOLS
To design and save all the resources we gonna need a resource painter. In our first article you find the link to the resource painter we gonna use; Resource Workshop from Borland. This resource file we use for this application is a 16 bits DLL file. Later on when we convert our application from 16 bits to 32 bits we have to convert the resource file to a 32 bits resource DLL file.
FiveWin provides use with a standard empty resource DLL file. You can find it in the DLL directory of your FiveWin installation, the name of the file is Screens.DLL. With this file you can start painting your own resources, save the file, rename it to the file you want and you’r off! BUILDING RESOURCES
Starting Borland’s Resource Workshop with the empty Screens.dll gives an error dialog with “No resources in this file”. This is correct, because the DLL is empty… Just press OK here. Our first resource we need is a bitmap for the buttonbar. To make a new resource click on the ‘Rescource’ menu and select ‘New’. The following dialog apears: 
From here you can select wich type of resource you want to make. The first resource we going to select is ‘Bitmap’. The following dialog appears: 
We need a bitmap with 44 pixels whidth and 42 pixels high. 16 colors is ok for our bitmap. If you fill in the values and press the Ok button the painting screen appears. Here we can paint the bitmap. The first bitmap is for the customers dialog. So i’m gonna draw a customer… The painting screen looks like this : 
When finishing the painting, just close the Bitmap MDI child window. The resource listbox looks like this now: 
The bitmap is called automaticly ‘BITMAP_1’
. The name of the bitmap we gonna use is ‘Customer’. To change the name select ‘Resource’ menu and select ‘Rename’. Replace the ‘BITMAP_1’ with ‘Customer’, press Ok and the resource name is changed. Follow the same steps to create the bitmap for the ‘Exit’ button and name it ‘Exit’.
We also need a cursor for the buttonbar. If the mouse passes over the bitmap button we want the mouse cursor to change into a hand. Select ‘Resource’ menu, ‘New’, Select ‘CURSOR’ . Draw the hand and select as background color ‘Transparant’. This way you only see the hand on the button. 
Now save the resource file and rename the Screens.DLL to First.DLL.
So far so good! Now we have a resource DLL ‘First.DLL’. Lets attach it to our EXE file now and build the buttonbar. In our First.Prg from part 1 we add the following lines: ---FIRST.PRG--- SET RESOURCES TO "First.DLL"
DEFINE CURSOR oHand RESOURCE "Hand"
DEFINE BUTTONBAR oBar SIZE 48,49 OF oWnd 3D CURSOR oHand
DEFINE BUTTON ;
OF oBar ;
RESOURCE "Customer" ;
ACTION Customers() ;
GROUP ;
MESSAGE "Customers dialog" ;
TOOLTIP "Customers" ;
NOBORDER DEFINE BUTTON ;
OF oBar ;
RESOURCE "Exit" ;
ACTION oWnd:End() ;
GROUP ;
MESSAGE "End This First Application!";
TOOLTIP "End application" ;
NOBORDER -------------------------- The ‘SET RESOURCES’ command attaches the resource DLL to the EXE application. It is the main resource file for our application now. It is possible to open more than one resource DLL file. Simply do SET RESOURCES TO “First1.DLL”,”Second.DLL”, [] If you open more than one resource file it is necessary to select the one you are going to use. In our First Application we only use one resource file. DEFINE CURSOR oHand RESOURCE "Hand" The reference for the hand cursor is stored in oHand wich is a simple local variable. This reference is used in the buttonbar command to attach the hand cursor onto the buttonbar. DEFINE BUTTONBAR oBar SIZE 48,49 OF oWnd 3D CURSOR oHand Again we use a local variable to hold the reference to the buttonbar. In this command we also use the reference to the hand cursor. We want the buttons to be big! 48 by 49 pixels. The 3D command speaks for istelf. Once the buttonbar is created we can place the buttons on the bar. DEFINE BUTTON ;
OF oBar ;
RESOURCE "Customer" ;
ACTION Customers() ;
MESSAGE "Customers dialog" ;
TOOLTIP "Customers" ;
NOBORDER The DEFINE BUTTON places a button on the buttonbar. The oBar is the reference to the buttonbar. The Resource command tells the button to look for the bitmap into the open resource file and look at a bitmap named “Customer’ in the resource file. If the button is pressed, go to the Customers() function. A button can also have a message (in the messagebar) and a tooltip. The NOBORDER command telles the button to Not place a border around the bitmap. For the exit button we use the same DEFINE BUTTON only with different parameters. The GROUP command tells this button to leave a space between the exit and customer button. The buttonbar looks like this :
BUILDING DIALOG FROM RESOURCES 
Now that we have a buttonbar and a hand cursor we can start building a dialog screen from resources. Open the First.DLL file with Borland’s Resource Workshop. Select ‘New’ than ‘Dialog’. This screen apears: 
Select ‘Standard window. No buttons.’ And press OK. The following dialog apears:
This is a standard empty dialog. All the elements are placed on the dialog via drag and drop from the tools buttonbar. We want to build a dialog box with standard says, gets and a Ok button.
First we define the proporties for the dialog. Right click on the dialog and select ‘Style’. The following window apears: 
The ‘Caption’ is the title of the dialog. We change this in ‘Customers’. The Dialog style ‘System menu’ gives the dailog a system menu if you press on the upper left corner of the dialog, like this: 
If you don’t want let the user minimize or maximize the dialog, uncheck the ‘Minimize box’ and ‘Maximize box’. Like our example, the lay-out of the customers dialog is gonna be fixed, so there is no use to maximize the dialog, therefor we uncheck the ‘Maximize box’. Since the dialog is gonna be non modal the minimize box has no use either, so we uncheck the ‘Minimize box’ also. Because the System menu als lets the user minimize and maximize the dialog, uncheck this option also. Press Ok on the Window style dialog.
Now we can start painting the text labels and edit boxes. To put a text style on the dialog, press the text button on the Tools buttonbar. (Its the button with a big T) Than click on the empty dialog. The text label will apear on the dialog. Now right click on the textlabel to change its style. The following dialog appears: 
The caption is the actual text that shows on the dailog. The first item that we want to know about our customer is his customer number. So put in the caption ‘Nr. :’ (without the quotes). The ‘Control ID’ is the ID number that we gonna use in our source to refrence to this text label. We don’t need this now, therefor let it be –1 (no reference). In the ‘Control type’ choices we select ‘Right text’ because we want to right justify our text labels.
Next we want a edit control. Select the edit control button (Its the button with the carret). Click on the dialog on the right side of the text label (that’s where we want the edit control to be). Make the edit control larger by putting the mouse cursor on the right side of the label. It’s just like modifying the size of a window. It’s that easy! Now right click on the edit control to change its style. The folowing dialog appears: 
The caption is not so important here because it’s gonna be overwritten by our source code. (The caption is going to be the variable of the get). The ‘Contro ID’ for the get control is important now. Via the ID of the get in our source we make a reference to the ID in the resource file. Lets keep it 101. Next gets will be 102 and 103 and so on. The ‘Tab stop’ on the attributes rectangle makes that the get is gonna get focus by pressing the tab key. Automatic scroll (horizontal for a single line get) is verry easy if the lengt of the string in the get is longer than the get control itself. A trick for nummeric gets is to check the vertical scroll bar. This way the user can press the upper and lower button of the scrollbar to increase or decrease the value in the get. This is also possible for gets with a date value.
For memo gets you have to select ‘Multiple line’ and ‘Want return’. For a memo get you can also check the scroll bar’s. 
If you want a password get activate the ‘Password’ checkbox. This way the user only sees stars when entering data in the get.
The dialog already looks like this now:
If all the other text and edit labels are in place we can put a button on the dialog. There are two kind off buttons. A standard push button and a Borland style button. I prefer to use the standard push button. For this button press the ‘Button button on the Tools buttonbar. (Its the button with the OK on it) Again to place the button on the dialog, click on the dialog to where you want it to be. Right click on the button to define its style. This dialog appears.
We change the caption into OK for our sample. The control ID is also important here. We wanne put an action onto the button, so there must be a reference to the source code. We use ID 99 for this button. If you use 1 as an ID for a button it is seen as the default push button. This button also has to get a ‘Tab stop’. Press OK on the ‘Button style’ dialog.
Our dialog looks like this now: | |  ] if you open more than one resource file it is necessary to select the one you are going to use. in our first application we only use one resource file. define cursor ohand resource "hand" the reference for the hand cursor is stored in ohand wich is a simple local variable. this reference is used in the buttonbar command to attach the hand cursor onto the buttonbar. define buttonbar obar size 48,49 of ownd 3d cursor ohand again we use a local variable to hold the reference to the buttonbar. in this command we also use the reference to the hand cursor. we want the buttons to be big! 48 by 49 pixels. the 3d command speaks for istelf. once the buttonbar is created we can place the buttons on the bar. define button ; of obar ; resource "customer" ; action customers() ; message "customers dialog" ; tooltip "customers" ; noborder the define button places a button on the buttonbar. the obar is the reference to the buttonbar. the resource command tells the button to look for the bitmap into the open resource file and look at a bitmap named “customer’ in the resource file. if the button is pressed, go to the customers() function. a button can also have a message (in the messagebar) and a tooltip. the noborder command telles the button to not place a border around the bitmap. for the exit button we use the same define button only with different parameters. the group command tells this button to leave a space between the exit and customer button. the buttonbar looks like this : building dialog from resources now that we have a buttonbar and a hand cursor we can start building a dialog screen from resources. open the first.dll file with borland’s resource workshop. select ‘new’ than ‘dialog’. this screen apears: select ‘standard window. no buttons.’ and press ok. the following dialog apears: this is a standard empty dialog. all the elements are placed on the dialog via drag and drop from the tools buttonbar. we want to build a dialog box with standard says, gets and a ok button. first we define the proporties for the dialog. right click on the dialog and select ‘style’. the following window apears: the ‘caption’ is the title of the dialog. we change this in ‘customers’. the dialog ‘system menu’ gives the dailog a system menu if you press on the upper left corner of the dialog, like this: if you don’t want let the user minimize or maximize the dialog, uncheck the ‘minimize box’ and ‘maximize box’. like our example, the lay-out of the customers dialog is gonna be fixed, so there is no use to maximize the dialog, therefor we uncheck the ‘maximize box’. since the dialog is gonna be non modal the minimize box has no use either, so we uncheck the ‘minimize box’ also. because the system menu als lets the user minimize and maximize the dialog, uncheck this option also. press ok on the window dialog. now we can start painting the text labels and edit boxes. to put a text on the dialog, press the text button on the tools buttonbar. (its the button with a big t) than click on the empty dialog. the text label will apear on the dialog. now right click on the textlabel to change its style. the following dialog appears: the caption is the actual text that shows on the dailog. the first item that we want to know about our customer is his customer number. so put in the caption ‘nr. :’ (without the quotes). the ‘control id’ is the id number that we gonna use in our source to refrence to this text label. we don’t need this now, therefor let it be –1 (no reference). in the ‘control type’ choices we select ‘right text’ because we want to right justify our text labels. next we want a edit control. select the edit control button (its the button with the carret). click on the dialog on the right side of the text label (that’s where we want the edit control to be). make the edit control larger by putting the mouse cursor on the right side of the label. it’s just like modifying the size of a window. it’s that easy! now right click on the edit control to change its style. the folowing dialog appears: the caption is not so important here because it’s gonna be overwritten by our source code. (the caption is going to be the variable of the get). the ‘contro id’ for the get control is important now. via the id of the get in our source we make a reference to the id in the resource file. lets keep it 101. next gets will be 102 and 103 and so on. the ‘tab stop’ on the attributes rectangle makes that the get is gonna get focus by pressing the tab key. automatic scroll (horizontal for a single line get) is verry easy if the lengt of the string in the get is longer than the get control itself. a trick for nummeric gets is to check the vertical scroll bar. this way the user can press the upper and lower button of the scrollbar to increase or decrease the value in the get. this is also possible for gets with a date value. for memo gets you have to select ‘multiple line’ and ‘want return’. for a memo get you can also check the scroll bar’s. if you want a password get activate the ‘password’ checkbox. this way the user only sees stars when entering data in the get. the dialog already looks like this now: if all the other text and edit labels are in place we can put a button on the dialog. there are two kind off buttons. a standard push button and a borland button. i prefer to use the standard push button. for this button press the ‘button button on the tools buttonbar. (its the button with the ok on it) again to place the button on the dialog, click on the dialog to where you want it to be. right click on the button to define its style. this dialog appears: we change the caption into ok for our sample. the control id is also important here. we wanne put an action onto the button, so there must be a reference to the source code. we use id 99 for this button. if you use 1 as an id for a button it is seen as the default push button. this button also has to get a ‘tab stop’. press ok on the ‘button style’ dialog. our dialog looks like this now: close the ‘dialog’ window and save the file as first.dll. the resource file is finished! now we need to write the source for the dialog. function customers() local odlg, oget[5] define dialog odlg name "customers" redefine get oget[1] var cget[1] id 101 of odlg redefine get oget[2] var cget[2] id 102 of odlg redefine get oget[3] var cget[3] id 103 of odlg redefine get oget[4] var cget[4] id 104 of odlg redefine get oget[5] var cget[5] id 105 of odlg redefine button id 99 of odlg action odlg:end() activate dialog odlg center retu nil the define dialog command loads the resource “customers”. the odlg variable holds the dialog object. the redefine get redefines the get to the get in the resource file via the id number. the variable of the get is cget[x] the redefine button redefines the button to the button in the resource file via the id number. the action to perform when the button is pressed is odlg:end() the dialog is activated via the command activate dialog.the dialog will always appear in the middle of the screen because of the command center. there’s only one item we did not discuss yet and that is the icon in our resource. actualy this is very simple. the line define icon oicon resource "main" puts the object of the incon into the variable oicon. this variable is than passed to the window via the command icon like this: define window ownd mdi ; from 0,0 to 30,50 ; title "our first fivewin app!"; brush obrush ; icon oicon this way you see the icon appear in the upper left corner of the window. conclusion in this article i have shown you how to work with borlands resource workshop. instead of programming with the @ x,y commands it is simpler to actualy paint your dialogs and than later redefine the controls from withing the source code to the resource file. standard xbase++ cannot read resources from dll files. in the next article i will show you how it can be done! patrick mast is a 32 year young clipper programmer since clipper summer 87. he has been programming in fivewin for 4 years now and has a hit application in europe called winfakt!, wich is an accounting programme fully written in fivewin. you can get a demo at www.winfakt.com\demo . patrick mast can be reached at patrick@winfakt.com. " v:shapes="_x0000_s1041" first.prg--- first.prg--- --> |
Close the ‘Dialog’ window and save the file as First.DLL. The resource file is finished! Now we need to write the source for the dialog. ---FIRST.PRG---
Function Customers()
LOCAL oDlg, oGet[5] DEFINE DIALOG oDlg NAME "Customers" REDEFINE GET oGet[1] VAR cGet[1] ID 101 OF oDlg
REDEFINE GET oGet[2] VAR cGet[2] ID 102 OF oDlg
REDEFINE GET oGet[3] VAR cGet[3] ID 103 OF oDlg
REDEFINE GET oGet[4] VAR cGet[4] ID 104 OF oDlg
REDEFINE GET oGet[5] VAR cGet[5] ID 105 OF oDlg REDEFINE BUTTON ID 99 OF oDlg ACTION oDlg:End() ACTIVATE DIALOG oDlg CENTER RETU NIL
The DEFINE DIALOG command loads the resource “Customers”. The oDlg variable holds the dialog object.
The REDEFINE GET redefines the get to the get in the resource file via the ID number. The variable of the get is cGet[x] The REDEFINE BUTTON redefines the button to the button in the resource file via the ID number. The action to perform when the button is pressed is oDlg:End() The dialog is activated via the command ACTIVATE DIALOG.The dialog will always appear in the middle of the screen because of the command CENTER. There’s only one item we did not discuss yet and that is the icon in our resource. Actualy this is very simple. The line DEFINE ICON oIcon RESOURCE "Main" puts the object of the incon into the variable oIcon. This variable is than passed to the window via the command ICON like this: DEFINE WINDOW oWnd MDI ;
FROM 0,0 TO 30,50 ;
TITLE "Our First FiveWin App!";
BRUSH oBrush ;
ICON oIcon This way you see the icon appear in the upper left corner of the window. CONCLUSION Patrick Mast is a 32 year young Clipper programmer since Clipper Summer 87. He has been programming in FiveWin for 4 years now and has a hit application in Europe called WinFakt!, wich is an accounting programme fully written in FiveWin. | 
