Use dynamic image in a list view

Hi,

I want to use a image media at the begin of all record of my list view.

The problem is that image can take to positon ( red.jpg or green.jpg to simplify).

Actually i use a image media and I give it the name : “image_logo”
And when i change this image on selection record, this action change all “image_logo” of all record in my lsit view :confused:

How can I make a script for each record in my list view to change only the element I selected?

Thanks

Hi chgog (?)

You can’t exactly do what you want. A calculation can’t tell if he is in a record that is selected.
What you can do however is making use of the rowBGColorCalculation form property.
Here you point at a calculation that returns a color code that Servoy uses to color the row with. This way you can create odd/even colored rows but also give a selected row a special color.
How does this work?
Servoy passes 2 arguments to this calculation. The index of the record and if it’s selected.
Note: these parameters are only passed when you add this calculation to the aforementioned form property. Normally calculations don’t get any arguments past.

Here is an example of a rowBGColor calculation I use.

var index    = arguments[0];
var selected = arguments[1];

if (selected){
	return "#3D80DF"; // yellow color for the selected row
}else{
	if (index % 2 == 0)//alternate even/odd
	{
		return "#EDF3FE"; // blue-ish color for the even rows
	 }else{
		return "#FFFFFF"; // white color for the odd rows
	 }
}

Hope this helps.

I already use Calculation to use alternative color in the list view and it work very fine :)

But i can’t change the source of a image on this record with:

elements.image_logo.setImageURL(“green.jpg”);

Calculation is only for BGcolor of row?

chgog:
Calculation is only for BGcolor of row?

When used in the rowBGColorCalculation form property. Yes.
Btw, you can’t set properties of elements in a calculation. Only in methods.

Ok and i can call a method in calculation?

Nope, not possible.
You could do something with the onRecordSelection form event.
Like letting it trigger a method that fills a global variable with the PK of the selected record.
And on the record you have a calculation that checks the value of this global field with it’s own PK value. When matched then use image X, else Y.

Hope this helps.

Ok.

last question and i let in peace :)

the model of my list view have:

  • a image, named : image_logo (not saved in database, just show in interface)
  • a Field, name : company_name (save in database)

If I have 3 records in my table, ma list view show me correctly 3 records with a picture (image_logo, always the same picture, it’s logical) and the name of company (company_name, from the database).

But if i want to change the picture of the second record and i do on the “onRecordSelection”:
elements.image_logo.setImageURL(“green.jpg”);

it’s not only the picture of my second record who change, but the picture of my 3 records.

It’s logicial because the 3 images have the same name.
So how can name the image in the model of my list view dynamicly?

When I worked in web development, in this situation, if a was in while, to name dynamily the object I used:

perhaps there is something like that in servoy?[/code]

Hi Fabien,

What you need is an unstored calculation of returned type “MEDIA”.

Lets assume you have created a global field named ‘currentPK’ of the same type as your PK field of the table.
And lets assume you PK field name is myPkField.
Then you use the following calculation:

if (myPkField == globals.currentPK )
{
    return "media:///green.jpg";
} else {
    return "media:///red.jpg";
}

Now replace your image with this calculation field on your form (make sure the display type is IMAGE_MEDIA.

Now create a form method that you connect to the onRecordSelection event.
In this method you do nothing more than this:

globals.currentPK = myPkField;

And that’s it.

Hope this helps.

Perfect ! :D
Exactly what I need.

Thanks a lot !

Hello,

Is it possible to extend the calculation so that it basically mimics the typical bgcolor calc? That is, something like:

var index = ?????;

if (myPkField == globals.currentPK ) 
{ 
    return "media:///yellow.jpg"; 
}
else
{
	if (index % 2 == 0)
	{
    	return "media:///white.jpg";
	}
	else
	{
    	return "media:///blue.jpg";
	}
}

I don’t know what I could use to represent the record index. The reason I’d like to do this is to completely hide the black vertical line that designates the current record. I wish there was a form property to allow us to hide it.

chartpacs:
I wish there was a form property to allow us to hide it.

So do I. In the meanwhile, as you already probably know, you can simply place something (field, rectangle, image) on the extreme left of the body part of your listview and it will cover the black record selector… or even better… switch to tableview as they are also more web-client compatible…

FWIW, I recently submitted a support ticket asking the following:

Hello,

Would it be possible to add a form property that allows us to hide the black vertical line that designates the current record in list view? It’s just unattractive from a GUI standpoint. I prefer to use highlighting to designate the currently selected record.

Unfortunately, here was the response from Servoy:

Status: closed-won’t fix
Resolution:
place something non transparent on top (or in case of a multiline portal set vertical lines off)

Bummer. I wonder how difficult it is technically to add this form property. Oh well…