View Full Version : FListBox - rollOver, rollOut and Double Click

03-27-2003, 09:48 AM
Hi All,

I have a couple of questions here.

1) Is it possible to call a function on rollover and rollout of items in a list box?

2) Is it possible to capture a double click on selection a item in the list box?

Can anyone help me with these two problems? I need to achive this functionality in the listbox.

Thanks for your time

03-30-2003, 06:37 AM
Yes. Find the FSelectableItem in your library:

Flash UI Components > Core Assets - Developer Only > FUIComponent Class Tree > FUI Component SubClasses > FSelectableList

In the init() function, place the code for your handlers:

this.onRollOver = function() {

this.onRollOut = function() {};

This function will obviously apply to all items, so you'll have to have to use the itemNum variable to create different actions (if needed).

For a double click, find the setSize method in the same symbol and change the highlight_mc.onPress (around line 65) to be:

this.highlight_mc.onPress = function()
if (this.controller.enable && (getTimer() - this.firstClick < 1000)) {
this.controller.controller.clickHandler(this.contr oller.itemNum);
this.firstClick = getTimer();

04-03-2003, 04:16 AM
Sorry to barge in, but its kind of related.

Is it possible to get the hand to show (when over the listBox) instead of the arrow?


04-03-2003, 12:26 PM
Somewhere in the code you'll find:

xx.useHandCursor = 0;

(xx will be an instance name)

Do a search for "useHand" and you'll find it. Comment this line out and you should get the hand back.

04-03-2003, 01:58 PM
Thanks, Worked like a charm.

04-04-2003, 09:29 AM
Thanks a ton tyard, It works .

What I want to know is how to apply this only to a single component. Or make a custom component so that it does not effect the default functionality of the other components. As I am using list box component in more than one instance. It will not be fesable to edit the actual component itself. Any work around for this.
A custom component with change handlers for on RollOver, onRollOut and, double Click. Where we can set the change handlers from outside insted of defining them in the FSelectableList.

I am not much of a programmer and I do not know how to create custom components I am strugging to get these things to work.

Can you pleas help me with this, how do I go about making a custom component with (rollOver, rollOut and double click) functionality. I would be really greatful for all your help.

Thanks a lot for your time.

04-06-2003, 12:18 AM
Well, I believe you could just extend the component with another movieclip. Just conjecturing, but try to create a new symbol in your library (duplicate the ListBox component symbol so you have all of its contents) and use code like this inside:

#initclip 3

myListBox = function() {

var p = myListBox.prototype = new FListBoxClass(); // not sure of the Class name, so double check

p.onRollOver = function() {
// new code

p.onRollOut = function() {
// new code

p.onPress = function() {
// new code

Object.registerClass("myListBox", myListBox);

delete p;


Be sure to export the symbol as "myListBox". This should create a new symbol that inherits everything from FListBox so you can safely overwrite certain methods.

Again, I'm writing off the top of my head, so this isn't guaranteed to work as written, if at all. It's just a possibility.

04-08-2003, 12:03 PM
Thanks tyard,

I still need to work on that, but what you have suggested makes sense Will get back to you if I face any more problems :) Thanks again for all the help.


09-08-2003, 11:19 AM
Here is an example:
All I wanted was a rollover movieclip that shows a fading in.
Step 1:
Duplicate FListBoxItem in library and call it FCUstomItem (or anything else).

Create a movieclip (instance name rollOver_mc) as follow:
- first frame : empty,
- next 4 frames have a fading in.
action for frames:
- frame 1: stop();
- frame 5: stop();
Add this mc into the FCustomItem into a new layer. (make sure the registration point is at the right place so the width will match the listbox).

Step 3:
The class is extended by adding the following code in the FCUstomItem action layer :

#initclip 3
EXTENDS FSelectableItemClass
This is a customized LIst Item.
function FCustomItemClass() {
FCustomItemClass.prototype = new FSelectableItemClass();
Object.registerClass("FCustomItemSymbol", FCustomItemClass);

// code for rollOver
FCustomItemClass.prototype.onRollOver = function() {
this.rollOver_mc._width = this.fLabel_mc._width+this.icon_mc._width+15;

step 4
Do not forget Linkage Id for FCUstomItem symbol. Go to the library. Right clik on FCUstomItem, clik on linkage, type in identifier:FCustomItemSymbol and check Export in First Frame.

Hope this helps.

09-08-2003, 11:51 AM
Sorry about that - You do need to add your onPress function for it to work.

09-08-2003, 12:53 PM
Here is a correction:
Instead of the previous code, delete this:

FCustomItemClass.prototype = new FSelectableItemClass();
Object.registerClass("FCustomItemSymbol", FCustomItemClass);
FCustomItemClass.prototype.onRollOver = function() {
this.rollOver_mc._width = this.fLabel_mc._width+this.icon_mc._width+15;

and add this into the FCustomItemClass.prototype.displayContent function:

this.onRollOver = function() {
this.rollOver_mc._width = this.fLabel_mc._width+this.icon_mc._width+15;
this.onPress = function() {
// replace your with own code here
// I have my listbox getting URLs
this.getURL(myItem.urls, "_self");

09-08-2003, 01:20 PM
On more correction. on the onPress event, you need to replace the code by:

this.onPress = function() {

if data is url links or whatever your code needs to be.

Next time I'll try to post the correct code right away instead of in three posts. SORRY!

02-06-2004, 12:34 AM
hi, i am begginer,
i wanna hadle flistbox in detail,
but, i don't find "Core Assets - Developer Only" UI Componet.

does anybody tell me where it is..

my english is poor, sorry.

02-06-2004, 12:42 AM
Howdy and Welcome... :)

It's in the library... Open up the new Flash movie... and open up the Library window...
Drag the FListBox component onto the stage... Now, you will see a new item in the Library window... Navigate through the Library window to see what you are looking for... :)

02-06-2004, 12:49 AM
thanks, CyanBlue!

i found that.

i try assemble flash and Vc++ application.
so, i dont know flash deeply.
i started just 1weeks ago.

thanks one more..^^

i like this site..

its useful for me.


02-06-2004, 01:06 AM
Hey, no problem... Stop by from time to time... :)

02-06-2004, 04:20 AM
i wanna make list icon, beside listitem.

Using FListBox..

im going to make MSN buddy list using flash.
who can tell me some advise?

i don't make icon beside useritem.
that is very difficult to me...


02-06-2004, 12:23 PM
See this page...

red penguin
02-06-2004, 12:48 PM
@ kim,sunghyun:

Why did you report this thread?

02-08-2004, 02:49 AM
yup, am joining red's question

09-08-2004, 10:37 PM
Yes. Find the FSelectableItem in your library:

Flash UI Components > Core Assets - Developer Only > FUIComponent Class Tree > FUI Component SubClasses > FSelectableList

In the init() function, place the code for your handlers:

this.onRollOver = function() {

this.onRollOut = function() {};

Tried this, and it works fine. The only problem is that it seems to override the onRollOver somewhere else in the inheritance chain with the effect that I can't select the items any more. At least that's what I think happens.

Do I need to add something like super.onRollOver() in my custom handler, or is there any workaround?

02-14-2005, 05:13 PM
I agree with cip22. I cannot get the listBox to work properly after I redifine the onRollOut and onRollOver methods. All I want to do is add a specific behavior to the mouse pointer being over the listBox as a whole, but I don't want to affect the actual functionality of the listBox component. After adding my code, I notice that what I added works fine, but I can no longer use the listBox - it does not respond to mouse clicks or scrolling. And adding calls to super.onRollOver (as you would do when overriding methods in any other language) has no effect. Any help? Thanks a bunch!

02-14-2005, 06:05 PM
I have made changes in the list box without any problem using CyanBlue link to Macromedia. Here I load the text from a text file but I load it from a database in my project.
blue line between the list items
icon left of text
rollover in blue
long text allowed with rollover

I could email you the fla if you want - it is too big to put here (148 kb)

04-08-2005, 05:56 PM
Cyanblue or flashdudette, I used yours commento to add to my fla, but in my case don't function. I extract the Labels and data from a xml file, and then with for I append the data, and with list.setChangeHandler("openDetailCli"), I call the function openDetailCli, all the data is in arrays.
In yours examples with onPress call a getURL, but when I call the function openDetailCli , don't respond the function.
Any suggestions.
Thanks in advanced.

04-08-2005, 06:26 PM
Howdy and Welcome, crowcyber... :)

Can you post the sample so that we can take a look???

04-11-2005, 04:09 PM
It would be good if you could upload the file so we can look at it. I have everything work fine in my example. If you want I can email it to you. You can pm your address. :)

10-01-2007, 04:24 PM
I also have a question regarding "customizing the FListBox", hop it doesn't bother you guys that I post it in this thread because I think it may be linked.
The thing is I would like the items in the listbox to be draggable, so that I can reorder them.
At the same time I want to implement another listbox which shows items that are draggable in the first listbox.
This has to work somehow, but since I'm new to flash and I can't find any tutorials about this in the internet - I have to ask you.

I really appreciate your time trying to help me,
thanks already


10-01-2007, 04:59 PM
Hey Cyanblue, how are you doing my friend? I havn't coded in Flash for 2 years now so I'll let you answer the question. PM me if you have time. :)

10-01-2007, 05:07 PM
What's happening, flashdudette... ;)

What versin of Flash do you use MarcO??? There are some customization you can apply, but yours sounds like it's whole lot better to create your own... I don't have much experience with creating a new component, so I can't really help you much there...