A field in a table may contain an image or the file location of an image (an image reference field). This example shows how to display these two types of images.

The default Display Mode for image files on reports is "Absolute". This mode prints one picture pixel per printer pixel. The result will typically produce a print image smaller than you desire.

A common web application requirement is to allow users to upload and view images. This example provides a simple model that you can start with.

Specify if the image should be base64 encoded and embedded directly into the HTML.

Many developers want to create display multiple thumbnail images on a page, then allow the user to select one image to see it in a larger format on a second page. This tutorial describes the process of creating these pages.

When you place a marker on a Google Map, you have full control over the icon that is used. You can specify an expression that evaluates to the icon name to use for the marker. Or, you can specify an Xbasic function that will get called for each row in the Grid. The function can compute the marker icon based on the data in the current Grid row.

The owner-draw list boxes that we have shown so far have all used a single image in the list box. In a practical application, you will want to use multiple images in a list box, with the bitmap associated with each row of the list box determined dynamically, based on the text in the row.

Xdialog allows you to place images on dialogs. You can place the images on the dialog background, on a button, next to an element in a list box, and so on. This lesson discusses some of the ways in which you can work with images.

You can define image maps for images that are displayed on an Xdialog with the {image} command. The image map defines rectangular areas on the image, the icon to use when the mouse is over the defined area and the event name to fire when the user clicks on the defined area. In the sample shown below the image map has four defined areas. If the user moves the mouse and clicks on one of the squares in the image, the 'value' variable will be updated to reflect the name of the square the user clicked on and displayed in the input area.

An image can contain multiple sub-images. For example, the Alpha Anywhere system image called 'filebox' contains sub-images. The following script displays a dialog showing the 'filebox' image: