The Paperless Push

On my last blog, I wrote about Pesto Garden, Inc., and how to build a bathroom quality control inspection system. I mentioned that I would continue tweaking that app, but I feel like tackling something more interesting today: buttons. Today, I am going to dive into button controls…how to build buttons and assign them actions on an Adesso form. This will be part 1 of 2 (or 3) parts. This first part we will review the button designer and what you can do with it. In part 2 of this blog series, I will show you some real buttons in real applications that I have built, and what actions those buttons perform under the hood.

Where are button controls found?
To create a button in Adesso, you must first create a form. Once you have built a form from the form designer, simply click a blank row and select “Button” from the popup list. A screenshot of this is illustrated below.

Once you select “Button” from this popup menu, your screen will look like the following:

While this window appears simple enough, there are quite a few controls here. Notice that there are two tabs: an ‘Action’ tab and an ‘Appearance’ tab. The Action tab is exactly that…specifying the action that a click on this button will perform. The appearance tab specifies what the button will look like. We’ll take a look at the action tab first.

Action Tab
The two main items on this tab are the Type dropdown menu, and the action menu. There’s also a field to specify what the label on top of the button should read, and something called a Tag. Lets first look at the Type dropdown.

Type Dropdown
The Type dropdown menu has three different values in it:

* Standard
* Hyperlink
* Image

When you first create a button control, it will default to Standard.

* Standard buttons are exactly what they sound like…basic buttons with some basic color and appearance settings found on the ‘Appearance’ tab.

* Hyperlink buttons are simply links, that when clicked on, navigate to a particular URL or perform some action specified in the Action dropdown.

* Image buttons are button controls where you can specify images for two separate states of the button: when inactive, and when a user clicks, or presses on it. Adesso comes with several button images stored in folders, and you can drop additional images in those folders, or navigate to your hard drive to select a specific image. Images can be anything…rectangles, arrows, icons, etc.

If you select Image from the Type dropdown, two additional parameters will appear in your window, as illustrated below:

The two additional parameters are Regular and Pressed. Regular means what the button looks like in inactive state. Pressed means what the button looks like when a user clicks or taps on it, and remains that way while the button is pressed, then reverts back to Regular once the user releases the button. There is an icon with three dots to the right of each dropdown. If you click on that icon, a navigational window will appear that will allow you to navigate through your hard drive to find and select an image. The dropdown will display recently used images for faster selection.

Standard Image Folders in Adesso
When you first install Adesso, two image folders will install on your computer. These are found at the Application level, typically at c://Program Files/Adesso Systems/Adesso/ What you will find are two folders, labeled ButtonShapes and ButtonShapesPressed. See screenshot below:

If you open the ButtonShapes folder and view the items, you will see the following default button images:

Now, don’t get me wrong here, these are not just ugly images, they are FUGLY with a capital F. However, what you need to understand here is that these are simply basic button images in folders…yes, folders. What this means is that if you have your own graphic-artist quality images that you want to use for buttons, just copy them into these folders, and presto! they will be available for your app right from here.

The ButtonShapesPressed folder includes very similar images, but with slightly different colors/gradients. By using these in pressed mode state, the user will see a slight change in the button when he clicks on it, giving the illusion of a click action. The screenshot below illustrates what the ButtonShapesPressed folder looks like.

Action Dropdown
The action dropdown is what I call the brains of the button controls. It is the part that does all the hard work. The other controls I consider to be window dressing. Let’s take a closer look at the action control.

When you click on the dropdown, you will see a series of actions that you can select. Your popup menu will look like the screenshot below:

Some of these actions are pretty obvious, so I won’t waste my time explaining what Zoom In, or Save Record mean. Ok, just in case, lets go thru some of these. When the user presses the button, the following actions are performed for the following actions listed in the dropdown menu:

Zoom In – the form zooms in one level from current level
Zoom Out – the form zooms out one level from current level
New Record – a new blank record is created for the table associated with the form
Delete Record – the current record in the table is deleted
Print – invokes the printer to print the form
Print Preview – duh
Help – opens the help files, same as selecting Help>Adesso Help (F1) from the Adesso menus
Duplicate Record – creates an exact copy of the current record. All field values are copied
Save Record – saves the current record to the database
Export Record – same as selecting Record>Export Record from the Adesso menu
E-mail Record – creates the form in HTML and invokes your email client
First Record – navigates to the first record in the table
Last Record – navigates to the last record in the table
Previous Record – navigates to the previous record in the table
Next Record – navigates to the next record in the table
Go to Tab – navigates to a specific tab on the form
Go to Field – navigates to a specific field on the form (regardless of what tab the field is on)
Go to URL – invokes your default web browser to navigate to a specific website
Run Plug-in – this is an important one: invokes a plugin to do something from the plugi-architecture section of Adesso, like print a Crystal Report, for example.
Read GPS – reads the GPS on the device…note: you need to specify the GPS port number in the Adesso Preferences
Copy Records – Copies records from the detail table to the parent table. Same as checking the copy records checkbox in a o2o relationship
Run Script – in the parameters field below the action, you can specify multiple actions (like Save Record and Zoom In, for example) Syntax of this script should be as follows:
Cancel – if I need to explain this one, then you shouldn’t be building applications
New One-to-Many Record – creates a new many record as long as there is a 02m relationship
New One-to-Many Record Using Tags – same as the action above, but uses the Tag identifier to determine which view and form to use (useful if you have more than one form per table)
Mark Binary for Download – marks the current record for download of missing binary files. Because you can define binaries to download on request (instead of always), you can use this action to do this for the current record
Unmark Binary for Download – opposite of the action above
Calculate Expression – this is an important one. You can create a field, insert an expression into it, and then use this action to run that particular expression. The expression can be anything…a calculation, for example.

I’m not going to show you each and every single action on this list…too much writing. I will show you a few that are more complex than your typical Save Record action, but I will leave this for another section of this blog, or maybe the next blog (depending on the # of bottles of Guinness in the ‘fridge). Let’s move to the other tab in the button designer.

Appearance Tab

If you select ‘Standard’ from the Type dropdown in the Action tab, the ‘Appearance’ tab will look like the following screenshot:

If you instead select ‘Image’ from the Type dropdown in the Action tab, the ‘Appearance’ tab will look like the following screenshot…notice that there are slight differences…The height and width are displayed in pixels. this is set up that way because we are using images instead of the standard rectangle for your button shape.

You will also see a preview of your button in the preview area on the bottom of the window.

Disable on Click
There’s an important feature on this screen…its called Disable on Click. It’s usefulness comes into play if you want to do something when a user clicks on the button, but you then want to de-activate the button after it is clicked once. To do this, simply click on the ‘Disable on click’ checkbox. you can also specify a color for the button and the text after it clicks.

Shape
Notice that there is a shape control in the center of the window. If you selected ‘Image’ from the Type dropdown on the Action tab, then all the shapes from the ButtonPressed folder will appear in this dropdown list, enabling you to quickly change the button image. This is handy if you are unsure of what shape you want to use. The preview screen refreshes once you select something from that dropdown. If you have a lot of button shape images, and you store them in that folder, they will always be available from this dropdown menu.

On my next blog I will show you some real buttons, what they look like on an Adesso application, and what they actually do.