:: Home >>

Images

Using images in AW grid and other AW controls requires defining them first in CSS file. You have to choose a name for each image and declare a CSS class which links each name to the particular image file (or region inside the image file). The CSS class is composed of aw prefix, image in the middle and the name at the end - .aw-image-name. For example,

.aw-image-home      {background: url(home.png)}
.aw-image-favorites {background: url(favorites.png)}
.aw-image-search    {background: url(search.png)}
.aw-image-fontsize  {background: url(fontsize.png)}

It is possible to put all images into one big file (easier for pre-loading) and use x-y offsets to address required part of the image -

.aw-image-home      {background: url(icons.png)  -40px 0px;}
.aw-image-favorites {background: url(icons.png)  -80px 0px;}
.aw-image-search    {background: url(icons.png) -120px 0px;}
.aw-image-fontsize  {background: url(icons.png) -160px 0px;}

After the images are declared in CSS you can assign them to the cells with setCellImage() method.

obj.setCellImage("favorites", 1, 1);

You also have to use the cell template which displays images - the default one, AW.Templates.Text, does not.

obj.setCellTemplate(new AW.Templates.ImageText, 1);
obj.setCellTemplate(new AW.Templates.Image, 2);

Comments

9 Sep 09
Image with hyperlink Emmanuel (5)
4 Feb 08
When image names are not known... (1)
20 Feb 07
Setting small images so they do not repeat Chris Coulthard (0)
14 Jun 06
how do i add an image to the first column based on cell value? loo (2)

Comments will appear on this page and in the main forum.

Documentation:

Recent changes:

2.5.0 - 2.5.5
2.5.5
2.5.0 - 2.5.4
2.5.4
2.5.0 - 2.5.3
2.5.3
2.5.0 - 2.5.2
2.5.2
2.5, 2.5.1
2.5.1