Помогни ни да направим Uroci.net по - богат! Добави урок

Преоразмеряване картинка във Flash

accorp   трудност:    видян: 12772

 
Тези от вас, които са преоразмерявали заредени картинки или обобщено казано — преоразмерявали някаква растерна графика в MovieClip знаят, че качеството се влошава, пикселизира се, и независимо от точността на кода нещата не се подобряват.
 
На помощ идва един външен за ActionScript 2.0 клас, с който ще направим "гладко" изображение. Този клас се нарича BitmapData, а конструкцията е следната:

var bmp:BitmapData = new BitmapData(width:Number, height:Number [, transparent:Boolean, fillColor:Number]);
 
1. Като за начало ще трябва да "извикаме" клас BitmapData тъй като той е външен, а по-късно ще ни трябва:

import flash.display.BitmapData;

След като направим това вече ще имаме достъп до този клас, както и до методите му, който ще са необходими.
 
2. Ще направим два празни MovieClip-a, както и един клип, който ще представлява основния Timeline. Доста удобна техника за адресиране на "основата":

var home:MovieClip = this;
var holder:MovieClip = home.createEmptyMovieClip("holder", 1);
var holder2:MovieClip = home.createEmptyMovieClip("holder2", 2);
holder2.loadMovie("picture.jpg");


home е основния Timeline, а holder1 и holder2 са двата контейнера, в които ще преоразмеряване. Единият ще бъде с обикновено преоразмеряване, затова можем веднага да заредим в него картинката (последния ред горе).

Картинката която зареждам ("picture.jpg") е голям правоъгълник, страните му са значително по-големи от 500 px, а аз ще го преоразмеря, така че по-голямата страна да е 500 пискела, а по-малката — според съотношението им.
 
3. Вече имаме зареждане, но дори и да тествате анимацията локално може да даде бъгове, затова обичам да правя периодични проверки:

home.onEnterFrame = function(){
if(holder2._width != 0){
delete this.onEnterFrame;


Няма да се впускам в подробни обяснения. Просто казано: когато картинката се зареди в празния MovieClip дължината му ще е по-голяма от 0. Когато това стане ще започне с действията.

var bmp:BitmapData = new BitmapData(holder2._width, holder2._height);
bmp.draw(holder2);
holder.attachBitmap(bmp,1,"auto",true);


Както и сами виждате декларираме наша си променлива, представляваща инстанция на клас BitmapData. Тъй като оперирането с нея е доста трудно (визирам прикачването и взимането на растерна графика) се налага да да използваме контейнера holder2, а и ще видите разликите много лесно. За сега ще продължим с тази конструкция на кода, но може да се експериментира в оптимизиране.

Метода draw е значително семпъл. Прикачваме към bmp съдържанието на holder2, където заредихме картинката, т.е. вече можем да се възползваме от attachBitmap.
 
Конструкцията на attachBitmap:

attachBitmap(bmp:flash.display.BitmapData, depth:Number [, pixelSnapping:String, smoothing:Boolean]);

Обърнете внимание на последния параметър smoothing — булева променлива, при стойност true ще предотврати пикселизирането.
 
4. Основната работа е свършена, затова просто ще ви покажа скрипта който използвах за преоразмеряване до 500px:

var newWidth:Number = 500;
var newHeight:Number = 500;
var $width:Number = holder._width;
var $height:Number = holder._height;
if($width > newWidth || $height > newHeight){
if($width >= $height){
var r:Number = $width / $height;
newHeight = newWidth / r;
}else{
var r:Number = $height / $width;
newWidth = newHeight / r;
}
holder._width = holder2._width = newWidth;
holder._height = holder2._height = newHeight;
holder2._x = holder._width;


Проверяваме дали една от страните е по-голяма от 500 пиксела, проверяваме коя е по-голяма и изчисляваме съотношението, на базата на което оразмеряваме по-малката страна.
 
5. Ще добавим и две текстови полета:
 
var frm:TextFormat = new TextFormat();
frm.align = "center";
frm.font = "Verdana";
frm.size = 10;
var text1:TextField = home.createTextField("text1",3,holder._x,holder._height,holder._width,17);
var text2:TextField = home.createTextField("text2",4,holder2._x,holder._height,holder._width,17);
text1.text = "Using BitmapData class";
text2.text = "Usual resizing";
text1.setTextFormat(frm);
text2.setTextFormat(frm);
}
}
}
 
И това е всичко.
 Работните файлове от урока.
Автор: accorp



Коментари (2)

simeonkata на 11.05 2008 в 15:49ч.
не мога да изтегля ффайловете от урока защо ????? help !!!
gogsi на 11.04 2010 в 17:32ч.
няма смисъл от това има много по- лесен начин
без скрипт.

Регистрирайте се, за да добавите коментар


Калдейта ЕООД - © 2003-2010. Всички права запазени.
Препоръчваме: Национален Бизнес | Bomba.bg | IT Новини | Диплома.бг | TRAVEL туризъм | Реферати | AmAm.bg | Иде.ли | Курсови работи | Фото Форум | Spodeli.net | Фото-Култ | Atol.bg | Elmaz.com | MobileBulgaria.com | Казанлък.Com