Image (value of type)

From JRapid

Jump to: navigation, search

image is a value of type.



Image is a built-in type used to create properties that store image files.

The image type properties behave very similar to file properties.

The only difference is that image files use a UI widget that shows the image instead of the file name as a link.

On top of that, properties of type image offer some extra features. The imagecopyof attribute is used for automatically creating copies of images from other properties, and in conjunction with the height and width attributes, may be used to store re-sized copies.

The width parameter may be specified by its own. This saves a copy of the image re-sized to the specified width and maintaining the aspect ratio for the original image. If both width and height are provided, the image is re-sized to the specified dimensions.

To read more about where and how image files are stored, refer to file.


    type= "image"
    imagecopyof = PROPERTY
    width = WIDTH
    height = HEIGHT


A simple example shows how easy is to get an image widget with file upload and download functionality in your form by just defining an image property.

 <entity label="Person" name="Person">
        <property display="primary" label="Picture" name="picture" type="image"/>
        <property display="primary" label="First Name" name="firstName"/>
        <property display="primary" label="Last Name" name="lastName"/>

The listing and form are generated with the default image widget.

Image property example‎

When using images, it is a common practice to create different size thumbnails to be used in specific places of your application. Lets add a property to hold a smaller thumbnail of the Person picture in the above example.

 <entity label="Person" name="Person">
        <property label="Picture" name="picture" type="image"/>
        <property display="primary" hidden="hidden" label="Picture" name="pictureThumb" 
                type="image" imagecopyof="picture" width="50" />
        <property display="primary" label="First Name" name="firstName"/>
        <property display="primary" label="Last Name" name="lastName"/>

Note that the new pictureThumb property is of type image too and it specfies the property of which it should be copied with the imagecopyof attribute. A width parameter is also provided in order to set the dimension of the copied image.

The pictureThumb property is set as hidden so that it is not shown in the form, but it is set as display primary so that it is shown in the default listing.

The resulting form and listing look the same as the previous example, only the pictures in the listing are now using the thumbnail files.

Imagecopyof property example‎

See also

Personal tools