all groups > flash actionscript > march 2005 >
You're in the

flash actionscript

group:

using combo box


using combo box livingwithanangel
3/2/2005 10:08:20 PM
flash actionscript:
I wish to create a combobox that lists street names. When a visitor to the site
clicks on the combobox and scrolls down to a street name and clicks, I want the
street name on the map below to be identified by a colour change. The way I see
doing this (and I may well be going the long route here, please feel free to
correct me) is to make the street names goto a frame or scene when clicked on
on mouseover. There will be 90 names. I'd appreciate any help anyone can give
on this....thanks! Actually, would it be possible to have the mouseover on the
street name show/hide a layer? That would work better for me, if it's possible.
Re: using combo box rlc5611
3/3/2005 2:42:55 AM
If it were me, I would not take that approach. I would prefer to work with
movie clips. The attached code is written for MX 2004 just to illustrate
another possibility. To use this script, all you need to do is place the UI
combobox on the stage of a new move and delete it just to make sure it is in
the library. Then copy all this code into a blank keyframe of a single frame
movie and test it. You cannot show/hide layers because they do not exist in a
published movie. It is much easier to show/hide movie clips (i.e. _visible = 0
or 1). This script just draws some lines to emulate streets. In your movie, you
would already have the streets so this is just for illustration.

this.attachMovie("ComboBox", "mybox", 0, {_x:400, _y:20});
mybox.setSize(100, 18);
mybox.setStyle("fontFamily", "Comic Sans MS");
mybox.setStyle("color", 0x009900);
mybox.setStyle("fontSize", 8);
mybox.setStyle("backgroundColor", 0xE6FFEF);
mybox.setStyle("themeColor", "haloOrange");
mybox.dropdown.rollOverColor = 0x006600;
mybox.dropdown.textRollOverColor = 0xFFFFFF;
mybox.dropdown.selectionColor = 0x009933;
mybox.dropdown.textSelectedColor = 0xFFFFFF;
mybox.dropdown.borderStyle = "solid";
mybox.dropdown.borderColor = 0x009900;
mybox.dropdown.rowHeight = 13;
mybox.dropdown.fontSize = 8;
mybox.dropdown.color = 0x009900;
mybox.dropdown.fontFamily = "Arial";
mybox.dropdown.textDecoration = "underline";
mybox.setStyle("alternatingRowColors", [0xD5FFE3, 0xE6FFEF]);
_global.streetnames = new Array();
streetnames = ["Elm", "Maple", "Kinkead", "Lecta", "Greenwood", "Grand",
"Rogers Avenue"];
for (var i = 0; i<streetnames.length; i++) {
// populate the combobox
mybox.addItem(streetnames[i], streetnames[i]);
// create "streets" just for purpose of illustration
this.createEmptyMovieClip(streetnames[i],
substitute_for_getNextHighestDepth_for_use_in_MX(this));
this[streetnames[i]]._x = 50;
this[streetnames[i]]._y = i*20+50;
this[streetnames[i]].lineStyle(5, 0x999999, 100);
this[streetnames[i]].moveTo(0, 0);
this[streetnames[i]].lineTo(200, 0);
this[streetnames[i]].my_original_color = 0x999999;
this[streetnames[i]].my_message = "hi";
// apply a rollover action to each street
this[streetnames[i]].onRollOver = function() {
// temporarily change the street color
mycolor = new Color(this);
mycolor.setRGB(0xFF0000);
// display the streetname in the combobox too
for (var j = 0; j<streetnames.length; j++) {
if (this._name == this._parent.mybox.getItemAt(j).label) {
this._parent.mybox.selectedIndex = j;
break;
}
}
};
// what to do on rollout
this[streetnames[i]].onRollOut = this[streetnames[i]].onDragOut=function () {
mycolor = new Color(this);mycolor.setRGB(this.my_original_color);};
}
streetselect = new Object();
streetselect.change = function(evt) {
// if a previously selected item is hilited, restore it to its original color
if (comp<>undefined) {
mycolor = new Color(comp);
mycolor.setRGB(_root[comp].my_original_color);
}
// hilite the item selected from the combobox
comp = evt.target.selectedItem.data;
mycolor = new Color(comp);
mycolor.setRGB(0xFF0000);
};
// attach listener to combobox
mybox.addEventListener("change", streetselect);
// function to find non-conflicting depths in case this is for MX rather than
MX 2004
// in MX 2004, you can simply use getNextHighestDepth() prebuilt method.
function substitute_for_getNextHighestDepth_for_use_in_MX(mypath) {
if (mypath.highestDepthSoFar == undefined) {
mypath.highestDepthSoFar = 0;
for (obj in mypath) {
if (mypath[obj].getDepth()<>undefined) {
mypath.highestDepthSoFar = Math.max(mypath.highestDepthSoFar,
mypath[obj].getDepth());
}
}
}
mypath.highestDepthSoFar++;
return (mypath.highestDepthSoFar);
}
AddThis Social Bookmark Button