DisplayObject.scrollRect
I have few questions about DisplayObject.scrollRect:1. how it actually work? is it automatic setup a mask?2. when using the scrollRect, will DisplayObjects outside the bounding still get render?thankyou very much.
Adobe > ActionScript 1 and 2
Posted on: 10/11/2007 08:36:46 AM
View Complete Forum Thread with Replies
See Related Forum Messages: Follow the Links Below to View Complete Thread
Target Authortime Nested DisplayObject From DisplayObject Subclass
Hi there,
Say I am building a login form with an "ok" button using Flash CS4 and AS3.
In the Flash CS4 authoring tool I manually create a MovieClip called LoginForm and link it to an AS3 class (LoginForm.as).
Also in the Flash authoring tool I create another MovieClip that will be my "ok" button, I nest this MovieClip inside the LoginForm movieclip and give it an instance name "okButton_mc".
Now in my AS3 class, (LoginForm.as) I want to reference the ok button. In AS2, I would have declared "okButton_mc" as a member variable of my class - this is not allowed in AS3.
In AS3, even though I don't/can't declare "okButton_mc" I can still reference it without any compiler or runtime errors. My only annoyance is that while I'm coding (incidentally i use FDT) I get squiggly red lines under every occurrence of "okButton_mc" in my code. In addition code hinting doesn’t work for “okButton_mc” because, due to there being no declaration of the object, my text editor, FDT , doesn’t know what type it is.
I’ve begun using the following workaround:
Code:
public class LoginForm extends MovieClip
{
// Declare a member variable for the benefit of the text editor:
private var loginButton:MovieClip;
public function LoginForm()
{
loginButton = MovieClip(getChildByName("loginButton_mc"));
// Now I can reference loginButton_mc without errors and with code hinting:
loginButton.addEventListener(MouseEvent.CLICK, okClickHandler)
}
}
This works for me but adds a lot of code, does anyone have suggestions for a better way to address the problem?
Thanks for reading!
Bruce
Help With ScrollRect
Hey guys ..im trying to make a simple scroller with scrollRect using
import flash.geom.Rectangle;
var container:MovieClip = _root.rowHolder;
goto = 0;
var window:Rectangle = new Rectangle(dynamicWidth, dynamicHeight, measureBox._width, measureBox._height);
rowHolder.scrollRect = window;
..but how do i read the properties... lets say i dont know what dynamicHeoght is.. can i read it somehow? ..by getProperty?`..somthing?
[F8] ScrollRect MC Property
Not an expert flasher by any means -- just a designer forced to try to do new things and figure out how and why.
I'm in URGENT need of implementing a scrollRect (Rectangle property) on a movie clip and from my extensive search on the net I STILL HAVE NOT FOUND a good example from which to learn. Lots of theory -- no good examples.
I need to cache the clip as a bitmap also -- that I can get. I need the movie clip -- lets call it largeMovieClip for now - to scroll, with accelerations and decelerations, to specified locations on the _y axis when a button is pushed.
I have no idea even where to begin???!!!
PLEASE HELP!
Thanks in advance!
ScrollRect MC Properties
Greetings!
FLASH 8 professional version
Not an expert flasher by any means -- just a designer forced to try to do new things and figure out how and why.
I'm in URGENT need of implementing a scrollRect (Rectangle property) on a movie clip and from my extensive search on the net I STILL HAVE NOT FOUND a good example from which to learn. Lots of theory -- no good examples.
I need to cache the clip as a bitmap also -- that I can get. I need the movie clip -- lets call it largeMovieClip for now - to scroll, with accelerations and decelerations, to specified locations on the _y axis when a button is pushed.
I have no idea even where to begin???!!!
PLEASE HELP!
Thanks in advance!
ScrollRect - How Does This Work?
Hi guys.
I am creating some comment boxes and want to use the scrollRect functionality. However, my comments slide up from the bottom.
I create my Rectangle:
Code:
var commentsMask:Rectangle = new Rectangle(0,0,427,400);
Now, I need the masking to be -480... But as soon as I adjust anything to the Rectangle object, all kinds of weird things happen. Flash actually moves my content to a new position all by itself...
It also seems that when I try and move the Rectangle to a negative value, my other content dissappear. Obviously it is the Rectangle that is making it move somewhere... but I don't know where or why.
I can get it to work by adjusting my clips Y point, but that seems like a hack.
Anyone care to explain a little bit for me?
Tali ho!
Mask And ScrollRect?
Hey everyone
All I want to do is to set a mask on a textfield and then get the new maksed height of the textfield.
1) If I set a normal mask, I still get the full height of the textfield.
2) If I use scrollRect then the height should be the new masked height, but this isn't updated until a a point later in the movie....
How can I set a mask and get the new height of the masked content through .height?
[AS3] ScrollRect Weirdness
I'm getting some weird behavior while trying to build a scrollbar in as3. I've applied a scrollRect to the movieclip I want to scroll:
Code:
public function create(targ, w, h):void{
trace('Scrollbar: Create');
this.targ = targ;
this.w = w;
this.h = h;
trace("targ.height is: "+targ.height);
this.targ.scrollRect = new Rectangle(0, 0, this.w, this.h);
trace("targ.height is: "+targ.height);
scrollpos=0;
checkComponents();
}
Both the traces before and after trace out the correct value, in this case 267. However, once I call any sort of mouseEvent (applied to the targ, the arrows used for the scrollbar... etc) it traces the height of targ as 125 - the height of the scrollRect. Is this a bug? Am i missing something about scrollRect?
Thanks,
Sarah
Resetting ScrollRect?
Hey there, Im having an issue with scrollRect. Its all set up and works like a dream, but I cant get it reset properly.
scrollRect moves from a .x of 0 to about 4000.
To reset, I use the following AS
_root.scrollRect.x = 0;
This works fine, and is confirmed by a trace action. However, the scrollRect area doesnt actually move? However, next time the move action is initiated, is goes back to the right place? I dont get it!
Unresponsive ScrollRect
Hey,
I've built a class that extends Sprite and is pretty simple. It has a setImage(obj:Sprite) method, which adds a passed Sprite as a child, then setters and getters for clipWidth and clipHeight. Setting these variables sets the image's scrollRect. Here's the code:
Code:
public function set clipWidth(n:Number):void {
_clippingWidth = n ;
this.scrollRect = new Rectangle(0, 0, _clippingWidth, _clippingHeight);
}
public function get clipWidth():Number {
return _clippingWidth ;
}
public function set clipHeight(n:Number):void {
_clippingHeight = n ;
this.scrollRect = new Rectangle(0, 0, _clippingWidth, _clippingHeight);
}
public function get clipHeight():Number {
return _clippingHeight ;
}
Not exactly rocket science, or so I thought, but it doesn't work. When I tween the clipWidth or clipHeight values, using either a flash Tween or caurina.transitions.Tweener's addTween method, it will work for a little while, then stops. Tracing out the objects scrollRect shows that the scrollRect Rectangle is changing, and is showing the right values, but visually the image doesn't change.
What could I be doing, or not doing, here that would cause this kind of behavior?!
Thanks.
ScrollRect In Thumbs Gallery
Hi to all. I have a gallery with thumbnails. When i click on a thumb a larger picture appears in a big rectangle with a large image item. I want the picture inside the big rect to scroll up down and left right onmousemove. The gallery takes the data from an xml file. The big rect is a mc with a mask. So i want to put actions and make the mc scrollable. I need your help!!! Sorry for my bad english.
How To Get The Height Masked By ScrollRect
Hey,,i was wondering.. immaking a scroller..that uses scrolRect, but the content af the scroller are constantly changing, and the dynamic height of the content is kinda hard to calculate..so i'd rather use content._height.. but when content is masked by scrollRect, it naturally just gives me the masked height.. =/ ..anyone knows?
Which Is Faster CopyPixel() Or ScrollRect()?
Is it better/faster/smoother to use copyPixel() of scrollRect for fast animations?
Is there some way to time those methods beside FPS?
Is there some better way for fast and smooth scroling large bitmaps?
And one more question, does Flash 9 has something like vertical sync, to wait for monitor refresh and than to draw picture?
Repeating/Looping With ScrollRect?
Hello Everybody,
I am sitting here reading the "Flash 8 Action Script Bible" which is pretty great, but I am curious about something concerning the use of "ScrollRect".
Basically I have the code from the book, with some edits to give my code a "scrolling" feel. Here is the code:
Code:
import flash.geom.Rectangle;
import DrawingUtilities;
// create movieclip and embed text inside it
this.createEmptyMovieClip("mTextClip", this.getNextHighestDepth());
var tField:TextField = mTextClip.createTextField("tField",
mTextClip.getNextHighestDepth(), 0, 0, 200, 200);
tField.multiline = true;
tField.wordWrap = true;
tField.autoSize = "left";
// original rectangle to scroll set to 0, 0
mTextClip.scrollRect = new Rectangle(0, 0, 200, 200);
var DuDrawer:DrawingUtilities;
// use loadvars to load the text
var lvText:LoadVars = new LoadVars();
lvText.onData = function(sText:String):Void {
tField.text = sText.substring(0, 5000);
};
lvText.load("http://www.person13.com/asb/lorem_ipsum.txt");
// two movie clip objects to scroll the text.
this.createEmptyMovieClip("mScrollUp", this.getNextHighestDepth());
duDrawer = new DrawingUtilities(mScrollUp);
duDrawer.beginFill(0xFF0000, 100);
duDrawer.beginRectangle(20, 20, 10, 10);
duDrawer.drawPolygon(5, 3, Math.PI / 6, 10, 10);
duDrawer.endFill();
this.createEmptyMovieClip("mScrollDown", this.getNextHighestDepth());
duDrawer = new DrawingUtilities(mScrollDown);
duDrawer.beginFill(0xFF0000, 100);
duDrawer.beginRectangle(20, 20, 10, 10);
duDrawer.drawPolygon(5, 3, -Math.PI / 6, 10, 10);
duDrawer.endFill();
// move these clips to the right side
mScrollUp._x = mTextClip._x + tField._width;
mScrollUp._y = mTextClip._y;
mScrollDown._x = mScrollUp._x;
mScrollDown._y = mTextClip._y + 200 - 20;
// functionality for the buttons
mScrollUp.onRelease = function():Void {
var rctText:Rectangle = mTextClip.scrollRect;
nInterval = setInterval(scroll, 10, 10, rctText.y - 200, "up");
};
mScrollUp.onReleaseOutside = mScrollUp.onRelease;
mScrollDown.onRelease = function():Void {
var rctText:Rectangle = mTextClip.scrollRect;
nInterval = setInterval(scroll, 10, -10, rctText.y + 200, "down");
};
mScrollDown.onReleaseOutside = mScrollDown.onRelease;
function scroll(nScrollAmount:Number, nEndPoint:Number, stDir:String):Void {
// retrieve the current scrollRect value
var rctText:Rectangle = mTextClip.scrollRect;
//update the y property
rctText.y += -nScrollAmount;
// check if the rectangle would scroll the text out of bounds
if (rctText.y <= 0) {
clearInterval(nInterval);
}
else if (rctText.y > mTextClip.tField._height - 200) {
clearInterval(nInterval);
}
else if ((rctText.y > nEndPoint) && (stDir == "down")) {
clearInterval(nInterval);
}
else if ((rctText.y < nEndPoint) && (stDir == "up")) {
clearInterval(nInterval);
}
else {
mTextClip.scrollRect = rctText;
}
}
What I want to do now is make it so that when I get to the end of the text, it will almost loop so that the start of the text is now under what is the "end". It's a lot like a repeating background from the cartoons of yore (see: Flinstones) and it is a big part to something I am working on at the moment.
Thank you very much!
Scrollrect Positioning Problem
On my root level I have a movieclip called main that houses everything I need to scroll. This was the code I was using before on the root level:
Code:
import flash.geom.Rectangle;
var rightWindow:Rectangle = new Rectangle(0, 0, 968, 582);
this.scrollRect = rightWindow;
But now I need to put a movieclip outside of the scrollRect rectangle so I tried changing the code to:
Code:
main.scrollRect = rightWindow
But then the scrollrect is placed at the center registration point. So attempted to move the retangle so the scrollrect is put back in the upper left hand corner. When I do this weird things happen with the positioning and the masking.
does anyone know how to properly position the scroll rect and move it around so you get the contents you want within the mask?
ScrollRect Moving My Sprite
Confused here...If I comment out the scrollRect line then it displays properly but it doesn't scroll. However, if I uncomment scrollRect it scrolls but the playlist and all the stuff in the sprite move to a new location. Why? I just want it to stay there.
ActionScript Code:
var playlist:Sprite = new Sprite();
playlist.graphics.beginFill(0xFFCC00);
playlist.graphics.drawRect(490, 31.8, 300, 375);
playlist.cacheAsBitmap = true;
playlist.scrollRect = new Rectangle(490, 31.8,300,375);
addChildAt(playlist,0);
Setting ScrolLRect Y Property
Hey everyone
I have this code:
Code:
private function moveScrollObject(e:MouseEvent):void
{
var moveNum:Number = 50;
_scrollObject.scrollRect.y += moveNum;
trace(_scrollObject.scrollRect.y); // traces 0 all the time
}
I can't see what my problem is. Even though I plus the scrollRect y property with 50, it keeps tracing 0?
Problems With Printjob And Scrollrect
I have a sprite that has a scrollbar that uses the scrollrect feature. The sprite has several bitmaps and textfields. When I print the outer sprite (The one with the scrollrect) all of the textfields outside the scrollrect are cut after the first line.
In case anyone else is having problems with printing sprites with scrollrects using the bitmap printing option fixes and prints most of the stuff in the sprite. Excluding all textfields outside of the scrollrect. This however can be fixed partially by embedding your fonts.
So now the only problem left is printing multiline textfields that are outside the scrollrect.
P.S. Imho the scrollrect should have nothing to do with the printed area of the sprite because the printJob.addPage has a printarea parameter. What do you think?
ScrollRect And Browser Resizing...
I'm trying to make a full browser webpage that utilizes the scrollRect type of class to pan around a movieclip that contains other movieclips and so on. The problem I run into is that when the browser window is resized that panning doesn't go with it. So panning to all the edges becomes impossible. I've tried a bunch of different stage resizing techniques but none of them give any good results. Here's the actionscript I'm currently working with:
Code:
stop();
import com.McSliderB;
Stage.scaleMode="noScale";
Stage.align="TL";
var stageListener:Object = new Object();
stageListener.onResize = function() {
img._x = Stage.width - img._width;
img._y = Stage.height - img._height;
};
Stage.addListener(stageListener);
var myclip:MovieClip = _root.img;
var myeasing:Number = .9;
var myX:Number = 0;
var myY:Number = 0;
var myviewW:Number = 1440;
var myviewH:Number = 800;
var mystartX:Number = ((myclip._width - myviewW)/2);
var mystartY:Number = ((myclip._height - myviewH)/2);
//new McSlider(yourMovieClip, easing, clipX, clipY, aperature_width, aperature_height, initial_x_Offset, initial_y_Offset);
var nMC:McSliderB = new McSliderB(myclip, myeasing, myX, myY, myviewW, myviewH, mystartX, mystartY);
If anyone could help me out with this I would greatly appreciate it. Thanks!
Scrollrect And ScaleX / ScaleY
Hey guys, i've got a scrollrect on a movieclip, however when i scale the movieclip, my scrollrect rectangle visible area on the screen gets dramatically smaller. is there a way to keep it proportion to the viewable area if my moveclip scales to a larger size?
UIScrollbar With MovieClip.scrollRect
I have an article with text, images, and buttons that I want to scroll.
The site uses UI components for this type of thing already, so I don't want to build my own (like LiveDocs recommends), I want to use the same skins as the rest of the site.
I've searched Google and LiveDocs and can't find a good example of using the UIScrollbar with MovieClip.scrollRect. Though one guys comments say it can be done.
This is what I have so far:
Actionscript Code:
import fl.events.ScrollEvent;import flash.geom.Rectangle;import flash.geom.Point;
var totalHeight:Number = mcArticle.height;var croppedHeight:Number = 418;
var rect:Rectangle;rect = new Rectangle(0, 0, mcArticle.width, croppedHeight);
// Cache the MovieClip as a bitmap to improve performance.mcArticle.cacheAsBitmap = true;
mcArticle.scrollRect = rect;
cmpntScrollBar.setScrollProperties(croppedHeight, 0, totalHeight - croppedHeight);cmpntScrollBar.setSize(cmpntScrollBar.width, croppedHeight);cmpntScrollBar.update();
Then, to handle the UIScrollBar event:
Actionscript Code:
//set scrollbar eventcmpntScrollBar.addEventListener(ScrollEvent.SCROLL , scrollArticle);
function scrollArticle(evt:ScrollEvent){ //I got this from comments on LiveDocs, but it doesn't seem to work. mcArticle._y = -cmpntScrollBar.scrollPosition;}
So when the SWF loads, it does crop my article and the UIScrollBar seems to be setup correctly, but dragging the scrollbar doesn't move the MovieClip.
Thanks for any advice!
Brandon
ScrollRect Crash (how Else To Scroll) (Flash8)
Hi
I am making a side (and up and down) scrolling game. I draw the background in a movieclip once, and use scrollRect to scroll it. (I am using Flash 8)
I am having a few problems.
1 - First and worst is that it keeps crashing both the flash player, and the flash IDE. In a browser it doesn't crash.
2 - If I don't set the scrollRect every frame, the background gets erased by whatever is moving in front of it.
3 - If I set cacheAsBitmap=true for the background, it doesn't scroll at all.
Any ideas why it doesn't work, and what methods do you use to scroll your map/background?
HitTest Hides Inside ScrollRect..?
I have following hitTest on my mc:
Code:
onClipEvent (enterFrame) {
if (this.hitTest(_root._xmouse, _root._ymouse, true)) {
if (this._currentframe<this._totalframes) {
nextFrame();
}
} else {
if (this._currentframe>1) {
prevFrame();
}
}
}
hitTest works fine - until I put this scrollRect on it's parent mc:
Code:
web_slide.scrollRect={x:0,y:0,width:250,height:104}
btn_up.onRelease = function () {
if (web_slide.scrollRect.y = web_slide.scrollRect.y ) {
var newpos=web_slide.scrollRect
newpos.y-=53
web_slide.scrollRect=newpos }}
btn_down.onRelease = function () {
if (web_slide.scrollRect.y = web_slide.scrollRect.y - 106 ) {
var newpos=web_slide.scrollRect
newpos.y+=53
web_slide.scrollRect=newpos }}
Here's the funny thing: The scrollRect code also works fine on its own - but when I put the scrollRect on, the hitTest mc hides inside the scrollRect - meaning, the hitTest runs, but the result displays only inside the scrollRect area, and what is supposed to display outside of it (which is practically everything of it) is hidden. How do I get around that?
ScrollRect Crash (how Else To Scroll) (Flash8)
Hi
I am making a side (and up and down) scrolling game. I draw the background in a movieclip once, and use scrollRect to scroll it. (I am using Flash 8)
I am having a few problems.
1 - First and worst is that it keeps crashing both the flash player, and the flash IDE. Sometimes it crashes imediately, an sometimes after some time. In a browser it doesn't crash.
2 - If I don't set the scrollRect every frame, the background gets erased by whatever is moving in front of it.
3 - If I set cacheAsBitmap=true for the background, it doesn't scroll at all.
Any ideas why it doesn't work, and what methods do you use to scroll your map/background?
Getting Height Of Display Content When Using ScrollRect?
Does anybody know how to get the height and width of the content in a display object when using scrollRect.
For example>
Code:
import flash.display.Sprite;
import flash.geom.Rectangle;
var circle:Sprite = new Sprite();
circle.graphics.beginFill(0xFFCC00);
circle.graphics.drawCircle(200, 200, 200);
addChild(circle);
//display object width and height is 200
circle.scrollRect = new Rectangle(0, 0, 100, 100);
//display object width and height is now 100
The code above creates a 200pix circle and sets the scrollRect for the circle display object to 100pix. So you can only see a quater of the circle.
The height and width of the display object is now the height and width of the scrollRect which is 100. However the height of content (circle) is 200 but I have no way of finding this out.
There is no contentHeight or contentWidth propertys so how am I ment to find out the height and width of the content if I don't know what it is beforehand?
I need to know the content height and width so I know what the max scroll positions are. I need a scrolling solution where the height and width of the display object does not increase when the size of the content increases beond certain values. scrollRect fits the bill perfectly but its all useless if I dont know what the dimentions of the actual content are!
I'm sure there is a solution, please enlighten me!
Determining Original Size After ScrollRect
I'm trying to determine the size of a MovieClip which has a scrollRect. As expected, the _width/_height reflects the size after scrollRect applied, not the original clip. The problem is, that in my testing it appears that scrollRect does not take affect until after the code(frame?) is executed. Example:
import flash.geom.Rectangle;
mc.scrollRect = new Rectangle(0,0,55,55);
trace(mc._width); // 200, or whatever original size is
function onEnterFrame(){
trace(mc._width); // 55
}
The makes it impossible to set the scrollRect to null, measure, then re-apply a clone of the original scrollRect. Am I stuck? Is there any way to determine the original size?
Scrollrect + Dropshadow = Weird Behaviour
http://img.ravenworks.ca/scrollrectDropshadow.html
Mouse around this example to see a clip whose scrollrect automatically changes its height/width every frame according to the mouse's position. At least, in theory!
Move upwards and left slowly, and notice how 'jumpy' the movement of the shape is... sometimes the shadow moves without it, sometimes they both move but the shadow is further than the vector, and sometimes the vector jumps to catch up with where the shadow is!
If I had to guess, I'd say this is a problem with the flash player not hiding the clip where it knows the clip's shadow should be seen, but failing to consider that the vector inside the clip should be hidden anyway... one way or another, are there any known workarounds?
(Is this forum the right place to be posting bug reports, for that matter?)
ScrollRect + Continous Scrolling Help Needed
I have an "mc_appetizers" movie clip set to a scrollRect. I can scroll mc_appetizers up and down with my btn_upscroll and btn_downscroll buttons, but only 10px at a time. How can I make these buttons scroll continuously until the user releases the mouse button or until the movie clip has reached botttom? Here is my code, a conglomeration of various tutorials and forum posts (I'm rather new to this).
Attach Code
import flash.geom.Rectangle;
var container:MovieClip = mc_appetizers;
var window:Rectangle = new Rectangle(0, 0, 215, 215);
container.scrollRect = window;
btn_upscroll.onPress = function() {
var scrollUp = window;
var scrollmax = container._y;
trace(scrollmax);
trace(scrollUp.y);
if (scrollUp.y>scrollmax) {
scrollUp.y -= 10;
container.scrollRect = window;
}
}
btn_downscroll.onPress = function() {
var scrollDown = window;
var scrollmax = 400;
trace(scrollmax);
trace(scrollDown.y);
if (scrollDown.y<scrollmax) {
scrollDown.y += 10;
container.scrollRect = window;
}
}
Edited: 09/04/2007 at 08:40:57 AM by th_k
Image Slider Pan Thing With ScrollRect
I'm not sure if something like this has been posted, I've seen requests, and I've seen versions on this site and other sites - anywho.
I created a class file for this, all you need is one movieclip containing your image. It uses scrollRect vs. masking. One note, I'm placing button events on the image clip itself, so if you want to pan a movieclip that contains buttons, you'll have to create a button clip to handle those events. To initiate:
ActionScript Code:
import com.McSlider;var myclip:MovieClip = _root.img;var myeasing:Number = .5;var myX:Number = 40;var myY:Number = 40;var myviewW:Number = 720;var myviewH:Number = 520;var mystartX:Number = ((myclip._width - myviewW)/2); //want the image to start centeredvar mystartY:Number = ((myclip._height - myviewH)/2); //want the image to start centered//new McSlider(yourMovieClip, easing, clipX, clipY, aperature_width, aperature_height, initial_x_Offset, initial_y_Offset);var nMC:McSlider = new McSlider(myclip, myeasing, myX, myY, myviewW, myviewH, mystartX, mystartY);
To view:
http://flash.creatify.com/experiments/McSlider.html
Download:
http://flash.creatify.com/experiments/McSlider.zip
*****EDIT 09.07.06:
I've uploaded a version that accepts buttons within the movieclip - enjoy:
VIEW:
http://flash.creatify.com/experiments/McSliderB.html
DOWNLOAD:
http://flash.creatify.com/experiments/McSliderB.zip
*****EDIT 12.12.06
I've uploaded a version that with 3 new public methods:
stopMotion();
startMotion();
slideToPoint(x,y);
VIEW:
http://flash.creatify.com/experiments/McPan.html
DOWNLOAD:
http://flash.creatify.com/experiments/McPan.zip
HitTest On Mc Doesn't Work With ScrollRect
I have two pieces of code, that won't work together...
First: this makes a hitTest on an mc to make it run on rollover:
Code:
onClipEvent (enterFrame) {
if (this.hitTest(_root._xmouse, _root._ymouse, true)) {
if (this._currentframe<this._totalframes) {
nextFrame();
}
} else {
if (this._currentframe>1) {
prevFrame();
}
}
}
This works - until I put the next part of code inside to make the parent mc scroll:
Code:
web_slide.scrollRect={x:0,y:0,width:250,height:104}
btn_up.onRelease = function () {
if (web_slide.scrollRect.y = web_slide.scrollRect.y ) {
var newpos=web_slide.scrollRect
newpos.y-=53
web_slide.scrollRect=newpos }}
btn_down.onRelease = function () {
if (web_slide.scrollRect.y = web_slide.scrollRect.y - 106 ) {
var newpos=web_slide.scrollRect
newpos.y+=53
web_slide.scrollRect=newpos }}
Each work seperately, but they won't together. How do I get around this?
HELP Problem Scrolling ScrollRect With A ScrollBar
Hope you guys can help me out on this one.
Here's my problem. So I have some actionscript, and it scrolls the scrollRect, but there is a catch. It doesn't completely scroll it. It lets me scroll down until it's halfway and stops. I can still scroll up to the top, but the problem is unerving. I can't find a fix for it. Does anybody know how to fix it or has had a similar problem?
PHP Code:
stop();var maxItem = 10;var numColumns = 1;var leftMargin = 0;var topMargin = 0;var cellWidth = 273.4;var cellHeight = 54;for (var i = 0; i<maxItem+1; i++) { var mc = rssHolder.attachMovie("rssItem", "rssItem_"+i, i); var cellX = i%nbrColumns; var cellY = Math.floor(i/numColumns); mc._x = leftMargin+cellX*cellWidth; mc._y = topMargin+cellY*cellHeight; mc.name.text = "Hi. I'm Item "+i+".";}rssHolder.scrollRect = new flash.geom.Rectangle(0, 0, cellWidth, 122);//Beggining of scrollbar codebar.useHandCursor = dragger.useHandCursor=false;y = dragger._y;maxy = bar._y+bar._height-dragger._height;function moveDragger() { var scrollrect = _root.rssHolder.scrollRect; r = (dragger._y-y)/(bar._height-dragger._height); scrollrect.y = Math.round(r*scrollrect.height); _root.rssHolder.scrollRect = scrollrect;}dragger.onPress = function() { ref = this._parent; this.startDrag(false,this._x,ref.y,this._x,ref.y+ref.bar._height-this._height); id = setInterval(moveDragger, 50);};dragger.onMouseUp = function() { this.stopDrag(); clearInterval(id);};bar.onPress = function() { ref = this._parent; ref.dragger._y = ref._ymouse>ref.maxy ? ref.maxy : ref._ymouse; id = setInterval(moveDragger, 10);};bar.onMouseUp = function() { clearInterval(id);};
Thank you,
motionman95
ScrollRect, Panning, Browser Resizing...
I'm trying to create a webpage where the user pans around to discover the content. Something similar to this website:
http://www.vermeersch.ca/
Just click on explore at the bottom and resize the window and then pan around to see the effect I want.
I used a scrollRect like class to get the panning to work but when the browser window is resized I can't get the panning to cover the whole page like it would if the window was fully open. I've tried a few of the basic onResize type of commands but they didn't produce any good results. I'm guessing the problem is within the class itself. But I'm not really sure what or how to edit it.
Here's my actionscript:
Code:
stop();
import com.McSliderB;
Stage.scaleMode="noScale";
Stage.align="TL";
var stageListener:Object = new Object();
stageListener.onResize = function() {
img._x = Stage.width - img._width;
img._y = Stage.height - img._height;
};
Stage.addListener(stageListener);
var myclip:MovieClip = _root.img;
var myeasing:Number = .9;
var myX:Number = 0;
var myY:Number = 0;
var myviewW:Number = 1440;
var myviewH:Number = 800;
var mystartX:Number = ((myclip._width - myviewW)/2);
var mystartY:Number = ((myclip._height - myviewH)/2);
//new McSlider(yourMovieClip, easing, clipX, clipY, aperature_width, aperature_height, initial_x_Offset, initial_y_Offset);
var nMC:McSliderB = new McSliderB(myclip, myeasing, myX, myY, myviewW, myviewH, mystartX, mystartY);
And here's the actionscript from the class I'm using:
Code:
import mx.utils.Delegate;
import flash.geom.Rectangle;
class com.McSliderB {
private var __mc:MovieClip;
private var __mcp:MovieClip;
private var __ease:Number;
private var __control:MovieClip;
private var __yDiff:Number;
private var __yScale:Number;
private var __yPos:Number;
private var __xDiff:Number;
private var __xScale:Number;
private var __xPos:Number;
private var __imgW:Number;
private var __imgH:Number;
private var __rect:Rectangle;
//new McSlider(yourMovieClip, easing, clipX, clipY, aperature_width, aperature_height, initial_x_Offset, initial_y_Offset);
public function McSliderB(_mc:MovieClip, _ease:Number, _clipX:Number, _clipY:Number, _apertureW:Number, _apertureH:Number, _xoff:Number, _yoff:Number) {
// your clip to pan
__mc = _mc;
// amount of easing - .7 works well
__ease = _ease;
// store the clip's parent in a variable, it will be used for _xmouse, _ymouse
__mcp = __mc._parent;
// get the initial width and height of the images
__imgW = __mc._width;
__imgH = __mc._height;
// position the clip to x, y
__mc._x = _clipX;
__mc._y = _clipY;
// turn on cache
__mc.cacheAsBitmap = true;
// I decided to run the onEnterframe within another clip vs. __mc
// just incase __mc contained an animation or some other onEnterFrame events
__control = __mc.createEmptyMovieClip("controller", __mc.getNextHighestDepth());
// create a new rectangle - position your clip to the offsets and aperature width / height
__rect = new Rectangle(_xoff, _yoff, _apertureW, _apertureH);
// set the clip's scrollRect
__mc.scrollRect = __rect;
// button events to control movement start / stop
__mc.onRollOver = Delegate.create(this,initiateMovement);
__mc.useHandCursor = false;
}
private function killMovement():Void {
delete __control.onEnterFrame;
}
private function initiateMovement():Void {
delete __mc.onRollOver;
__control.onEnterFrame = Delegate.create(this,calcXY);
}
private function calcXY():Void {
// calculate the Y offset / positions
__yDiff = __mcp._ymouse-__mc._y;
__yScale = __yDiff/__rect.height;
__yPos = __yScale*(__imgH-__rect.height);
// calculate the X offset / positions
__xDiff = __mcp._xmouse-__mc._x;
__xScale = __xDiff/__rect.width;
__xPos = __xScale*(__imgW-__rect.width);
// set the rectangles offsets
__rect.x = __xPos-(__xPos-__rect.x)*__ease;
__rect.y = __yPos-(__yPos-__rect.y)*__ease;
__mc.scrollRect = __rect;
//detect hit area
if(!__mc.hitTest(_root._xmouse, _root._ymouse, true)) {
killMovement();
__mc.onRollOver = Delegate.create(this,initiateMovement);
}
}
}
If anyone could help it would be greatly appreciated. Thank you!
ScrollRect Issues In Full Browser Implementation
Hi all.. i thought this would be relatively simple but alas!
i have a parent movieclip which houses a movieclip which has a scrollrect applied.. i load images into the scrollrect and then in my document class on resize am trying to center the conainter movieclip with the scrollrect inside..
unfortunately the holder clip of the scrollRect gets a width equal to the width of all the images etc so i can't use it as a basis for scaling..
has anyone else encountered this or know of a fix..
see code below! ARG!
My Parent and scrollRect MovieClip
ActionScript Code:
public function CollectionImageScroller(imageArray:Array)
{
collectionImageScrollRect = new MovieClip();
collectionImageScrollRect.scrollRect = new Rectangle(0, 0, 0, 0);
collectionImagePathArrayFromXmlLoad = imageArray;
if(collectionImagePathArrayFromXmlLoad.length > 0)
{
collectionImages = new Array();
loadCollectionImage(collectionImagePathArrayFromXmlLoad[0]);
}
else
{
//display no images
}
}
function loadCollectionImage(imageUrl:String):void {
loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.INIT, showLoading);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, initListener);
loader.load(new URLRequest("http://jademichelle.tom.test" + imageUrl));
}
function showLoading(e:Event):void
{
removeEventListener(Event.INIT, showLoading);
loaderIcon = new mcLoaderIcon();
addChild(loaderIcon);
}
function initListener(event:Event):void {
removeChild(loaderIcon);
var currentImage:DisplayObject = loader.content;
maxImageWidth = (maxImageWidth > currentImage.width) ? maxImageWidth : currentImage.width;
maxImageHeight = (maxImageHeight > currentImage.height) ? maxImageHeight : currentImage.height;
currentImage.x = currentImageX;
collectionImageScrollRect.addChild(currentImage);
currentImageX = currentImageX + currentImage.width + 5;
p++;
collectionImages.push(currentImage);
if (p < collectionImagePathArrayFromXmlLoad.length) {
loadCollectionImage(collectionImagePathArrayFromXmlLoad[p]);//create loop
}
if (p == collectionImagePathArrayFromXmlLoad.length) {
//do when done
this.graphics.drawRect(0,0, maxImageWidth, maxImageHeight);
collectionImageScrollRect.scrollRect = new Rectangle(0, 0, (maxImageWidth + 30), maxImageHeight);
addChild(collectionImageScrollRect);
var leftGradBorder:MovieClip = new mcGradBorder();
leftGradBorder.x = -5;
leftGradBorder.height = (maxImageHeight + 5);
addChild(leftGradBorder);
var rightGradBorder:MovieClip = new mcGradBorderRight();
rightGradBorder.x = maxImageWidth - 20;
rightGradBorder.height = (maxImageHeight + 5);
addChild(rightGradBorder);
collectionImageScrollRect.addEventListener(MouseEvent.CLICK, scrollMe);
dispatchEvent(new Event("CollectionImagesLoaded", true, false));
p=0;
}
}
function scrollMe(e:MouseEvent):void
{
rect = collectionImageScrollRect.scrollRect;
trace("rectx" + rect.x + "currentimgindex" + currentImageIndex);
TweenLite.to(rect, 1, {x:(rect.x + collectionImages[currentImageIndex].width + 5),onUpdate:updateScrollRect, onComplete:function() { currentImageIndex++; }});
}
function updateScrollRect()
{
collectionImageScrollRect.scrollRect = rect;
}
My Document Class handling scaling:
ActionScript Code:
function setBackground():void {
if(collectionScroller != null)
{
collectionScroller.width = stage.stageWidth / 3;
collectionScroller.height = stage.stageHeight / 3;
collectionScroller.scaleX <= collectionScroller.scaleY ? (collectionScroller.scaleX = collectionScroller.scaleY) : (collectionScroller.scaleY = collectionScroller.scaleX);
collectionScroller.x = stage.stageWidth / 2 - (collectionScroller.width / 2);
collectionScroller.y = 100;
trace(collectionScroller.CalculatedWidth);
}
}
function positionCollectionImages(e:Event):void
{
removeEventListener("CollectionImagesLoaded", positionCollectionImages);
trace("MOOOOO");
trace("CALCULATED WIDTH " + collectionScroller.CalculatedWidth + " collectionscrollerx" + collectionScroller.x + " collectionscrollerwidth" + collectionScroller.width + " maximagewidth" + collectionScroller.MaxImageWidth);
collectionScroller.x = (stage.stageWidth / 2) - (collectionScroller.CalculatedWidth / 2);
collectionScroller.alpha = 1;
collectionScroller.visible = true;
//TweenLite.to(collectionScroller,1,{alpha:1});
setBackground();
}
ScrollRect Issues In Full Browser Implementation
Hi all.. i thought this would be relatively simple but alas!
i have a parent movieclip which houses a movieclip which has a scrollrect applied.. i load images into the scrollrect and then in my document class on resize am trying to center the conainter movieclip with the scrollrect inside..
unfortunately the holder clip of the scrollRect gets a width equal to the width of all the images etc so i can't use it as a basis for scaling..
has anyone else encountered this or know of a fix..
see code below! ARG!
My Parent and scrollRect MovieClip
Code:
public function CollectionImageScroller(imageArray:Array)
{
collectionImageScrollRect = new MovieClip();
collectionImageScrollRect.scrollRect = new Rectangle(0, 0, 0, 0);
collectionImagePathArrayFromXmlLoad = imageArray;
if(collectionImagePathArrayFromXmlLoad.length > 0)
{
collectionImages = new Array();
loadCollectionImage(collectionImagePathArrayFromXmlLoad[0]);
}
else
{
//display no images
}
}
function loadCollectionImage(imageUrl:String):void {
loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.INIT, showLoading);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, initListener);
loader.load(new URLRequest("http://jademichelle.tom.test" + imageUrl));
}
function showLoading(e:Event):void
{
removeEventListener(Event.INIT, showLoading);
loaderIcon = new mcLoaderIcon();
addChild(loaderIcon);
}
function initListener(event:Event):void {
removeChild(loaderIcon);
var currentImage:DisplayObject = loader.content;
maxImageWidth = (maxImageWidth > currentImage.width) ? maxImageWidth : currentImage.width;
maxImageHeight = (maxImageHeight > currentImage.height) ? maxImageHeight : currentImage.height;
currentImage.x = currentImageX;
collectionImageScrollRect.addChild(currentImage);
currentImageX = currentImageX + currentImage.width + 5;
p++;
collectionImages.push(currentImage);
if (p < collectionImagePathArrayFromXmlLoad.length) {
loadCollectionImage(collectionImagePathArrayFromXmlLoad[p]);//create loop
}
if (p == collectionImagePathArrayFromXmlLoad.length) {
//do when done
this.graphics.drawRect(0,0, maxImageWidth, maxImageHeight);
collectionImageScrollRect.scrollRect = new Rectangle(0, 0, (maxImageWidth + 30), maxImageHeight);
addChild(collectionImageScrollRect);
var leftGradBorder:MovieClip = new mcGradBorder();
leftGradBorder.x = -5;
leftGradBorder.height = (maxImageHeight + 5);
addChild(leftGradBorder);
var rightGradBorder:MovieClip = new mcGradBorderRight();
rightGradBorder.x = maxImageWidth - 20;
rightGradBorder.height = (maxImageHeight + 5);
addChild(rightGradBorder);
collectionImageScrollRect.addEventListener(MouseEvent.CLICK, scrollMe);
dispatchEvent(new Event("CollectionImagesLoaded", true, false));
p=0;
}
}
function scrollMe(e:MouseEvent):void
{
rect = collectionImageScrollRect.scrollRect;
trace("rectx" + rect.x + "currentimgindex" + currentImageIndex);
TweenLite.to(rect, 1, {x:(rect.x + collectionImages[currentImageIndex].width + 5),onUpdate:updateScrollRect, onComplete:function() { currentImageIndex++; }});
}
function updateScrollRect()
{
collectionImageScrollRect.scrollRect = rect;
}
My Document Class handling scaling:
Code:
function setBackground():void {
if(collectionScroller != null)
{
collectionScroller.width = stage.stageWidth / 3;
collectionScroller.height = stage.stageHeight / 3;
collectionScroller.scaleX <= collectionScroller.scaleY ? (collectionScroller.scaleX = collectionScroller.scaleY) : (collectionScroller.scaleY = collectionScroller.scaleX);
collectionScroller.x = stage.stageWidth / 2 - (collectionScroller.width / 2);
collectionScroller.y = 100;
trace(collectionScroller.CalculatedWidth);
}
}
function positionCollectionImages(e:Event):void
{
removeEventListener("CollectionImagesLoaded", positionCollectionImages);
trace("MOOOOO");
trace("CALCULATED WIDTH " + collectionScroller.CalculatedWidth + " collectionscrollerx" + collectionScroller.x + " collectionscrollerwidth" + collectionScroller.width + " maximagewidth" + collectionScroller.MaxImageWidth);
collectionScroller.x = (stage.stageWidth / 2) - (collectionScroller.CalculatedWidth / 2);
collectionScroller.alpha = 1;
collectionScroller.visible = true;
//TweenLite.to(collectionScroller,1,{alpha:1});
setBackground();
}
Empty A DisplayObject
Is there a way to completely empty a displayobject of all children without referencing them directly (e.g. removeChild(x)).
Interface For DisplayObject?
I find myself often making interfaces for custom class that extends Sprite.
ActionScript Code:
var fudcake:IFun = new Bar(); // extends Sprite
//
// later on....
fudcake.x = 20;
However at some point I often need to access a property "fudcake" as a displayobject and not just the interface that I've created. Is there a undocumented IDisplayObject, or is my logic in recasting my "fudcake" bad OO? Or should I just make my own IDisplayObject interface and have IFun extend it?
Currently I just tend to cast fudcake like so DisplayObject(fudcake).x = 20, and get on with life.
How To Clone A DisplayObject.
I have not had any success when trying to clone any type of displayObject.
I was hoping to fined a class to make this work as followed.
ActionScript Code:
var sprite1:Sprite = new Sprite();
var sprite2:Sprite = sprite1.clone();
Why do you thing adobe skipped something so common as cloning a displayObject?
thanks
- Josh Chernoff.
Class DisplayObject
Hello,
I created a Class that builds a menu. I then add it to the stage.
How can I find out if the checkbox that is in the menu is checked?
HTML Code:
package {
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.controls.CheckBox;
public class MainMenu extends Sprite
{
private var cb:CheckBox=new CheckBox;
public function MainMenu(){
CreateCheckBox();
}
public function CreateCheckBox(){
cb=new CheckBox;
cb.label="Select here";
addChild(cb);
}
}
}
If I click the button I get following error: 1119: Access of possibly undefined property cb through a reference with static type flash.displayisplayObject.
HTML Code:
import flash.display.Sprite;
import fl.controls.Button;
import fl.controls.CheckBox;
var myMainMenu:MainMenu=new MainMenu();
addChild(myMainMenu);
var myButton:Button=new Button();
addChild(myButton);
myButton.x=100;
myButton.addEventListener(MouseEvent.CLICK, myButtonF);
function myButtonF(event:MouseEvent):void {
//Find out if checkbox is seleted.
trace("CheckBox "+getChildByName("myMainMenu").cb.selected)
}
Get Ref To Stage Without DisplayObject?
Is it possible for a class to get a reference to stage without using a DisplayObject?
I mean, the stage is static, so why am I essentially initializing a class to get it?
DisplayObject To MovieClip
Hello,
how do I use the MovieClip class methods like gotoAndPlay() and hitTest() on a child that's been added to the stage? Is there any way to "convert" the DisplayObject to a MovieClip, or perhaps let the DisplayObject inherit the MovieClip's methods?
DisplayObject Property
Hi,
Is there any way of finding out (or does anyone know) what the DisplayObject class's EventDispatcher property is called?
Thank you for your help.
Regards, snapple :]
DisplayObject Serializing
hi,
is anyway to serilaize a display object. i am having a movieclip which i need to serialize and to store, recover back.
appreciate your valuable discussion.
Displayobject Confusion
I'm trying to make sense of why this line doesn't work:
getChildByName('sprite_1_name').addChild(sprite_2)
while these do:
getChildByName('sprite_1_name').x = 100;
sprite_1.addChild(sprite_2);
(generates the error: 1061: Call to a possibly undefined method addChild through a reference with static type flash.display:DisplayObject.)
Is there something special with the addChild function?
Is it because the getChildByName function doesn't reference the container part of the object?
Any info would be appreciated.
Thanks!
Here's the full code:
Code:
var sprite_1:Sprite = new Sprite();
sprite_1.name = "sprite_1_name";
var sprite_2:Sprite = new Sprite();
sprite_2.name = "sprite_2_name";
addChild(sprite_1);
getChildByName('sprite_1_name').addChild(sprite_2) // doesn't work
getChildByName('sprite_1_name').x = 100; // works
sprite_1.addChild(sprite_2); // works
DisplayObject Is Not Created
I have 2 sprite which I create near the beginning of my video application. A bg and screenOverlay. On the first load of the file all is good but when I navigate away and then return to the swf my bg and screenOverlay do not get added to the displayList. I have a example up here at www.tsj4.com
Here is a example of the code which creates the bg sprite
Attach Code
public function BTPlayer():void
{
flashVars = root.loaderInfo.parameters;
contentPath = flashVars["contentPath"];
forceDNA = flashVars["forceDNA"];
thumbPath = flashVars["thumbPath"];
autoPlay = parse_bool( true, flashVars["autoPlay"] );
debugMode = parse_bool( true, flashVars["debugMode"] );
testBandwidth = parse_bool( true, flashVars["testBandwidth"]);
var tempTint:String = flashVars["tint"];
tint = setControllerTint(tempTint);
init();
}
public function init():void
{
t = new Timer(inactiveTime);
stage.addEventListener(MouseEvent.MOUSE_MOVE, stage_onMouseMove);
t.addEventListener(TimerEvent.TIMER, onTimer);
t.start();
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, onResize);
stage.addEventListener(Event.MOUSE_LEAVE, stage_onMouseLeave);
stage.addEventListener(MouseEvent.MOUSE_OVER, stage_onMouseOver);
bg = new Sprite();
bg.graphics.lineStyle();
bg.graphics.beginFill(0x000000, 1);
bg.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
bg.graphics.endFill();
stage.addChild(bg);
if (debugMode == true ) {
stage.addChild(new Output(stage));
Output.trace("FlashVars ----------")
Output.trace("autoPlay : "+autoPlay);
Output.trace("contentPath : "+contentPath);
Output.trace("thumbPath : "+thumbPath);
Output.trace("forceDNA : "+forceDNA);
Output.trace("debugMode : "+debugMode);
Output.trace("tint : "+tint.toString());
Output.trace("testBandwidth : "+testBandwidth);
Output.trace("---------------------"+"
" );
}
if (thumbPath != null) {
thumbLoader = new Loader();
thumbRequest = new URLRequest(thumbPath);
thumbLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, thumb_onLoadComplete);
}
if (testBandwidth == true) {
stage.addChild(initLoaderSP);
bandwidthTester = new BandwidthTest(bandwidthTestAssetURL);
bandwidthTester.addEventListener(Event.COMPLETE, onBandwidthTest);
bandwidthTester.test();
} else {
constructPlayer();
}
try {
if (logPath != null){
logUrlVars.sessionId = new Date().getTime();
logEventToServer("playerInitialized");
}
} catch (error:IOError){
Output.trace("<Error> " + error.message);
}
}
Edited: 09/04/2008 at 05:34:58 PM by breez11
[as3] DisplayObject -> ByteArray
Is there any way to convert any displayObject to ByteArray ?
I can of course iterate through pixels, but thats not what i was thinking about, I would like to write ie MovieClip into ByteArray, and then read it back as it was.
writeObject doesnt work for DisplayObjects.
mooska
DisplayObject.x Behaviour ?
Hi guys,
After an hour of frustration I noticed that the DisplayObject.x and DisplayObject.y values don't behave the same way that a Number does. I was adding a small increment to them, over and over, and they weren't increasing.
I did the exact same operation on a Point.x and Point.y and it worked as expected.
Is there a reason for this ?
Thanks.
DisplayObject Serializing
hi,
is anyway to serilaize a display object. i am having a movieclip which i need to serialize and to store, recover back.
appreciate your valuable discussion.
[AS3] Another DisplayObject Issu
Hi all,
I've run into a problem many others have, which is removing a loaded bitmap from my displayList. Even though i can manipulate it (eg set alpha value). It still throws an error when trying to nullify or remove it [The supplied DisplayObject must be a child of the caller].
I've Googled plenty and tried all solutions I came across, but none helped sofar. My class is posted below, the functions we're talking about are "removePreviousImage" and "loaded".
If someone could help me out (and preferrably explain it :-) ) you'd make ma a happy man!
Code:
package home{
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.display.Loader;
import flash.display.*;
import flash.events.*;
import flash.net.*;
import flash.events.*;
import flash.utils.Timer;
import caurina.transitions.Tweener;
public class HomeImageCaroussel extends MovieClip{
private var siteData:Array;
private var homeImageContainer:MovieClip;
private var imageLoader:Loader;
private var homeImageTimerDisplay:MovieClip;
private var imageCount:int;
private var loaderVisual:MovieClip;
private var carousselTimer:Timer;
privatevar imgContainer:MovieClip;
public function HomeImageCaroussel(_siteData:Array){
siteData = _siteData;
imageCount = 0;
createImageContainer()
buildUI();
startCaroussel();
}
private function createImageContainer():void{
homeImageContainer = new MovieClip();
addChild(homeImageContainer);
}
private function buildUI():void{
homeImageTimerDisplay = new timerDisplay();
homeImageTimerDisplay.x = 714;
homeImageTimerDisplay.y = 20;
homeImageTimerDisplay.timerProgressBar.width = 0;
homeImageContainer.addChild(homeImageTimerDisplay)
}
private function startCaroussel():void{
//Add visual Loader
startImageLoad();
if(imageCount == 1){
return; // dont't start timer until first image is loaded
}
else{
startTimer();
}
}
private function startImageLoad(){
// Visual repereesentation of Loader
loaderVisual = new homeLoaderVisual();
loaderVisual.y = 450;
loaderVisual.width = 0;
loaderVisual.height = 20;
loaderVisual.alpha = .1;
homeImageContainer.addChild(loaderVisual);
//Load Image
var img_request:URLRequest = new URLRequest("img/" + siteData[imageCount].itemUrl)
imageLoader = new Loader();
imageLoader.load(img_request);
//Add load listeners
imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaded);
imageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, showLoadProgress);
imageLoader.y = 40;
imageCount ++;
}
private function loaded(ev:Event):void{
var bitmap:Bitmap = Bitmap(imageLoader.content)
// Create image container
imgContainer = new MovieClip();
imgContainer.alpha = 0;
imgContainer.x = imageCount * 10;
imgContainer.y = 40;
imgContainer.addChild(bitmap);
imgContainer.name = "img_" + (imageCount-1);
homeImageContainer.addChild(imgContainer);
//imageLoader.unload(); //Throws Error
//Only start timer at first image,
//at all other occasions the timer
//will restart itself
if(imageCount == 1){
showImage(homeImageContainer.getChildByName("img_" + (imageCount-1)))
startTimer();
}
}
private function showLoadProgress(ev:Event){
var percentageLoaded:uint = (ev.target.bytesLoaded / ev.target.bytesTotal) *100;
Tweener.addTween(loaderVisual, {width:Math.round(percentageLoaded * 8.14), time:.1, transition:"linear"});
}
private function showImage(myImage:DisplayObject){
Tweener.addTween(myImage, {alpha:1, time:1, delay:.2, transition:"easeInExpo", onComplete:removePreviousImage});
}
private function removePreviousImage(){
if(homeImageContainer.getChildByName("img_" + (imageCount-3)) == null){
return;
}
else{
//removeChild(homeImageContainer.getChildByName("img_0")); // Gives Error [The supplied DisplayObject must be a child of the caller]
var myObject:DisplayObject = homeImageContainer.getChildByName("img_" + (imageCount-3));
trace("myObject_0: " + myObject.name); //traces The right image name
myObject.alpha = .5;//Set the alpha value on the correct image!
myObject = null;
trace("myObject_1: " + myObject); //traces null
trace("myObject_2: " + homeImageContainer.getChildByName("img_" + (imageCount-3))); //traces [object movieclip]
}
}
//*************************************
//TIMER - START NEW LOAD
//*************************************
private function startTimer(){
Tweener.addTween(homeImageTimerDisplay.timerProgressBar, {width:0, time:.2, delay:.2, transition:"easeInExpo"});
carousselTimer = new Timer(20,100);
carousselTimer.addEventListener(TimerEvent.TIMER,onTimerUpdate)
carousselTimer.addEventListener(TimerEvent.TIMER_COMPLETE,onTimerComplete)
carousselTimer.start();
trace("starttimer")
startImageLoad();
}
private function onTimerUpdate(ev:Event){
Tweener.addTween(homeImageTimerDisplay.timerProgressBar, {width:ev.target.currentCount, time:.6, transition:"linear"});
}
private function onTimerComplete(ev:Event){
showImage(homeImageContainer.getChildByName("img_" + (imageCount-1)))
startTimer();
}
}
}
|