Add movieclip as child of another movieclip = no display

[Spudhead]

var myContainer:MovieClip = new MovieClip();
myContainer.x = 50;
myContainer.y = 0;
myContainer.width = 300;
myContainer.height = 300;


var mySlideShow = new FeaturedPanel();
myContainer.addChild(mySlideShow);
mySlideShow.setSlideshowRoot("commercial");
mySlideShow.loadSlideshowData();
stage.addEventListener(Event.ENTER_FRAME, scrollImages);


stage.addChild(myContainer);

The FeaturedPanel is a slightly cannibalised version of the class posted here (http://www.actionscript.org/forums/showpost.php3?p=690168&postcount=2), which extends MovieClip.

If I add it as a child of the stage, it displays fine. But it takes up the whole stage width, and I don't want that. The obvious solution seemed to be to put it in a container MovieClip, but when I do that, nothing displays.

I hate being a n00b at stuff :(

[Bombdogs]

Can you not scale it directly?

var mySlideShow = new FeaturedPanel();
mySlideShow.scaleX = 0.5;
mySlideShow.scaleY = 0.5;
stage.addChild(mySlideShow);

& the only reason I can think of for your current code not working is that these...

mySlideShow.setSlideshowRoot("commercial");
mySlideShow.loadSlideshowData();

appear before the container is added to the stage. They may need a reference to the stage to work & they won't have one until it's been added. Try putting these methods after stage.addChild(myContainer);

PMF

[Spudhead]

I don't want to scale it - I want to crop it into a box. If I scale it, the thumbnails get reduced in size.

I've done some more poking at this and the problem seems to be to do with constraining the slideshow width: if I try to set the width on the slideshow directly, or put it in a container with a set width, nothing is displayed. But I can put it in a container with no width set, and it'll display fine.

Ok, screw it: here's all the code. It's a mess - especially the Dynamic Registration thing, which I couldn't get working as a seperate class so I just dropped the whole lot into the FeaturedThumb class. I know it's a lot of code to trawl through, but if anyone wants to suggest anything - up to and including "You've jumped in at the deep end. Go back to Javascript and HTML until you've figured this Flash thing out" - I'd be massively grateful.... :rolleyes:

buttons.fla

import com.ben.slideshow.*;

function scrollImages(evt:Event):void{
var percentage:Number = mouseX/(stage.stageWidth - 15);
var mouseSpeed:Number = -(percentage);
var newX:Number = Math.round((mySlideShow.width-stage.stageWidth) * mouseSpeed);
mySlideShow.x += Math.ceil((newX-mySlideShow.x)*(0.1));
}

Security.allowDomain("http://www.bencasey.co.uk/");

var myContainer:MovieClip = new MovieClip();
myContainer.x = 50;
myContainer.y = 0;
//myContainer.width = 300;
stage.addChild(myContainer);

var mySlideShow = new FeaturedPanel();
mySlideShow.setSlideshowRoot("commercial");
mySlideShow.loadSlideshowData();
myContainer.addChild(mySlideShow);
stage.addEventListener(Event.ENTER_FRAME, scrollImages);



FeaturedPanel.as
package com.ben.slideshow{

import flash.display.*;
import flash.events.*;
import flash.net.URLRequest;
import flash.net.URLLoader;

import com.pixelfumes.reflect.*

public class FeaturedPanel extends MovieClip{

private var _images:Array;
private var _bitmaps:Array;
private var _thumbs:Array;

private var _srv:URLRequest; //URL Service
private var _xmlLoader:URLLoader; //XML Loader
private var _xpos:Number = 0; //Used when placing the Images.

private var _slideShowRoot:String;

public var imageGap:Number = 5; //Gap (in px) between Images


public function FeaturedPanel(){
super();
_images = new Array(); //Initialize the arrays
_bitmaps = new Array();
}

public function setSlideshowRoot(slideshow:String){
_slideShowRoot = "http://www.bencasey.co.uk/flash/images/" + slideshow;
}

public function loadSlideshowData():void{
var xmlPath = _slideShowRoot + "/data.xml"
_xmlLoader = new URLLoader();
_xmlLoader.addEventListener(Event.COMPLETE, buildGallery);
_xmlLoader.addEventListener(IOErrorEvent.IO_ERROR, XMLLoadErrorHandler);
_srv = new URLRequest(xmlPath);
_srv.method = "GET";
_xmlLoader.load(_srv);
}

private function XMLLoadErrorHandler(errorEvent:IOErrorEvent):void{
trace("Error loading image list");
}

public function getPhotos():void{
_xmlLoader.load(_srv);
}

private function buildGallery(e:Event):void{

//Get XML data
var xml:XML = new XML(_xmlLoader.data);

//Build the Image Array
for each(var xmlImage:Object in xml.images.image){

//Create a new data object
var obj:Object = new Object();

obj.mainImagePath = String(xmlImage.file);
obj.thumbImagePath = String(obj.mainImagePath.replace(".jpg", "-t.jpg"));
obj.imageOrientation = String(xmlImage.orientation);
obj.imageCaption = String(xmlImage.caption);

obj.loader = new Loader();
obj.loader.contentLoaderInfo.addEventListener( Event.COMPLETE, imageCompleteHandler );

//Add Data Object to _images Array
_images.push(obj);

}

//Load The Images
var thisImageURL:String;
for each(var imageObj:Object in _images){
thisImageURL = _slideShowRoot + "/" + imageObj.thumbImagePath;
imageObj.loader.load( new URLRequest(thisImageURL) );
}
}

private function imageCompleteHandler(e:Event):void{
//Create and size the bitmaps
var bmp:Bitmap = Loader(e.target.loader).content as Bitmap;
bmp.width = 80;
bmp.height = 80;
//Add it to the _bitmaps Array
_bitmaps.push(bmp);

if( _bitmaps.length == _images.length )
display();
}

private function display():void{
//All bitmaps have been loaded

for each( var bmp:Bitmap in _bitmaps ){
placeBitmap(bmp);
}
this.x = (stage.stageWidth / 2) - (this.width / 2);
this.y = 10;
}

private function placeBitmap(image:Bitmap):void{
//Image Spacing and X position
var thumb:FeaturedThumb = new FeaturedThumb(image);
thumb.x = _xpos;
thumb.buttonMode = true;

//Set the current X position
_xpos += image.width + imageGap;

//Add the Thumb to the Panel
this.addChild(thumb);

//Set Registration Point
thumb.setRegistration(40, -10);
//Create Reflection
var ref:Reflect = new Reflect({mc:thumb, alpha:50, ratio:50, distance:0, updateTime:0, reflectionDropoff:.1});
//Initialize the Tweens
thumb.init();
}



}

}


FeaturedThumb.as
package com.ben.slideshow{

import flash.display.*;
import flash.events.*;
import fl.transitions.easing.Strong;
import fl.transitions.Tween;

import flash.display.MovieClip;
import flash.geom.Point;


public class FeaturedThumb extends MovieClip{

private var _bmp:Bitmap;
private var _border:Sprite;

private var _tweenXUp:Tween;
private var _tweenYUp:Tween;
private var _tweenXDown:Tween;
private var _tweenYDown:Tween;

public function FeaturedThumb(bmp:Bitmap){
super();
addChild(bmp);
_border = new Sprite();
_border.graphics.lineStyle(1, 0x808080);
_border.graphics.drawRect(0,0, 80, 80);
addChild(_border);
}

public function init():void{
addEventListener(MouseEvent.ROLL_OVER, grow);
addEventListener(MouseEvent.ROLL_OUT, shrink);

_tweenXUp = new Tween(this,'scaleX2',Strong.easeOut, 1, 1.2, .5, true);
_tweenYUp = new Tween(this,'scaleY2',Strong.easeOut, 1, 1.2, .5, true);
_tweenXDown = new Tween(this,'scaleX2',Strong.easeOut, 1.2, 1, .5, true);
_tweenYDown = new Tween(this,'scaleY2',Strong.easeOut, 1.2, 1, .5, true);
}

private function grow(e:MouseEvent=null):void{
if(_tweenXDown.isPlaying){
_tweenXDown.stop();
}
if(_tweenYDown.isPlaying){
_tweenYDown.stop();
}
_tweenXUp.start();
_tweenYUp.start();
}

private function shrink(e:MouseEvent=null):void{
if(_tweenXUp.isPlaying){
_tweenXUp.stop();
}
if(_tweenYUp.isPlaying){
_tweenYUp.stop();
}
_tweenXDown.start();
_tweenYDown.start();
}






/* Dynamic Registration
http://www.oscartrelles.com/archives/dynamic_movieclip_registration_with_as3
*/

public var rp:Point;

function DynamicSprite()
{
setRegistration();
}

public function setRegistration(x:Number=0, y:Number=0):void
{
rp = new Point(x, y);
}

public function get x2():Number
{
var p:Point = this.parent.globalToLocal(this.localToGlobal(rp));
return p.x;
}

public function set x2(value:Number):void
{
var p:Point = this.parent.globalToLocal(this.localToGlobal(rp));
this.x += value - p.x;
}

public function get y2():Number
{
var p:Point = this.parent.globalToLocal(this.localToGlobal(rp));
return p.y;
}

public function set y2(value:Number):void
{
var p:Point = this.parent.globalToLocal(this.localToGlobal(rp));
this.y += value - p.y;
}

public function get scaleX2():Number
{
return this.scaleX;
}

public function set scaleX2(value:Number):void
{
this.setProperty2("scaleX", value);
}

public function get scaleY2():Number
{
return this.scaleY;
}

public function set scaleY2(value:Number):void
{
this.setProperty2("scaleY", value);
}

public function get rotation2():Number
{
return this.rotation;
}

public function set rotation2(value:Number):void
{
this.setProperty2("rotation", value);
}

public function get mouseX2():Number
{
return Math.round(this.mouseX - rp.x);
}

public function get mouseY2():Number
{
return Math.round(this.mouseY - rp.y);
}

public function setProperty2(prop:String, n:Number):void
{
var a:Point = this.parent.globalToLocal(this.localToGlobal(rp));

this[prop] = n;

var b:Point = this.parent.globalToLocal(this.localToGlobal(rp));

this.x -= b.x - a.x;
this.y -= b.y - a.y;
}

}
}

The Reflect class I'll leave out cos it's an unedited version of Ben Pritchard's Reflect class (http://pixelfumes.blogspot.com/2006/06/actionscript-3-reflection-class-source.html), and commenting it out had no effect on the problem above.