Работа с рисунками
В нашем аквариуме будут три объекта: акула, медуза и морской конек.
info = new Array (["Акула", "image0.jpg"], ["Медуза", "image1.jpg"], ["Конек", "image2.jpg"]); MAX = info.length; i = random(MAX); newSlide ( i );
|
Информация об объектах записывается в массив info. Это особый массив, каждый элемент которого сам является массивом. То есть, можно было написать и так:
info = new Array();
info[0] = ["Акула", "image0.jpg"];
info[1] = ["Медуза", "image1.jpg"];
info[2] = ["Конек", "image2.jpg"];
Для объекта с номером i название находится в элементе info[i][0], а имя файла-рисунка — в info[i][1].
В переменную MAX записывается длина массива (количество объектов). Далее находим случайный номер объекта и вызываем функцию newSlide, которая выводит нужную информацию на экран:
название info[i][0] записывается в динамическое текстовое поле с именем name;
фотография (имя файла находится в info[i][1]) загружается в пустой клип picture, расположенный в левом верхнем углу области просмотра.
Фотографии имеют размер в два раза больше, чем нужно (по каждой стороне). Это сделано специально, чтобы можно было увеличить их щелчком мыши и увидеть детали. Поэтому перед загрузкой нужно установить для клипа масштаб 50 процентов.
Добавьте функции к коду кадра 1:
function newSlide ( no ) {
if ( no < 1 ) no = MAX;
if ( no > MAX ) no = 1;
slideNo = no;
name.text = info[no-1][0];
nitPicture();
loadMovie ( info[no-1][1], "picture" );
}
function initPicture() {
with ( picture ) {
_xscale = 50;
_yscale = 50;
}
}
В начале функции newSlide выполняется обработка неправильно заданного номера слайда, исправленный номер сохраняется в переменной slideNo. Затем в текстовое поле name выводится название животного, с помощью функции initPicture для клипа устанавливается масштаб 50% и в этот клип загружается рисунок с диска.
Поскольку в функции newSlide сделана защита от неправильно заданного номера, легко написать обработчики для кнопок-стрелок (переход к предыдущему и следующему объекту).
Добавьте код для кнопки-стрелки «влево»:
on ( release ){
newSlide ( slideNo - 1 );
}
и аналогично для стрелки «вправо». Проверьте работу кнопок.
Увеличение рисунка
Дальше мы сделаем, чтобы при щелчке мышкой рисунок увеличивался в два раза и перетаскивался мышкой. Для того, чтобы вернуть его на место, предварительно надо запомнить начальные координаты x0 и y0. Самое подходящее место для этого — обработчик события load.
При щелчке мышкой (событие mouseDown) проверяем, попадает ли точка щелчка на рисунок. Для этого применяем метод hitTest. Если попадает, то увеличиваем масштаб рисунка до 100% (полный размер) и начинаем перетаскивание.
При отпускании мыши (событие mouseUp) надо закончить перетаскивание, вернуть рисунок на прежнее место (в точку с координатами (x0,y0)) и установить масштаб 50%. Мы добавим эти возможности к функции initPicture. Так сделано специально, поскольку эта функция вызывается при загрузке нового слайда и все будет правильно работать даже тогда, когда происходит автоматическая смена слайда во время перетаскивания.
Выделите пустой клип с именем picture (он изображается кружком в левом верхнем углу области рисунка) и добавьте к нему обработчики
onClipEvent ( load ) {
x0 = _x;
y0 = _y;
}
onClipEvent (mouseDown) {
if ( ! hitTest(_root._xmouse, _root._ymouse) ) return;
_xscale = 100;
_yscale = 100;
startDrag (this);
}
onClipEvent (mouseUp) {
_root.initPicture();
}
Измените код функции initPicture (код, связанный с кадром 1).
function initPicture() {
stopDrag();
with ( picture ) {
_xscale = 50;
_yscale = 50;
_x = x0;
_y = y0;
}
}
Проверьте работу клипа в режиме увеличения рисунка.
Если вы сделали все правильно, фотография действительно увеличивается, но «вылезает» из области, отведенной рисунку, закрывает другие элементы. Чтобы ограничить область видимости, мы используем маску.