Drawig a box enlarges an MC size? :/

[Leozack]

Here's a strange problem. I put the following code into flash 6 mx AS2

stageWidth = 400;
stageHeight = 300;

containerMC = this.createEmptyMovieClip("containerMC_mc", 1);

TestBorderSize = 2;

containerMC.lineStyle(10, 0x123123, 70);
containerMC.moveTo(TestBorderSize/2, TestBorderSize/2);
containerMC.lineTo((TestBorderSize/2)+stageWidth , TestBorderSize/2);
containerMC.lineTo((TestBorderSize/2)+stageWidth , (TestBorderSize/2)+stageHeight );
containerMC.lineTo(TestBorderSize/2, (TestBorderSize/2)+stageHeight );
containerMC.lineTo(TestBorderSize/2, TestBorderSize/2);

trace("ContainerW = " + containerMC._width + ", ContainerH = " + containerMC._height);

And it produces this "ContainerW = 420, ContainerH = 320".

I've no idea why this is happening but I can't continue my app now until someone shows me what the problem is

The result is a gap down the bottom and right side that is ruining all the layout, eg look here

http://www.actionscript.org/forums/attachment.php3?attachmentid=27517&d=1211973276

_________________________________
Leozack

MakeUniverse($infinity,1,42);

 

[Leozack]

You're right. I read up on which one has which as version once but forgot. Pays to be awake That rewrite works fine. Once I'm back from work I'll compare that with my current drawing/resizing operations and see what's different. Thanks for the help I'll keep you posted

_________________________________
Leozack

MakeUniverse($infinity,1,42);

 

[Leozack]

Ok so your code works standalone. But in my project I'm not redrawing things when the stage resizes, I'm calculating it all and then rescaling the containerMC when the stage resizes. Here's my resizing code

// Resize stage function
function resizeStage() {
    var stageW = Stage.width;
	var stageH = Stage.height;
	//trace("StageW = " + stageW + ", StageH = " + stageH + " ContainerW = " + containerMC._width + ", ContainerH = " + containerMC._height);
    if (stageW/stageH>ratio) {
        containerMC._height = stageH;
        containerMC._width = containerMC._height*ratio;
    } else {
        containerMC._width = stageW;
        containerMC._height = containerMC._width/ratio;
	}
    containerMC._x = Math.floor((stageW-containerMC._width)/2);
	
	scaleX = containerMC._width/StageWidth;
	scaleY = containerMC._height/StageHeight;
	infoX = containerMC._x + (infoOffsetX * scaleX);
	infoY = infoOffsetY * scaleY;
	infoContainerMC._x = Math.floor(infoX)
	infoContainerMC._y = Math.floor(infoY);
	infoContainerMC._xscale = scaleX * 100; //Math.floor(scaleX * 100);
	infoContainerMC._yscale = scaleY * 100; //Math.floor(scaleY * 100);
	// Comment out above line to stop the infobox text scaling (text keeps its size during resize)
	infoBorderMC._x = Math.floor(infoX);	
	infoBorderMC._y = Math.floor(infoY);
	infoBorderMC._xscale = scaleX * 100;
	infoBorderMC._yscale = scaleY * 100;
	trace(scaleX + " / " + scaleY);
};

// Stage resize monitor
var lo = new Object();
lo.onResize = function() {
   resizeStage();
};
Stage.addListener(lo);

And the border is drawn onto the containerMC like this

DrawBox(containerMC,bgColour,bgColour2,bgAlpha,10,10,stageWidth-20,stageHeight-20,20,0xFF0000,60);

which calls my drawbox function simplified below

function DrawBox(clip, bgColour1, bgColour2, bgAlpha, x, y, w, h, borderWidth, borderColour, borderAlpha){
	if ((bgColour2 != "none") && (bgColour1 != "none")) {
		fillType = "linear";
		colours = [bgColour1, bgColour2];
		alphas = [bgAlpha, bgAlpha];
		ratios = [0, 255];
		matrix = {matrixType:"box", x:x, y:y, w:w, h:h, r:270/180*Math.PI};
	}			
	clip.lineStyle(borderWidth, borderColour, borderAlpha);
	clip.moveTo(x, y);
	clip.beginGradientFill(fillType, colours, alphas, ratios, matrix);
	if ((bgColour2 != "none") && (bgColour1 != "none")) { clip.beginGradientFill(fillType, colours, alphas, ratios, matrix); }
	else { if (bgColour1 != "none") { clip.beginFill(bgColour1,bgAlpha); } }
	clip.lineTo(x+w, y);
	clip.lineTo(x+w, y+h);
	clip.lineTo(x, y+h);
	clip.lineTo(x, y);
	if (bgColour1 != "none") { clip.endFill (); }

};

You'll notice I'm repositioning/resizing infotext and infoborder at the same time as containerMC. This is because my info text is on its own layer above the app with rounded edge filtering applied, and then on another layer on top of that is the border around it with round edges. This is the only way I found to hvae scrollable text underneath a non rectangular obeject. AmI going to have to do the main background/border I'm struggling with in some disjointed fashion too? :/

Sorry it's been so long and sorry it's 3am and I'm tired as I write this after not touching this since getting stuck so I may have made errors or just be being stupid :\

_________________________________
Leozack

MakeUniverse($infinity,1,42);

 

[kennethkawamoto]

It's normal to rescale/reposition objects individually on Stage resize - if that is what you're asking

Kenneth Kawamoto

http://www.materiaprima.co.uk

 

[Leozack]

It is? I thought the purpose of a containerMC was t use as a root/base level layer so you only have to resize/rescale/reposition 1 thing?

_________________________________
Leozack

MakeUniverse($infinity,1,42);

 

[kennethkawamoto]

If you want to resize everything the same way, yes. if not, you will have separate objects. For example, you may want the background image to stretch to fill the entire Stage but you don't want the TextField to stretch but changes its dimension and position accordingly. In this case you can't have both elements in one MovieClip and stretch it to the Stage size.

Kenneth Kawamoto

http://www.materiaprima.co.uk

 

[Leozack]

I tried putting the border around the app on a seperate layer to the container (including the app background) and the other floating layers (above main container) and I then found the app container wasn't behaving right. There's always something!
So then I drew an invisible box filling the main container area and that somehow sorted all the positioning out ... don't ask me
Then I put both the background and the outside border onto a layer under the main container to get it all out the way, and now I think it's all sizing and working ok, though I do now have a lot of containers!!
The original design was size everything up according to sizes ina n xml file, then scale the whole container to the stagesize keeping ratio. That is still the design but now I have the background floating under the main container and some masked text and it's border box floating on top of the main container, both adjusting their position and scale on resize according to the main container.
Not sure why the main container needed the invisible box set to the full spec'd size of the app in order for things not to go awry though, but nevermind - everything seems to be working and that's with totally configurable sizes/fills/alphas/borders/borderalphas. Thanks for the potent help! Shame about the flash 6 bugs

_________________________________
Leozack

MakeUniverse($infinity,1,42);