Jump to content
GreenSock

badkarma911

TweenMax from an External Class

Recommended Posts

Ok I hoping someone can help me out. I'm relatively new to action script and TweenMax but have learned a lot over the last year. I'm using Flash Professional and I am trying to ease in a map when the map icon is clicked. Once the user is done they click on the map and the map eases out. This is set up by using two external classes names MapToggleOnClass and MapToggleOffClass. I have been successful in doing this from the document class but only partially successful in doing it from an external class. I say partially because I am able to get the ease out function in the MapToggleOffClass to work when the user clicks on the map. However, I have not been able to get the map to ease in when the map icon is clicked. All my symbols are MovieClips. All the instance names are correct and the instances are on the stage. The visibility of the streetMap instance is set to off at runtime. Using a trace statement I know that Flash is detecting when I click on the Map Icon (mapBook) but nothing happens. The symbol StreetMap is linked to the Class of StreetMap and the Base Class of the MapToggleOffClass. The Symbol Map Icon has the instance name of mapBook and has its class linked to the MapToggleOnClass. I know the linkages are correct because of trace statement when I click on the instance of mapBook. The click is registered but the Tween (easeIn) does not occur.

 

The following is my code:

 

 

package  
{
 
import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.TweenMax;
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.MouseEvent;
 
public class MapToggleOffClass extends MovieClip
{
 
 
public function MapToggleOffClass() {
 
 
 
this.buttonMode = true;
 
this.addEventListener(MouseEvent.CLICK,hideMap);
 
function hideMap(event:MouseEvent):void
{
trace("movieClip Instance Name = " + event.target.name);
TweenMax.to(event.currentTarget, 1, {autoAlpha:0, ease:Back.easeOut});
}
}
 
}
 
}
 
 
and 
 
package 
{
 
import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.TweenMax;
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.MouseEvent;
import StreetMap;
 
public class MapToggleOnClass extends MovieClip
{
 
var streetMap:StreetMap; 
 
 
public function MapToggleOnClass()
{
 
streetMap = new StreetMap();
 
this.buttonMode = true;
 
this.addEventListener(MouseEvent.CLICK,showMap);
 
 
 
function showMap(event:MouseEvent):void
{
 
 
trace("The link is working");
 
TweenMax.to(streetMap, 1, {autoAlpha:1, ease:Back.easeIn});
}
 
}
 
}
 
}

 

 

The main difference is the easeOut function uses "event.currentTarget" and the easeIn function uses streetMap as the object.

 

One more thing.... in the action script settings I have automatically declare stage instances checked.

 

What am I missing? Any help would be much appreciated.

 

thanks in advance.

 

 

Link to comment
Share on other sites

Hey mate,

 

Attached is a sample. Not quite sure why you need 2 classes but heres a sample using a document class. Basically break down all the major functionality into little pieces and then go from there. Hopefully it does what I think you want it to do. Toggling a larger map and a mini map based on clicks.

package
{
	
	import com.greensock.*;
	import com.greensock.easing.*;
	import com.greensock.TweenMax;
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	
	public class Main extends MovieClip
	{	
		
		public var miniMap:Sprite;
		public var bigMap:Sprite;
		
		public function Main()
		{
			addEventListener(Event.ADDED_TO_STAGE, onAdd);
		}
		
		private function onAdd(e:Event):void 
		{
			removeEventListener(Event.ADDED_TO_STAGE, onAdd);
			//
			miniMap.addEventListener(MouseEvent.CLICK, miniMapCLick);
			bigMap.addEventListener(MouseEvent.CLICK, bigMapClick);
			//
			//Initalize but use 0 time to set it immediately
			hideBigMap(0);
			showMiniMap(0);
		}
		
		private function miniMapCLick(e:MouseEvent):void 
		{
			//When the minimap is clicked
			hideMiniMap()
			showBigMap();
		}
		
		private function bigMapClick(e:MouseEvent):void 
		{
			//When the big map is clicked
			showMiniMap();
			hideBigMap();
		}
		
		//Break it down into small function that you can call upon logically and easily
		private function hideBigMap(time:Number = 0.5)
		{
			TweenMax.to(bigMap, time, { y: -100, alpha:0 } );
		}
		private function showBigMap(time:Number = 0.5)
		{
			TweenMax.to(bigMap, time, { y: 50, alpha:1 } );
		}
		
		private function hideMiniMap(time:Number = 0.5)
		{
			TweenMax.to(miniMap, time, { y: -100, alpha:0 } );
		}
		private function showMiniMap(time:Number = 0.5)
		{
			TweenMax.to(miniMap, time, { y: -10, alpha:1 } );
		}
	
	}

}

mapProb.zip

  • Like 1
Link to comment
Share on other sites

Zync,

 

I greatly appreciate your help especially adding the remove event listener, I had forgot about that. I don't think I did a good job of conveying what I'm trying to do. Essentially, I have one button that opens the map up (actually changes the autoAlpha to 1) the object is already on the stage. Then when the user wants to close the map they click on the map itself and it closes. So the map is actually a button. I have been able to do this through the document class but when I use external classes I run into problems. Using the "this" keyword I have been able to make the map tween to 0 in my MapToggleOffClass. The problem seems to be opening the map in the first place. When I click on the button to make the map appear nothing happens. I have an external class linked to the button to open the map. The map symbol instance name is streetMap.At runtime I get the output error of "Error #1009: Cannot access a property or method of a null object reference." I have no idea why this is occurring. Thanks in advance for any help you can provide.

Link to comment
Share on other sites

This is the code I'm using for the ToggleMapOnClass. Thanks again.
 
 
package 
{
 
import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.TweenMax;
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.display.Sprite;
import StreetMap;
 
public class MapToggleOnClass extends MovieClip
{
public var streetMap:Sprite;
 
 
 
public function MapToggleOnClass()
{
 
 
 
this.buttonMode = true;
this.addEventListener(MouseEvent.CLICK,showMap);
 
}
private function showMap(time:Number=0.5)
{
TweenMax.to(streetMap,time,{y:50,alpha:1});
}
 
}

}

Link to comment
Share on other sites

Hi badkarma,

 

I'd suggest you zip up a set of your files. Just make a small demo that only has code and assets related to replicating the issue. From what I gather we would just need to compile a set of files that contains the button that opens the map, and the map itself. 

 

It will be much easier to work with and test semi-working files than snippets of code in a forum post. From what I can tell this is a problem relating to referencing assets from different classes and not really a GreenSock issue, but if we can help you we will (as Zync as shown).

 

Thanks!

Link to comment
Share on other sites

Carl,

 

Thanks a lot, I have tried everything and nothing seems to work. It's probably something very simple but after two weeks I've ran out of possible solutions. Ive attached the fla file and the the document class (both zipped). I have been able to get it to work using the Document Class. It's the external classes that I have the issue with. I'll post them in a moment.

 

Thanks again for all your help.

 

 

MapButton.fla.zip

MapButton.as.zip

Link to comment
Share on other sites

Carl,

 

Here I've posted the fla file that uses the external classes to show and hide the map. The visibility of the map is set to off at runtime. When I turn the visibility on and test the project if I click on the map the Tween works and the map is hidden. But I have been unable to get the showMapClass to work. Currently I have no errors and the button mode seems to work but when you click on the Show Map button nothing happens. Once again thanks for your help.

 

 

MapButtonEC.fla.zip

HideMapClass.as.zip

ShowMapClass.as.zip

Link to comment
Share on other sites

Hey ya mate,

 

Took a look at your files but yeah like I said its more a logic / organisation problem than a tweening one. Here's an updated sample using your assets and a single doucment class. Code is pretty much the same as before too. Maybe that works for ya.

mapShowHide.zip

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×