Inventory Question

Hi Everyone,

I was wondering how to make simple "highlightable" buttons in an inventory. For instance, whe you click on a button in your inventory, your character holds that object (I already know how to do that) and highlights the object that you clicked on so that you know which ojbect you are holding. Then when you clikc on another object, it unselects the first object and highlights the second one.

Any Answers? (I know its simple, but I still don't know how)

Mr_Welfare
________________________
Flash MX 2004 Professional

code:

---

var lastInventory = null //set up a variable to hold the last pressed inventory button

//assuming that a selected item will jump to a selected frame.

on(release){

lastInventory.gotoAndStop(1) //non selected frame

lastInventory = this

this.gotoAndStop(2) //selected frame

}

---

You might want to chuck that in a for loop, to go through all your buttons, unless you are using one button and treating it as an instance.

Hope it helps

I think it's a bad idea to make inventory with the buttons :)

The better appearance to use movieclips as an inventory placeholders to store movieclips represents actual game objects. All other interactivity may be added through onRelease functions defined on this placeholders.

Actually inventory is not such simple thing as most ppl think. The good inventory is a rusult of a good planning and a right decision on how to store data.

You didn't specify which game type you're going to make, but if you planning to make some RPG game inventory it not so simple as you think :)

If you want, i can post here my appearence on Inventory problem, where the items is fully randomized and generated on the fly.

Yes sure if you could, could you post that?

(It is an RPG that I'm trying to make as well)

do you mean something like this.

http://csusap.csu.edu.au/~cfouls01/m...inventory.html

click the boxes to add and delete them from the inventory, when i find the .fla i'll post it up

Quote:

---

Originally Posted by mr_malee

do you mean something like this.

http://csusap.csu.edu.au/~cfouls01/m...inventory.html

click the boxes to add and delete them from the inventory, when i find the .fla i'll post it up

---

I liked the white one,
thats the secret one

the gradient one is my favourite. Its just so much cooler than the rest. :)

Anyway, i didn't find the .fla but i posted this code on another site, which is basically it.

code:

---

//create items on the stage 

var items = 10; 

for (var i = 0; i<items; i++) { 

   attachMovie("item", "item"+i, ++d); 

   var p = this["item"+i]; 

   p._x = random(400); 

   p._y = 100+random(300); 

   p.gotoAndStop(i+1); 

} 

//create inventory array 

var inventory = []; 

var inventoryOb = {x:30, y:30, w:25}; 

//check for mouse hit 

onMouseDown = function () { 

   var mx = _root._xmouse; 

   var my = _root._ymouse; 

   for (var i = 0; i<items; i++) { 

      var ob = this["item"+i]; 

      if (ob.hitTest(mx, my, true)) { 

         modifyInventory(ob); 

      } 

   } 

}; 

function modifyInventory(ob) { 

   var l = inventory.length; 

   for (var i = 0; i<l; i++) { 

      if (ob == inventory[i]) { 

         //item exists already, put the item back on the stage, and remove it from the inventory 

         inventory.splice(i, 1); 

         ob._x = random(400); 

         ob._y = 100+random(300); 

         for (var p = i; p<i+l; p++) { 

            //re-position other items in the inventory 

            var t = inventory[p]; 

            t._x = inventoryOb.x+(inventoryOb.w*p); 

         } 

         return; 

      } 

   } 

   //item doesn't exist already, place it in the inventory 

   inventory.push(ob); 

   ob._x = inventoryOb.x+(inventoryOb.w*l); 

   ob._y = inventoryOb.y; 

} 

---

Quote:

---

Originally Posted by Mr_Welfare

Yes sure if you could, could you post that?

(It is an RPG that I'm trying to make as well)

---

Ok.

The most important thing (as i wrote before) is to decide how we'll store inventory data. First of all we need to base our decision on the map format we use in order to implement in-game items with the map in easy way. I suggest you to use two dimesional array to hold all level data for your RPG game.

Now let's say we have a map array stored numbers, each one represent something in the game. Now, we need to define borders for our numbers pool. For example: number 0 - walkable area, numbers from 1 to 100 - walls, numbers from 200 to 300 - items, etc.

The main feature of all Dungeon Siege game is that all items is fully randomized and each time you pick up a new one - you're going to get different item from the one you've picked up on this point at the last time. How it can be done? I realize that the numbers we use to represent items on the map must define the item category only, and the rest of parameters the game engine generates when you picked it, and it's based on the item category and on game level.

When we find solution on how we'll store our data, we prepared to write some code. Let's make some class (call it "InventoryObject.as"):

code:

---

class InventoryObject {

	public var objType:String;			//	type: sword, shield, spear, book, scroll etc.

	public var objDescription:String;	//	short desription

	private var objOffensive:Number;	//	damage points when used to attack

	private var objDefensive:Number;	//	points absorbs when used to defense

	private var objIdx:Number;			//	used to generate object's name



	//	class constructor

	public function InventoryObject(whichType:String, objIdx:Number, target_mc:MovieClip) {

		switch(whichType) {

			case "sword":

				this.objType = "sword";

				if(Math.random()*100 < 50) {

					this.objDescription = "Short sword";

				} else {

					this.objDescription = "Long sword";

				}

				this.objOffensive = Math.round(Math.random()*5);

				this.objDefensive = Math.round(Math.random()*3);

				break;

			case "shield":

				this.objType = "shield";

				if(Math.random()*100 < 20) {

					this.objDescription = "Big dwarf shield";

					this.objDefensive = Math.round(Math.random()*7);

				} else {

					this.objDescription = "Small orcish shield";

					this.objDefensive = Math.round(Math.random()*5);

				}

				this.objOffensive = 0;

				break;

			case "spear":

				this.objType = "spear";

				if(Math.random()*100 < 50) {

					this.objDescription = "Human spear";

					this.objOffensive = Math.round(Math.random()*5);

				} else {

					this.objDescription = "Orcish spear";

					this.objOffensive = Math.round(Math.random()*3);

				}

				this.objDefensive = 0;

				break;

		}

		this.objIdx = objIdx;

		trace("new "+this.objType+" created");

		showOnStage(target_mc, this.objIdx);

	}



	//	this method used to show object on the stage

	//	we assume that object type defines the appropriate

	//	library mc used for object representation

	private function showOnStage(targetToAttach:MovieClip, objIdx:Number) {

		var newName:String = this.objType+objIdx;

		var newDepth:Number = targetToAttach.getNextHighestDepth();

		targetToAttach.attachMovie(this.objType, newName, newDepth);

	}

}

---

Then next thing we must to do, is to write some mechanism to prove our concept. But before, i need to explain the code above. This class gets the three parameters used to generate item (calculate item parameters and show it on the stage). The first one describes item type. In this sample i define 3 possible types: sword, spear and shield. The next one is item id code - some unique identifier and the last one is movie clip used to hold our visual representation.

Now it's time to write some code to check how it works. We need to create new Flash movie (use default movie dimensions and call it "tst.fla"). After this, we need to create three movieclips, which will represent our item's types on the stage (the size of each one must be 50x50, and they must be stored in library under the following linkage identifiers "sword", "spear" and "shield").

The last thing must be done is to write following code to the first frame (it can be save in external AS file and included to the first frame using #include directive). Here is a code:

code:

---

var inventory_array:Array = new Array();

var inventorySize:Number = 5;

var itemEquipped:Number = -1;



var objTypes_array:Array = new Array();

objTypes_array = ["sword", "shield", "spear"];



addToInventory.onRelease = function():Void {

}



createInventory(inventorySize);



function createInventory(iSize:Number):Void {

	trace("done");

	for(var i:Number=1; i< iSize; i++) {

		drawCell("iCell"+i, i*100, "cell");

		this["iCell"+i]._x = i*50;

		this["iCell"+i]._y = 0;

	}

	//	create add to inventory btn

	drawCell("addToInventory_btn", 

			 this.getNextHighestDepth(), 

			 "add2Inv");

	this["addToInventory_btn"]._x = 0;

	this["addToInventory_btn"]._y = 75;

}



function drawCell(cellName:String, cellDepth:Number, textMsg:String) {

	trace("drawCell: "+cellName+":"+cellDepth);

	if(textMsg == "cell") {

		//	draw inventory placeholder

		this.createEmptyMovieClip(cellName, cellDepth);

		this[cellName].beginFill(0xEFEFEF, 30);

		this[cellName].lineStyle(1, 0x000000, 100);

		this[cellName].moveTo(0, 0);

		this[cellName].lineTo(50, 0);

		this[cellName].lineTo(50, 50);

		this[cellName].lineTo(0, 50);

		this[cellName].lineTo(0, 0);

		this[cellName].endFill();



		this[cellName].onRelease = function() {

			itemEquipped = parseInt(cellName.substr(5))-1;

			if(_root.inventory_array[itemEquipped].objType != undefined) {

				trace("item eqiupped: "+

					  _root.inventory_array[itemEquipped].objType+":"+

					  _root.inventory_array[itemEquipped].objDescription);

			}

		}



	} else {

		//	draw button

		this.createEmptyMovieClip(cellName, cellDepth);

		this[cellName].beginFill(0xEFEFEF, 30);

		this[cellName].lineStyle(1, 0x000000, 100);

		this[cellName].moveTo(0, 0);

		this[cellName].lineTo(100, 0);

		this[cellName].lineTo(100, 17);

		this[cellName].lineTo(0, 17);

		this[cellName].lineTo(0, 0);

		this[cellName].endFill();

		this[cellName].createTextField(textMsg, this.getNextHighestDepth(), 0, 0, 100, 17);

		if(textMsg == "add2Inv") {

			this[cellName].add2Inv.text = textMsg;



			this[cellName].onRelease = function() {

				trace("this is "+textMsg+" button");

				//	check if inventory full

				if((inventory_array.length + 1) == 5) {

					trace("inventory full");

				} else {

					var objIdx:Number = Math.floor(Math.random()*objTypes_array.length);

					var tDepth:Number = inventory_array.length+1;

					var target_mc:MovieClip = _root["iCell"+tDepth];

					var typeVal:String = objTypes_array[objIdx];

					var tmpObj:InventoryObject = new InventoryObject(typeVal, tDepth, target_mc);

					inventory_array.push(tmpObj);

				}

			}

		}

	}

}

---

Ok, now compile you movie and look on the trace output to check the concept.

P.S. the all above is a real working sample, you need to have Flash MX 2004 to run it as is. I hope it will be helpfull to anyone here :)

Any questions - appreciated :)

Do you have the .fla file for that scrpt?

Here is a some demo i made:
++++++++++++++++++++++++++++++++++++++
Link to demo
++++++++++++++++++++++++++++++++++++++

Now how it works:
- press add to inventory to generate random inventory item
- roll over inventory placeholder that contains item to get info on it
- press clear inventory button to start from th beginning


It uses the same script with some minor modifications:
- in the first frame a new button added to reset inventory
- in the first frame an array of item's descriptions added to generate random item
- in "InventoryObject" class a new function added in order to remove object's visual representation from inventory's placeholder.
- in "InventoryObject" class constructor was re-written in order to create really random object descriptions (now it's shorter then before)

Here is a changes in constructor + additional function to remove object from the stage:

code:

---

//	class constructor

	public function InventoryObject(whichType:String, objIdx:Number, target_mc:MovieClip) {

		var seedNumber:Number = Math.floor(Math.random()*_root.objDescriptions_arr  ay.length);

		switch(whichType) {

			case "sword":

				this.objType = "sword";

				this.objDescription = _root.objDescriptions_array[seedNumber][0];

				this.objOffensive = Math.round(Math.random()*5);

				this.objDefensive = Math.round(Math.random()*3);

				break;

			case "shield":

				this.objType = "shield";

				this.objDescription = _root.objDescriptions_array[seedNumber][1];

				this.objDefensive = Math.round(Math.random()*7);

				this.objOffensive = 0;

				break;

			case "scroll":

				this.objType = "scroll";

				this.objDescription = _root.objDescriptions_array[seedNumber][2];

				this.objOffensive = 0;

				this.objDefensive = 0;

				break;

		}

		this.objIdx = objIdx;

		trace("new "+this.objType+" created");

		showOnStage(target_mc, this.objIdx);

	}



	//	this method used to show object on the stage

	//	we assume that object type defines the appropriate

	//	library mc used for object representation

	private function showOnStage(targetToAttach:MovieClip, objIdx:Number) {

		var newName:String = this.objType+objIdx;

		var newDepth:Number = targetToAttach.getNextHighestDepth();

		targetToAttach.attachMovie(this.objType, newName, newDepth);

	}

	

	public function removeFromStage(targetToRemove:MovieClip) {

		trace("removeFromStage: "+targetToRemove);

		var newName:String = this.objType+objIdx;

		targetToRemove[newName].removeMovieClip();

	}

---

the code for the first frame i don't post, cause anyone can modify previous one to add functionality i've added.

Anyway if anyone interesting to get a full source - you are welcome - just ask and i'll post a link to it here.

Happy coding :)

Quote:

---

Originally Posted by The Helmsman

Here is a some demo i made:
++++++++++++++++++++++++++++++++++++++
Link to demo
++++++++++++++++++++++++++++++++++++++

---

Hey, very nice, but I found bug :)
If you release the mouse button outside of item then its description balloon is not removed.

Thanks. I'll check it.