The file JaxGUI.EXE will run JaxGUI1.exe in WinXP, 2000, ME, 98 and 95. Its a config program that will change full screen to a Window, set the font to 8x12 Raster and   uncheck EditMode, if it's checked. This setup seems to look good in 800x600 screens.

 

If you have a Higher Resolution, you can change the font to larger by editing the JaxGUI.CWC file with a text editor or Notepad. The Raster fonts looks better, but if you can't find the Size you want,   you can change BMP to Truetype and change 8x12 to 14 or   16 or 18 or any size supported by Truetype.

 

This Software is Free, there is no charge for it. I wrote it for myself, but I thought I would share with the rest who wants to give it a try.  Its for those who don't already have a RAD type program that outputs the SDK style examples.

 

Use this software at you own risk, Jerry Fielden will not be responsible for any damages.

   


           


 

                                INTRODUCTION    

 

I don't do enough of this type of programming to remember how it goes, so to keep from having to search through all that material and relearn it again and then apply it in the correct way,  I though I would create something that would remind me. I guess I got carried away a little bit with those different shaped windows. A lot of it, I probably will never use again, but its there in case I ever need it. 

 

It was written for PBCC in PBCC.

 

Some of the selections like different shaped windows, I think will only work in the newer type windows.

                  

JaxGUI is a Sample maker. It makes Samples of A Parent Window with Child windows using SDK style programming. A person could design their own Window Sample with as many Controls/Child-Windows on a Parent that it will hold.

 

You can make a Parent with One Control to see how it looks or you can fill the Window up with Controls, as many as will fit on the Parent. You can leave out the controls to see how a parent would look by itself. The Parent can be as large as the Monitor Screen or as small as a Playing Card. There's a Grid and a selection tool that will aid you in selecting your sizes The size in pixels is displayed at the bottom left.

 

You can color, make transparent, select different shapes, choose popups, and etc. by Right clicking on the parent's menu Button. Right clicking on Parent also lets you choose a 2 color Gradient that covers the Parent client area. Smaller rectangle Gradients can be added right clicking on the Rectangle button.

 

It has 3 Menu Makers that makes a Single level drop down Menu, a POPUP menu launched by a Button, and a RightClick PopUp Menu.

 

You can Preview your Window after each control is installed on the Parent's Grid by Clicking on PreView. You are getting the actual Window with already installed Controls. JaxGUI might have to be in the compiler's directory for Preview to work.

 

You can Preview the Code by clicking on CodeView . A copy of what you have already done is put in your PBCC editor for your Viewing or Testing.

                                        

Each Control Name, except for Button which has a different kind of Sub Menu, has Sub Menus where you can Change Background and Foreground Colors, Select fonts, and change Styles. Clicking the Right Mouse Button on their buttons displays their Sub Menus.

 

You can decorate the Background with Circles, Ovals, Round   Rectangles, and hatch lines from their selections on the Bar. It has its Sub Menus also for Pen style, Pen Color, Pen width, Hatch line styles, Etc.

 

You can put etched lines on the Parent by using the Static control's SS Style Menu.

 

A MessageBox maker is at the bottom of the screen, it has menus where you can select an icon, Styles, Select width of Message box, Type the Message in a Editbox, and type a Caption in a Editbox. The generated code is put in the Window's Clipboard.

 

The Bottom Menu Bar also contains a ProgressBar, a Horizontal TrackBar and a Vertical TrackBar. Along with the Rectangles, These controls won't display inside any Frames or frame types.

 

F1 Key is supported for a Help Menu

 

Esc Key is supported to end the program without completing its task or exiting the help menu.

 

When you click on OK, the Program will close automatically and leave your generated code in the Clipboard. You are also asked if you want to save.

 

 


 

                                MOUSE BUTTONS

 

 

When I say Click on something, what I mean is to use the Left   Mouse Button. I will sometimes say "Left Click", but a lot of the times I will say "Click".

 

When I want you to use the Right Mouse Button to click on   something, I will always say "Right Click".  Right click is used  on most of the buttons on the Menu to get its extended menu. 

 

Right Click is also used in the Styles menus to get their descriptions. 

 


 

                                Open a Previous Window

 

 

If you want to Work on a Previous Window, when the message box prompts you, Browse to the jExamples directory and select files with the .SAV extensions in the Open dialog box.

 


 

                                CREATE A PARENT

 

The Grid on the screen will represent your Monitor screen. You can select an area of the Grid that will represent the size of a Parent you want.   Don't try to select the Parent Area by dragging the Mouse over it, just click on the two corners and click on Parent on the Bar. Even though a frame will appear after your first click, you still have to do the second click also.

 

If you move the Mouse Arrow to the left of the Starting point, it will unselect the starting point, so you can reselect it. It works the same way with child windows. You can only do this if you haven't clicked the second time on the Ending point when selecting an area for a control or parent.

 

The grid isn't as large as the Monitor client area so whatever you select for an area will be larger in window size than what is shown on the Grid. Pixel size is shown at the bottom left, so you can judge by it.

 

 

 

 

Coloring the Parent can be done by Right Clicking on the Parent Button, after selecting an area. There's a few colors that you can choose from on the Parents extended menu. Colors like Black, White, Gray, etc can be selected directly from the menu. Those colors can be used when creating the Parent and doen't need to be painted on.

 

The rest of the colors which can be selected from the color picker below can be painted on by clicking on Color Parent on the same Parent menu.

 

 

 You can now click on Preview to see what your Parent will look like.

 

        

When you are through looking at it, click on the system close button in the top right corner. This will take you back to the JaxGUI program.  

 

 

Gradient Fill  uses the same Color Picker above.  It lets you pick two different colors. After you pick your first color, it closes when you click on OK and then comes back up so you can pick another color.  Although you can pick any color,  a dark and light color combination would probably make a better Fill.

 

There is two different Fills which you can choose. If you chose the Horizontal Gradient fill, it starts from a side and fills to the other side. If you choose the Vertical fill, it starts from the top and fills to the bottom.

       

The fills in this menu works only with the Parent, it fills the whole client area. Smaller selective fills can be done by clicking on the Rectangle button at the bottom . 

 

                               PopUps

  

POPUPs can be created by right clicking on the Parent button.

 

If you use DLG_Frame with your Popups, you can click on the visible parts of the frame to drag the popup around since it doesn't have a title bar.

 

Any portion of the window that is not covered by a control can be used to move a popup windows around.

 

If you selected PopUp without a frame, you will have to depend on visible portions of the parent or static parts to drag it around if you want to move it. You won't be able to drag it from a Button or other controls. You can drag it by the static control areas. Areas painted using Rectangles or Ovals/circles can also be used for moving the Window.

  

PopUpWindow is  available from the Parent's extended menu by  Right clicking  on Parent, and clicking on the POPUPWINDOW or POPUP Selections.

 

Code to use the Esc Key is automatically added when you choose any of the POPUP styles, whether it's an Extended menu selection or a selection from the Styles menu.

 

Due to the missing Title Bar, code is also added for dragging the window around with the mouse pointer.

 

An Example for creating a Popup is included in the Buttons Section.  It uses the Static Control with graphics on it which will resize the Parent to the same size of the graphics.

 

 


 

 

                               Drop Down Menu

 

JaxGUI can make a Menu for your Parent in only a few easy steps.

 

1. Select the top row of your Parent Grid, or any area for that matter,   it doesn't make any difference since the area selection will be deleted when the menu is completed.

 

 

 2. Click on Menu Button at the bottom of grid.

 

 

 

 

 3. Click on Drop Down Menu

 

 

 4.  For the first drop, type a Name that goes on the Bar. If you were making a Menu for an Editor, you would probably Type ‘File’ without the quote marks. Now click on the ‘Insert’   Button, shown in the Graphics below.

 

Only do this when you want to Insert a name on the Top Bar.

 

 

5. Next type all the selections that would go under File and click on ‘Append’ or Hit Enter after each one. You would probably type something like this.

 

     Open..........then click on  ‘Append’ or hit Enter

     Save............ "     "    "     Append  or hit Enter

     Exit............. ."    "    "     Append  or hit Enter

6. To add ‘Edit’ that is next to ‘File’ on the Bar, type Edit   and click on ‘Insert’ again. This Inserts Edit on the Bar.

7. Just like step 4., you would probably enter Selections like Copy, Cut, Paste, Find, etc... that will be Appended to `Edit'  and you would click on Append or hit Enter after each one.

 

 8. To put more Names on the Bar, Type the Name and then Click on Insert and then type all the selections to Append to it.

 

 9. When you are finished, click on done.

 

When entering names, You will have to be careful to not click on the wrong Button. You can correct it later in the code that's generated, or you'll have to end the program and start over.

 

If you are making a menu for an Edit control, you would want to create your Edit control first so the Menu Maker can get its ID number. When Cut, Copy, Paste, etc. is appended it will use that ID number.

 

If you appended names like Open, Save, Exit, Undo, Cut, Copy, Paste or Clear, the program will include some example code in the source. The Open and Save examples only gives you a Open/Save dialog, you'll have to write your Open and Save functions to actually load some files. The rest gives you working code that you don't need to add to. This only works for your Program's Drop Down Menu, not the Button launched or RightClick PopUps.  

 

If you forget to put the menu in at the start, you can do it anytime before you click on the OK button to generate the Code. You can also select any Area Even if it over an area already used. You only need to select an Area to get back to the Button selection mode so you can click on Menu.

 

 

RightClick Menu

 

Clicking on Right Click Menu after clicking on the Menu Button at the bottom bar will give you a Box where you can fill in the selections for your menu.

 

 

 

Button Launched Popup Menu

 

To get a Popup Menu launched by a button, you have to go to the Buttons menu and click on Ex by Enter Name, Type a name to put on your button and hit Enter. The Buttons Extended menu is launched, there you would click on Trigger Popup Menu and a box is provided for you to fill in the Selection Names.

 

 

   


 

                               Create Controls

      

After you have your parent you can now place Controls on its grid.  It's done the same way as the parent, clicking on TopLeft and Bottom Right corners. You would want to stay on the parent's Grid though.   

                                   

When you are through selecting the corners, Click on the Control's name at the Bottom. You will get the Default when they are Left Clicked.


If you were to Right click on the Control name Button, it would display its sub menu where you can change Colors and fonts if it's on the Menu.  You can't change colors on every control, just the ones that has it listed on the Menu.  Most control’s extended menu are similar to the one shown in the ListBox section. Some will have more selection than others. All will mark each selection you have completed so you won’t do it again.

 

The Controls that usually occupy one row, like buttons, checkboxes, radiobuttons, etc, areas are marked by hatch marks on the grid when you are  selecting only one row for their areas. 

 

If you have selected an area on the grid but haven't clicked on a control yet, you can click on the grid anywhere except on a button and that will unselect that area.

 


 

 

                               Combination Box

 

  After you have a parent grid showing, select an area that will represent your combo’s width and heights.

    

 

It will only occupy 2 rows on the grid after the selection is made.

                                               

If you were to click on Preview,


Only a corner of the preview is shown that contains the combo box.

 


 

                               CheckBox

 

Radio Buttons and Checkboxes are similar. You only need to select one Row for height unless you are doing multiple line text.

 

We are doing a checkbox shown below.  We will left click on CheckBx to get the default.

If we Right click on CheckBx, we would get its submenu where we could select to use pushbuttons, flatbuttons, change fonts, and select different styles.

 

Next Enter the text that goes beside the check box.

 

The parent Grid would show :

 

And a corner of preview shows

 

See Buttons below about adding an OK button to generate code that checks if it is checked.

 


 

 

                                ListBox

 

Like the Combo Box, you would select an area in the similar fastion. Select your width and height, and if you want to use the default, Leftclick on the ListBox Button.

 

ListBox has been upgraded to make multiple selections in version 2.2.  You can drag the mouse cursor down and get several selections at a time or you can pick at random.

 

When you Pick at random, it doesn’t keep all random picks highlighted although they are still selected.  Don’t use the Shift or Control Keys with Radom picks or it messes the picks up.

 

The OK Button from the button menu stores the pick info, so it will need to be created last.

 

To show you how to do different font and change colors, we’ll Right click on it to get its menu.

We placed our listbox underneath the combo box.

 

 

From the menu below, when you click on change Font, a fontpicker is displayed where you can pick different fonts in different styles.

 

Clicking on Background color and Foreground color will produce a colorpicker like the one shown in Parent section above.

 

 

 


 

 

                                BUTTONS

 

The Buttons has a menu to select commonly used Buttons, Like ‘Ok’   and ‘Close’… Etc….

 

To get to the Button's Extended Menu, click on ‘Ex’. From this menu you can select Flat buttons, Bitmaps in Buttons, Hidden Buttons in graphic and different Fonts.

 

By clicking on ‘Resize Image>Button’, you can put a Bitmap on your Button. It will be stretched or swrink to fit the button. So choose your sizes carefully, at least the same ratio as the original Bitmap when you select an area on the Grid or close to it, or it might look kind of funky.

 

If you click on ‘Resize Button>Image’, it will make the button fit the Bitmap. So you don't want to use a real large Bitmap, it may not fit on the Parent or it could crash into other controls that’s in the way.

 
When you add a CLOSE button, it will generate code that will close the window.

 

Adding an OK Button  will add code that will gather  text typed in the Edit Controls and Richedit Controls. It also adds code that will see which Check box or Radio button is checked, along with selections from Listview. This OK button must be added Last after any of them before this will work. If you add the OK button before any of it’s supported controls, it won’t gather their info and generate the code to do this. All this is displayed in a Message box from the compiled EXE. Only one Ok button is needed. 

 


                                              

                                                Pixel Coordinated Buttons

 

   This is linked to the Player_Tutor.htm file, when through viewing click on the Back arrow

 

 

 


 

  

                           MM Buttons

                

The Buttons Menu has 4 buttons used for playing Midi, Wave or MP3 files using the Windows media player 6.1 or later. Code that supports each button is included in the generated output. The file FBsound.SAV included in the jExamples directory is an Example of one created totally by JaxGUI. You can Load this sample at program start and click on Preview to play some music with it.

 

There's a html Tutor that can be downloaded seperately that shows how to do it using the Pixel cordinates mentioned above.

 


     

                             ListView 

  

You can choose from 4 different examples, just click on the one you want.

 

The topleft example loads from a FILE. It first writes an example to the file and then loads from it. If you want to  except the defaults, just hit enter after each one the flashing  cursor is located on.

 

There's a listview that loads from an ARRAY.

 

There's one that loads from DATA.

 

A single wide column one that Loads from a STRING.

 

New:

You can now add code that will get the text from items that you clicked on with the Left Mouse button. It also generate code that allows you to Edit Items if you were to Right Click on the items. It will generate this extra code when you Right click on the LView Button and click on Edit/Select Items.

 


 

 

                                RichEdit

 

 

  It works like the Edit control. It doesn't yet have an Extended Menu. 

 

 See Buttons about adding an OK button to generate code that gets it’s text.

 

 


 

                                Progress Bar

 

It is handled same as the other controls. You can make it as tall as your parent if you want. Colors and Range can be changed by Right clicking on the PBar Button.

 


 

                                Vertical TrackBar

 

A Vertical TrackBar and a Horizontal TrackBar selection have been added to the Menu. Alow 4 spaces for the vertical trackbar width. 4 spaces on the Grid would look this:

 

      . . . .    It would be 4 dots on the grid

      1234 

 

You don't have to make it 5 spaces, you can make it 1 space wide and the program will select the 5 space width for you.  Even if you made it 20 spaces wide, the program would only make it 5 spaces on the Grid because thats all that's needed.

 

Just try to keep it 4 spaces away from the Left edge of another Control or the Right Edge of the Parent Grid to keep it from overlaping.

 

The depth, you will have to select on the grid yourself.

 

 


 

                               Horizontal TrackBar

 

The Horizontal TrackBar only takes up 2 rows for its depth. If you select 10 rows for it depth, it will only take up 2 on the Grid. Choose any width you want.

 


 

                               STATIC CONTROL

 

When you select a Area and Right click on the Static button, you can do several things to the Static control, like changing its  colors, stretching bitmaps to fit the area selected, changing the  size of the static control area to same as the Bitmaps and changing  the Parent size to same as the Static control that has a Graphic.

 

Above in BUTTONS is one example for placing graphics on a Static control. So when you click on objects in a picture thats resides on  a static control, a button clicked message can be sent to the owner.

 

                          

                               ETCHED    LINES

 

The Static Control can be used to display etched lines that can be used for separators, etc.

 

1. First select a single column or row at any length or height on the Parent. Even if you select more than a single row or column, it will revert back to a single.

 

 2.  Right Click on the Static button for its extended Menu.

 

 

 

 3. Click on SS STYLE to get its menu.

 

 

 4. Click on SS_ETCHEDHORZ in the menu below if you are doing Horizontal, else click on SS_ETCHEDVERT for Vertical.

 

  5. Click on ~Ok~ to complete it.

  

The Etched Vertical is done the same way, except select a Vertical area on the parent grid instead.

 


 

 

                             Rectangles

 

You can paint portions of your Parent with Rectangles that uses solid colors with or without Pen, or hatch lines, or Gradient Fills.

 

If you Left click on the Rectangle Button, you will get the default solid color with a black line around it. By right clicking on its button, you can change the Colors, add hatch lines, Pen Color and width.

 

                             Gradient Fills in Rectangle

 

Right Clicking on Rectangle  lets you choose 2 types of Gradient fills, which is Horizontal and Vertical.

 

If you like to see vertical bars on your window, Gradient fill makes the best looking ones around.

 

1. To make a Vertical Bar, on the Grid you would select 1 or 2   colums and make 1/2 of the bar on the Grid.

 

2. After Right clicking on  Rectangle, you would select Horizontal Fill, since it fills from Left to Right.

 

3. When the color picker comes, choose a Dark color first and then a choose light one when  it comes back the second time. White is a good light color to choose, it goes good with bars.

 

4. Click on Finish and this complets the first half.

 

5. Do steps 1 through 4 again, except chose the Light color first this time, using the same  2 colors. 

 

If you do a Horizontal Bar, its done the same way, except you would Select a horizontal bar area on the Grid and a Vertical fill in Rectangles.

 

If you paint an area with a Gradient Fill and later paint portions of the same area using the Hatch or solid colors from Rectangle menu, Rounded Rectangle menu, or the Oval menu, the gradient fill will cover the rest up when you try to move the window around with the mouse. You can do smaller gradient fills on top of the larger areas alright, and it will stick when you move the window around. It seem like the Gradient Fills get repainted but the regular fills doesn't, when moving.

 

 

 

                                Round Rectangles

 

Round Rectangles is done the same way and has the same choices as the Rectangles Except there is no Gradient Fills.

 

You can change the rounded corners in the Right Click menu.

 

 

 

                                Circles / Ovals

 

Circles / Ovals has the same choices as the Rectangle except for the Gradient Fills.

 

When you select a rectangular area on the Grid, you get an Oval. When you select a square area, you get a Circle.

 

 

 

 


 

 

                               PREVIEW

 

You can preview what you have already placed on the Parent Grid by hitting the Enter Key or clicking on the PreView Button. When you are through looking, click on the Close Button at the top right of  your Previewed window. If you are previewing a POPUP window, hit the Esc key.

 

For Preview Window to work you will have to unzip JaxGUI into the Compiler's Directory.

 


 

                                CODEVIEW

 

Clicking on CodeView lets you preview your code with CCEDIT, Jfishpro or Notepad. If none of these IDEs are in the FBC.EXE directory it will use Notepad.

 

If you want to work on a window that you’ve completed in JaxGUI  in one of the IDEs, you would want to use Save As and rename it. The temp file that JaxGui uses should be deleted when you exit the editor. 

 

 


 

                                 STYLES

 

Styles are located on the extended menus when you Right click on a Control Button or the Parent Button.

 

If you add any styles, put back the ones that cause the window to display. The Default styles are listed just above the Buttons at the bottom menu bar.

 

Some controls can have Scroll Bars added, thick frames, etc, just by changing the styles.

 

To see style described, after selecting an area on the Grid, right  click on a Control Button and Left click on one of the  Styles. You would Left click on a style to select it, but to read the definition; you would right click on it.

 

Etched Lines, shown above, is an example of using the SS_styles, which is for the Static Control.

 

SS_SUNKEN is another style used with the Static Control which gives the Static Control a sunken border.

 


 

                 

                                  OK

 

 

When you click on OK, the Generated code is placed in the Window's clipboard. All you need to do is paste it in an IDE.

 

 


 

                             Saving / Opening

 

You can save your created window to a .SAV file by clicking on Yes when asked after clicking on the Ok button.  You can reopen this file when you restart up EzyGui again.

 


 

                                Message Box

                                     

The Message Box Maker will let you Create message boxes, just about the size you want. Message box is separate from the rest, but you use the grid to select a width for the message box. Height is determined by how much text is entered into the textbox provided. You can’t create a Window while making a Message Box and vice versa.

 

1. Select an Area on the Grid, just the size you want and then click on MsgBox instead of Parent.

     

2. Select an Icon and then Select a Button. The default button is the OK Button, if you don't select one.

 

3. To insure that the MessageBox get to the Top, Select TOPMOST from the Flags Menu.

 

4. Type your message into the Editbox that is provided.

      

5. If you want, you can now click on Caption and enter something in the title bar.

 

6. Message Boxes should work in the console mode also.

 

7. When you are done, the Program will shut down and the generated Messagebox will be in the Window's Clipboard.

 

 

 

 

Send bug reports to fieldens@excite.com.