Screen Designer

From Mach3Wiki
Revision as of 07:40, 3 December 2010 by Scottn (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Contents

Introduction

This chapter describes the features of the original Mach3 Screen Designer. This program allows you to customize the released screens and to design your own, from scratch, both as main screens and for wizards.

Alternative screen design program exist. For further information see links to them on the main page. At present no single designer meets the needs of all users - all have advantages and disadvantages. Ongoing development will hopfully rationalize the situation.

Mach3Mill and Mach3Turn come with a standard set of screen layouts to suit many uses. You are strongly advised to use a screen resolution of 1024 x 768 pixels if you can, but screens can be provided for 800 x 600 and even 640 x 480 pixels.

The Screen Designer lets you change the layout of any or all of the information displayed on screen by Mach3. You can, if you wish, design a complete set of custom screens but, as there are more than 800 individual objects on the standard screens, most users will probably only want to make detailed changes to the layout.

The screen to use is loaded into Mach3 using the View>Load Screen menu. Screen layouts are stored in files with the .SET extension or the .SSET extension. The Screen Editor application is used to edit layout files.

The individual screens within a layout can be moved, deleted, imported etc. using the ScreenTweak utility (q.v.) This is primarily concerned with manipulating whole screens while Screen Designer deals with individual controls, their functions and positioning.


Screen Designer basics

The Screen Designer allows you to create and edit a set of up to 100 screens which form the .SET file. A screen consists of a collection of Controls. The Controls supported are:

  • DRO (digital read-out) - to display and optionally enter numerical values
  • Button - to request an action
  • Bitmap button - action but with an image rather than text giving function
  • Bitmap – display an area of color or a picture
  • Joystick - to control manual jogging
  • Label - to identify other objects or be a placeholder for a text display
  • LED (light emitting diode) - On/Off or warning indicator
  • MDI (manual data input line) - to allow input of "G-code" line
  • G-code list - to display current part program text
  • Toolpath - to display path followed by tool in current part program.

The screens are numbered 1 to 99 and screen P which is used to place controls that will appear on every screen (P is for Persistent). This is used, for example, for the buttons used to change from screen to screen. It is easiest to use screens 1 to 15 and 50 which is used for controlling jogging.

The Screen Designer is available, as a separate download from Mach3 itself, from the Downloads page.


Try out the Designer

Close Mach3, if it is running, and use the shortcut you installed in the desktop to run the Screen Designer.

File:SDCreateTools.jpg

You should see a mainly blank screen with a menu bar, a Tool bar (top of screen), a Status bar (bottom of screen) and a Pallet of buttons. The pallet and toolbar can be dragged around the screen to a convenient place out of the way of controls that you are editing. The toolbar and status bar can be hidden and viewed using the View menu. You will only need to do this if you want to place controls very near or sometimes off the bottom of your finished screen.

With the blank screen, click a button on the pallet and the click anywhere on the screen, e.g. DRO. You will get a default sized control of the type chosen. You need to press a pallet button and click for each control you want.

By default you will be putting controls on Screen #1. Use the numbered buttons on the toolbar to select other screens and place controls on them. Try placing some controls on the P screen and see that they actually appear on all screens.

If you click on a control you have placed you will see that it becomes selected and is drawn with the traditional sizing handles. It can be moved around the screen and resized by dragging the outline or the relevant handles. You can also move selected objects by "nudging" them with the left/right/up/down cursor keys. Each keypress moves the control by one pixel. Multiple objects can be selected using Shift-click. One selected object in a set can be deselected by Control-click.

The selected objects can be cut or copied to a clipboard and the contents of the clipboard can be pasted onto the same or another of the fifteen screens. Notice, that although you can run more than one copy of Screen Designer at one time editing different .SET files, each has its own clipboard so you cannot move controls from one file to another using the clipboard.

When you resize a control, other than a button, with the handles then its contents are scaled to fit the new size. This is how you decide on the font size for DROs, labels etc. When you have created a test screen, use File>Save As to save it with a new file name.

Run Mach3 and load your screen using the View>Load Screens menu. You should never overwrite the default screens with your designs as these files are likely to be overwritten by the installer each time you upgrade Mach3 to a new version.


Making the controls work

It is now time to see how to see how controls "work". It is easiest to do this by looking at the standard Mach3 screens. Assuming you have a 1024 x 768 screen, save your trial screens (perhaps in file Junk.set) and open C:Mach3/1024.set (or perhaps safer make and use a copy of this)

You will be shown Screen #1 - the "Program Run" screen. See which screens are displayed for screens 2 to 7. Do not save this work especially if you are using the real screen layout! Double-click the Cycle Start button on screen #1. You will be shown its properties which will look similar to this:

File:SDButtonProps1.jpg

Key scan codes

When Mach3 is running, Buttons and Bitmap buttons can of course be "pressed" by clicking the mouse. They can also have a "hotkey" assigned to them. Pressing that key on the keyboard when the button is visible is equivalent to clicking it with the mouse.

The "hotkey" is defined by its "Mach3 scancode". Screen Designer allows you to type the key you want to use and it will store and display (in decimal notation) the associated scancode. If you need to check these codes at any time then you can calculate the value by hand as follows:

Lookup the ASCII value of the code for the key (For letters it is the uppercase version of the character for other keys it is the code of the unshifted character – i.e. 5 rather than %). Thus, for example, spacebar = 32, A = 65, / = 47 etc. If you do not have a printed table of these codes then entering "ASCII code table" into your favorite search engine should find one. If your hotkey is to be a given key together with Shift, Ctrl or Alt depressed (or indeed a combination of these) then add, to the basic code, the following values (in decimal)

Shift   1,024
Ctrl	32,768
Alt 	 2,048

Thus Shift-A would be 1,089 (65 + 1,024), Alt-/ would be 2,095 (47 + 2,048) and Shift-Ctrl-Alt-spacebar would be 35,872 (32 + 1,024 + 32,768 + 2,048)

If you have worked with binary numbers then you will recognise that these rather odd looking numbers are actually powers of two.


Defining function by G-code or VB Script

This is the most direct way of making a new button work. You can provide some G-code or VB Script to be executed when it is clicked. You need to check the appropriate radio button to say what type of code you have written in the edit box. As an example look at figure 8.3 and the G50 button on the MDI screen of 1024.set. You will see that the latter (not unexpectedly!) issues the command "G50".

You can define buttons using G-code to do whatever you want that can be done by a single MDI line. The VB Script program, indeed almost always will, have multiple lines and can be up to 64k characters long!

Beware: If you use G-code like this, then any scaling which is active on axes at the time you click the button will be applied to the coordinates built into your button. The problem does not, of course, apply to zero values, which is a common case, whatever scaling is applied.

Hint: Remember that a button will only be operated by its hotkey if it is on the persistent or currently displayed screen. A useful trick for VB Script or G-code buttons, that you want to work at all times, is to draw them on the persistent screen but off the bottom of the viewable area. You can "design" here by hiding the toolbar and status bar using the View menu or by designing on a higher resolution display than you are going to use with Mach2. If you are only interested in adding hotkeys, G-code and VB Script then you probably need to skip to the section on "Properties of other controls" and then read no further about Screen Designer.

Exit not saving any changes to the 1024.SET.


Defining function by name

Notice, after double clicking a button, that there is a long list of radio buttons for functions that a button can call. Cycle Start uses the one called "Run". One possibility is "OEM code" which we will look at later.

The button has a title given in its "Button Text" box and can be activated by a "Hot key" (Alt-R in fact). The user is often reminded of this in the title - some buttons are very small so the shortcut is given in a separate label. Mach3 identifies keys by their scancode. Alt-R is code 2162. If you click Set Hot Key and type any other key (or Shift/Ctrl/Alt key combination) this will set a new hot key for Cycle Start. You will see its scan code. For safety set it back to Alt-R.

Close the dialog by OK


Defining buttons by OEM code

Now look at the properties of the Flood button by double clicking it. You will notice that its function is defined as OEM code 113 in the list of radio buttons. OEM codes are a way of extending the range of buttons for more esoteric purposes without the list of names becoming much too long. The allocation of named functions and OEM codes to buttons on the standard screens is given online in Standard Buttons and OEM Buttons

If you look at the properties on the MDI button you will see that its OEM code is 2. Codes 1 to 15 are used to select the fifteen possible screens.

If you look at the codes in all the screen selection buttons you will see which screen # is allocated to each and this will tie up with the rather odd order you will have discovered at the beginning of this section.


Getting a tidy visual effect

The Screen Editor has several features to ensure a neat looking screen design. These are accessed from the icons at the right hand end of the toolbar.

File:SDDesignerButtons.jpg

With the exception of the Clr - for Color - button they all act on a multiple selection of controls. These will often be of the same type (e.g. six DROs for the six axes) but do not need to be.

The last control selected in the multiple selection is special as it is the master control of the selection and other controls will be moved, sized etc. in relation to it.


Alignment icons

The first four icons on the bar align the appropriate edge of selected controls with that same edge of the master control. For example "Align with left edge" would move all the controls selected horizontally so all the left hand sides were in a vertical line with the left edge of the master one.

File:SDRaggedDRO.jpg

The figure shows the DROs just after drawing. They are then selected with the top one chosen last and Align Left Edge clicked. The result is below:

File:SDLeftJustDRO.jpg

You need to be slightly careful as if you align left and, say, top then all the controls will be on top of each other. If this happens by accident then you need to deselect them by clicking on a blank bit of screen, select them one by one and drag them apart.


Sizing icons

In the example the controls are different sizes. This would not happen if you had used the clipboard to duplicate them but it is easy to make them all the same width and or height as the master of the selection. The figures below show this done in two stages with the two "Make same.." icons.

File:SDSameWidthDRO.jpg Same width DROs

File:SDSameSizeDRO.jpg Same size DROs

The size of a control, other than a button, will determine the size of any text in it.


Spacing controls uniformly

Finally the "Equally space …" icons can be used to space the selected controls equally. The result of this is shown here:

File:SDSpacedVertDRO.jpg


It is worth spending a bit of time experimenting with these icons on different types of control to get a feel for what can be done to make a neat layout with very few clicks of the mouse.

You should get into the habit of saving your layout frequently as the current version of the Screen Designer has no Edit>Undo facility.

You are strongly advised to save any changes in a layout with a name of your own choosing. If you just change 1024.set then, as this is replaced at each Mach3 upgrade, you will lose your changes.


Properties of other types of control

Now work your way through the different types of control and by inspecting the properties of examples of each type you will be able to see how Mach3 standard screens are built.


User LEDs and DROs

User defined LEDs and DROs are setup with values 1000 to 1254 in the OEM code field.

You can, for example, set the number of lines to be displayed in the G-code window and that, together with the size of the window, will define the text size.

Notice that DROs have a hotkey associated with them. When this key is pressed when Mach3 is running the appropriate DRO will be selected for data input. This is very useful in systems that are run without a mouse.

Some controls are very simple (e.g. the joystick ball) while others are complex (LEDs are different colors, can flash etc.).


Properties of Intelligent Labels

If a label has some reserved text in it then this text is replaced when Mach3 runs by information about what is happening (e.g. the name of the part program which is loaded).

The following intelligent labels are defined in the current version:


System labels

  • File (the part program)
  • Error (the last Mach3 error message)
  • Mode (the current modes of the system)
  • Profile (the name of the current profile file)
  • RADDIA (the word Radius or Diameter depending on Turn setting)
  • UNITREVMIN (the units in use and wheter feed is per rev or minute e.g. Inch/Rev)
  • COSYS (the name G54, G55 etc of the selected work offset system)

Note: The intelligent label name text is case sensitive. For example "FILE" displays the word FILE but "File" displays the current part program's file name.


User Labels/Tickers

UserLabel1, UserLabel2, etc. UserLabel10, up to UserLabel255

Ticker1 up to Ticker255

These display the text set by VB Script calls to SetTicker and SetUserLabel. The difference is that a Ticker scrolls the text so that a small control can display a long message.

DRO groups

Mach3 is designed so it can be operated without a mouse or other pointing device although if one is provided it will probably be best to use it.

DROs can be selected by a hot key and the cursor keys can be used to move around them. To make this as convenient as possible they are combined into groups. Left and right keys go from group to group and up and down keys move within a group. The Grp icon in Screen Designer allows you to allocate a group number to a multiply selected group of DROs.


Use of Bitmaps

The location of the file containing a Windows bitmap is given in the setup dialog for bitmap buttons and for background bitmaps. All files must be in the Mach3 Bitmaps folder or in folders below it in the tree. It is convenient to group all the bitmaps for a custom layout in a folder within Mach3\Bitmaps to make them easy to maintain and to distribute to other users. Screen Designer will always store the path relative to Mach3\Bitmaps in the layout file and it is this path that is displayed in the dialog after you have used Browse to locate a bitmap file. This can be seen in the illustration of Cycle Start properties, above.

"Bitmap" files can in fact be in .bmp, .jpg or .wmf format. .wmf (Windows metafiles) have the advantage that they are a vector format which will scale without producing jagged lines.

There is a special colour that will be displayed as transparent in Background Bitmaps. This will allow you to see other components through the Bitmap. The bitmap needs to be created in 24 bit RGB mode and the transparent colour is (254, 254, 254). Most "Photo" type programs allow you to specify an RGB color numerically like this by one of the options in the color picker dialog.

N.B. the current Screen Designer will not show the bitmap as transparent. This only happens in Mach3 itself. Transparency only works in the current version for .bmp files (not JPG or WMF).


Bitmap buttons

A bitmap button can be used in place of any normal button to give emphasis to the function of the button. Here is an example.

File:SDBitmapButtons.JPG

Bitmap buttons when created are empty and transparent. In Screen Designer a black border is drawn but such a button will be invisible on the screen when Mach3 is running. Such a button can be though of as a "hotspot" on the screen with its function being indicated on a background bitmap below it. An example is given in the next section.

Visual grouping with bitmaps

A set of related DROs buttons LEDs etc. can be placed "in" a frame or bezel by placing a suitable bitmap "underneath". A example is shown here:

File:SDSampleBitmapFrame.jpg

You should complete the placing of the controls before drawing the bitmap as it is more difficult to select the handles to resize the controls when the bitmap is present.

Screen designer provides two options on the Edit menu to assist with bitmaps as backgrounds.

Edit>Paste Exact pastes an object in exactly the same place on a screen as the place from which it was Cut or Copied.

If you wish to change the size or position of controls on a bitmap then you can cut it and paste it temporarily on an unused screen. Now move the controls and when finished you can Cut from the temporary screen and Paste Exact to restore the position of the bitmap.

If you want to make big changes to a screen then you might cut and paste all the bitmaps to the temporary screen at one time.

After re-pasting bitmaps back to their proper place they will of course be on top of the layers of objects. Edit>Bitmaps to Back allows you to put all the bitmaps on the current screen behind the other controls.

You can use one bitmap file for many backgrounds or bezels. A basic size of 100 pixels square works well for coloured backgrounds.

Stretching a square bezel to become very long and thin will distort the width of the border so you might need to have more than one basic shape. Try to minimise the different styles and colour schemes or your screens will look cluttered and be more difficult to use.


Identifying controls by the background bitmap

Although the controls in Screen Designer are quite flexible, you can achieve an even more interesting presentation by putting all the graphic detail in a large background bitmap.

File:SDKenBellSim1.jpg

The figure above illustrates a prototype of such a screen (courtesy of Ken Bell). In such a design the DROs, labels, LEDs etc. are real Mach3 controls. The graphics for the buttons are in the bitmap but have empty bitmaps drawn over them to define the "hotspots". When you "mouse-over" a button the cursor changes to a hand so indicating the presence of a button.

Another advantage of this type of screen design is that it is fully scalable to different screen resolutions using ScreenTweak as it does not have the problem of the fixed size text of conventional buttons.

Dynamic changes with bitmaps

The Screen Designer does not copy the bitmaps when you place them on the screen at design time; it just sets up a link to the image file path relative to the Mach3\Bitmaps folder. The bitmap is loaded when Mach3 itself is run. This means that you can replace the bitmaps with ones of your own design and by giving them the names used by the original designer of the screen you can customize the appearance of your system without having to run Screen Designer or having to place or size the bitmaps. The figure below shows a more subtle frame to the DROs than the one given above.

File:SDSampleBitFrameSubtle.jpg

Advanced features for setting up controls

The Cycle Start properties screen shot shows several other features of the dialogs for setting up buttons. Similar features exist on the dialogs for other controls.

Positioning: The position of the top corner of the control and its size is given in the dialog. If you click the Enable Input button then this data can be altered and the new size and position will be applied to the control when OK is used to close the dialog.

Original size: The Button will be bitmap's original size checkbox on the dialog for bitmap buttons and a similar one for bitmaps allows the size of the control to be adjusted t the number of pixels in your bitmap as it was originally created. This option can be used with the option to specify a new position. If this is not used then the top lefthand corner is not altered.

As you can only change the size and position of a control that is on the screen's visible area, you need to be careful with the values that you enter. In an emergency you can move any controls that lie partly off a 1024 x 768 screen to a visible position using Edit>Retrieve Off-screens. This will also reposition controls intentionally placed just off the page such as labels that start with § used to identify screens to ScreenTweak.

Locking: The Locked for Mouse checkbox allows you to lock the control so that it cannot be moved or resized by the mouse or be nudged. Double-click will still be available to reset its properties.

You can also lock all the selected items on a given screen using Edit>Mouse-lock all selected.

You can unlock all the locked controls on a screen using Edit>Clear Mouse-locks.

Colors

The Screen Designer Clr icon lets you define the colour scheme for your screens and controls. This is a global setting; it does not relate to the selected items.


Implementing two levels of screen complexity

It is clear that some users will require a full range of controls on a screen while others will find a machine easier to use with only the bare minimum of controls displayed. This requirement can easily be met by designing two (or even more) screen sets and setting up a profile to load each from its own shortcut.

On occasions, however, it is convenient to be able to switch the level of complexity dynamically. This is done by having the two screen sets in the same folder and with the same name but distinguished by the extensions .SET and .SSET The profile will initially load the .SET file.

The switch between sets is achieved by a button on the screen(s) which calls the VBScript routine ToggleScreens.

You can see how this works on the standard mill screens by running Screen Designer of 1024.set and 1024.sset.