If you’re setting the _doc x and y, width and height, but not scaling the _wrap, the _wrap canvas will cut off the _doc canvas’s overlap by default. But it sounds like you got it working well.

Let me know if you come up with something cool based on the ImageResizer class.

The function:

private function alignDoc():void {

if(_doc.width > _wrap.width){
_doc.x = 0;
_wrap.horizontalScrollPosition = (_doc.width / 2) - (_wrap.width / 2);
}
if(_doc.height > _wrap.height){
_doc.y = 0;
_wrap.verticalScrollPosition = (_doc.height / 2) - (_wrap.height / 2);
}
if(_doc.width < _wrap.width) {
_doc.x = (_wrap.width / 2) - (_doc.width / 2);
}
if(_doc.height < _wrap.height){
_doc.y = (_wrap.height / 2) - (_doc.height / 2);
}
}


I also called this function from creationComplete on the application tag which fix the center of the _doc when the application loads. I’ll try to implement this concept into your class to see what I can accomplish

Thanks for your time and sorry for making so many questions.
Best regards!

if(_doc.width > _wrap.width){
_doc.width = ImageResizer.calcX(_wrap.x,_wrap.width,_doc.width);
_doc.height = ImageResizer.calcY(_wrap.y,_wrap.height,_doc.height);

}

Keep in mind one thing though, if you’re setting the scroll position, you’re probably also forcing the _doc Canvas to change its position without knowing how it will interact with the ImageResizer static functions.

Right now, you’re changing _doc.x explicitly and you’re setting the scroll position. So really, you just told Flex to change _doc.x twice.

You’ll either have to remove that explicit setting of _doc.x and use the calcX calcY functions instead (I would try that first and comment the rest out as a test) or just make sure you’re not changing _doc.x two times by just tracing _doc.x right where you set the scroll bar position.

To sum it up, I think the problem you’re having is by changing scroll position explicitly, Flex is changing _doc.x within its parent _wrap Canvas AND you’re explicitly setting _doc.x at the same time, so they’re fighting each other.

Let me know how the test goes but that should work fine.

Could you give me an example?

The code it’s just it Allow me to explain it:
_wrap = Canvas
_doc = Canvas inside _wrap ( _wrap.addChild(_doc) )

if(_doc.width > _wrap.width){
//> add 30px to _doc.x and adjust the scrollbar position to 50%, like this:
_doc.x = 30;
_wrap.horizontalScrollPosition = _wrap.horizontalScrollBar.width / 2;
}
if(_doc.height > _wrap.height){
//> add 30 px to y and fix the vertical scrollbar (center just like the horizontal. The point is, when you zoom it, the scrollbar should be placed always at the middle so you can scroll to the left and right.
_doc.y = 30;
_wrap.verticalScrollPosition = _wrap.verticalScrollBar.height / 2;
}

if(_doc.width this line makes the _doc be centere inside the _wrap. The +8 its the pixels relative to the shadow effect which I already excluded.
_doc.x = (_wrap.width / 2) – (_doc.width / 2);
}
if(_doc.width this line also do the centering.
_doc.y = (_wrap.height / 2) – (_doc.height / 2);
}
}

So, as you see, its a really straight forwards and simple function. The way I see it, it supposed to work but it don’t. The last 2 IFs works fine because the _doc is smaller than _wrap. There is no scrollbar to fix and A/2 – B/2 works just fine. My best guess its that the first 2 IFs are wrong.
Or maybe the problem is with the slider. I tested the same function using 2 buttons and autoRepeat and everything worked OK. Then, I tested the slider values and I found out that when I change the slider from one side to the another (-10 to 200) by clicking the track or by slinding it really fast, the slider will always return different values. Before you ask, I put the slider.value inside a int().

Thanks and sorry for the looong text

It’s probably just the math. Without seeing more of your code, I can’t say for sure. But I did notice in the code you pasted:

if(_doc.width < _wrap.width) {
_doc.x = (_wrap.width – (_doc.width + 8)) /2;
}
if(_doc.width < _wrap.width){
_doc.y = (_wrap.height – _doc.height) /2;
}

You have two conditionals to check if(_doc.width < _wrap.width){} Did you mean to check height on the second conditional?

Either way, if you do your conditionals and use the static calcX and calcY methods in the ImageResizer class, it’ll correctly position the Canvas in its parent.

if(_doc.width > _wrap.width){
_doc.x = 30;
_wrap.horizontalScrollBar.setStyle(“thumbWidth”, 100);
_wrap.horizontalScrollPosition = _wrap.horizontalScrollBar.width / 2;
}
if(_doc.height > _wrap.height){
_doc.y = 30;
_wrap.verticalScrollPosition = _wrap.verticalScrollBar.height / 2;
}

if(_doc.width < _wrap.width) {
_doc.x = (_wrap.width – (_doc.width + 8)) /2;
}
if(_doc.width < _wrap.width){
_doc.y = (_wrap.height – _doc.height) /2;
}
}
/* ———————– */

I wonder… it is a bug on Flex or in my head…?

I appreciate ANY help… Thanks!

change=”doChangeSize(event)”

problem solved