insert images according to the definition (array)

[Stephdidou]

I'm making a small and funny dictionary.

So far, I've got a search bar. When the user enters a word he's got the definition. I'm wondering if it's possible to associate an image to a definiton.

Here's my code :

public class Main extends Sprite{  
private var ac:AutoComplete; 
private var conteneurImage:Loader = new Loader(); 
private var image:URLRequest = new URLRequest("images/tannoy.gif"); 
conteneurImage.load(image); 
private var fruitArray:Array = [ 
{label:"A bloc", Type:"Très fort", Description:"une boîte de achards"}, 
{label:"A fond", Type:"vie", Description:"Loulou"}, 
{label:"dfgdf", Type:"à grande vitesse.", Description:"Indique une vitesse"}, 
private var bg:Sprite; // A couple of TextFields 
private var t1:TextField; 
private var t2:TextField; // An input TextField to show our search results 
private var it1:TextField; // A couple of TextFormats 
private var titleFormat:TextFormat; 
private var titleFormatW:TextFormat; // Two variables to hold our x and y positions 
private var xPos:int; 
private var yPos:int;   // Whenever we need to see the List component which is part of the AutoComplete class, an event is dispatched by the AutoComplete class and is picked up in the ListDepth function // This takes our instance of the AutoComplete class - ac - and moves it to the highest available depth, which is the numChildren ( all the elements on stage ) - 1. 
private function listDepth(e:Event��void{ setChildIndex(ac, numChildren - 1); }  // This function is also a response to an event dispatched from the AutoComplete class. It takes the results, or lack of them, and displays that information in our it1 TextField 
private function setDisplay(e:Event��void{ 
var fIndex:int = ac.aIndex; 
if(fIndex == -1){ it1.text = ac.noResult; it1.setTextFormat(titleFormat); }
else{ it1.htmlText = "<b>Définition rapide :</b> " + fruitArray[fIndex].Type + "<br/><br/><b>Définition complète:</b> " + fruitArray[fIndex].Description; it1.setTextFormat(titleFormat); } }

So, do you think it's possible to associate an image with a label ?

Something like

 <img src="smiley.gif">

or in

it1.htmlText = "<b>Définition rapide :</b> " + fruitArray[fIndex].Type + "<br/><br/><b>Définition complète:</b> " + fruitArray[fIndex].Description;

maybe add a code that tells to go search an image in this line.

How do you think I can do that ?

Thx

[moccamaximum]

Not sure what you exactly mean.

Could you provide a visual mockup how you want things to look in the end?

[Stephdidou]

Sorry if I wasn't clear. You're right, with images, it'll be clearer.

For the moment, I've got this :

I can search a word

When I click on it, I've got the definition

Is it possible to, also, have an image corresponding to the definition ?

So, each defintion has a different image.

Maybe I can put it in my  fruitArray:Array ?

Thank you for your help,

[moccamaximum]

Use ImageCell

[Stephdidou]

The link doesn't work

[Stephdidou]

I've search on the web. I don't really understand how it works. Can you give me a small exemple please?

[moccamaximum]

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/fl/controls/listClasses/ImageCell...

Specifically:

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/fl/controls/listClasses/ImageCell...

in the LOC where it says:

var possibleSources:Array = [ RedBox, GreenBox, BlueBox ];

simply substitute a bunch of image file names you have where the swf is exported

then add them to the DataProvider:

dp.addItem( { label:"first itel", source: possibleSources} );

you can totally leave out the part where the example says:

import flash.display.Sprite;  class RedBox...

Here is an even better tutorial:

http://www.adobe.com/devnet/flash/quickstart/tilelist_component_as3.html