Groups | Blog | Home
all groups > flash (macromedia) > october 2007 >

flash (macromedia) : Rotate JPG or PNG


soloam
10/7/2007 8:44:48 PM
Hello
I'm doing a website and a i have to put some images imported from a file (by
actionscript), the problem is that the images must be rotated, but when i
rotate the images loses quality, for example the lines look like stairs lol.
(sorry my bad English, lol). The image looks great when strait, but when
rotated... :s

What i'm doing wrong? I import the image to a holder by loadMovie, the holder
is the exact size of the image and i have tried to import jpg and png, and the
problem is the same... I have tried to put the jpeg quality to the max and the
movie quality to the best... No changes...

Can any one help me?
dzedward
10/7/2007 9:44:37 PM
the image must be vector for flash to be able to manipulate it with no loss of quality.

soloam
10/7/2007 10:01:46 PM
aniebel
10/8/2007 12:00:00 AM
No, rotating images will affect their quality. Not sure if you can do anything
about it since you're not controlling the images coming in but I have, in the
past, created two images... one regular and one rotated from Photoshop (or
Fireworks)... and tweened my regular image to rotate, only replacing it in the
very last frame with the previously rotated image. Otherwise, the final image
that sits there will look like crap.
clbeech
10/8/2007 3:17:18 PM
Hey guys, I've been following this one a little and got to thinking about using
some methods from the BitmapData class. As it turns out, you can increase the
quality of the image in rotation somewhat, by converting it to a BitmapData
Object and then appling the rotation, this is a little cumbersome, but does
seem to have the effect of increasing the image quality. I've set up an
example comparison code here, using a jpg image at 72 dpi res, from my sever,
just as an example, try it with some of your own images as well and see what
you think, I think it shows improvement. Here's the code, just set a Stage to
600x400 and it'll do the rest:


//set Stage to 600x400
stop();
import flash.display.BitmapData;

var mcA = this.createEmptyMovieClip('mcA', 0);
var mcB = this.createEmptyMovieClip('mcB', 1);
var imgA = mcA.createEmptyMovieClip('imgA', 0);
var imgB = mcB.createEmptyMovieClip('imgB', 0);
mcA._x = 150;
mcA._y = 200;
mcB._x = 450;
mcB._y = 200;

var mcl = new MovieClipLoader();
var lstn = new Object();
mcl.addListener(lstn);

lstn.onLoadInit = function(clip) {
if(clip == mcA.imgA) {
mcA.imgA._x -= mcA.imgA._width/2;
mcA.imgA._y -= mcA.imgA._height/2;
mcA._rotation = 20;
}else if(clip == mcB.imgB){
convert();
}

}

mcl.loadClip('http://www.beechstudios.com/fineart/amos.jpg', mcA.imgA);
mcl.loadClip('http://www.beechstudios.com/fineart/amos.jpg', mcB.imgB);

function convert() {
var ibmp = new BitmapData(mcB.imgB._width, mcB.imgB._height, false);
mcB.attachBitmap(ibmp, 1, 'auto', true);
ibmp.draw(mcB.imgB);
mcB._x -= mcB.imgB._width/2;
mcB._y -= mcB.imgB._height/2;
mcB.imgB.removeMovieClip();
mcB._rotation = 20;
}
dzedward
10/8/2007 4:21:54 PM
Nice work, chris (hopefully i haven't forgotten), here is a little example with
an image that looks horrible if rotated, png with transparency 72dpi
http://www.imediapro.com/damonTesting/test/testRotate.html
dzedward
10/8/2007 4:25:12 PM
uh o, if I change the background color, i notice my transparency is gone off
the image. I'm thinking maybe a way to iterate through the pixels and give
them transparency, but I'm not worried about it enough to work on it. Good
work though.
clbeech
10/8/2007 4:38:57 PM
Hey thanks damon, (yeah that's me ;) It really does make a difference doesn't
it, and it's REALLY appearent in your image there.

I think to solve for transparency, change the bmp line to:


var ibmp = new BitmapData(mcB.imgB._width, mcB.imgB._height, true, 0);
dzedward
10/8/2007 4:47:00 PM
clbeech
10/8/2007 4:52:24 PM
sweet! I'm gald that worked, pulled it out of my ... :)

aniebel
10/8/2007 5:20:30 PM
clbeech
10/8/2007 5:40:00 PM
soloam
10/11/2007 12:24:43 AM
AddThis Social Bookmark Button