Ваш аккаунт: пройдите авторизацию

Авторизация

Пароль есть, но Вы его забыли?
Впервые на сайте? Зарегистрируйтесь!

Вы попали в мир графики и дизайна


Изюминка нашего сайта в том, что все файлы хранятся на наших серверах, поэтому Вы получаете круглосуточный доступ ко всем файлам по прямым ссылкам без регистрации! С нашим сайтом Вы забудете про файлообменники!


Объекты, прилипающие к сетке


В этом уроке вы научитесь, как создать муви клипы, прилипающие к сетке, с помощью actionscript.
Нарисуйте 10x10 круг на сцене. Сделайте из него мувик (F8), установите точку регистрации в центре. Перед тем, как вы кликните OK, нажмите на кнопку 'advanced', если она до сих пор еще не нажата. Поставьте флажок 'Export for ActionScript'. В текстовом поле 'identifier' введите 'ball'.
Объекты, прилипающие к сетке
Теперь нарисуйте горизонтальную линию шириной в 1 - пиксель, пересекающую сцену (она должна быть шире сцены). Выделите ее и нажмите F8, чтобы конвертировать в мувик. Сделайте точку регистрации в середине слева. Отметьте 'Export for ActionScript' и дайте ему идентификатор 'length'.

Нарисуйте другую линию шириной в 1 - пиксель, но вертикальную (она должна быть выше сцены). Выделите ее и нажмите F8, чтобы конвертировать в мувик. Сделайте точку регистрации вверху в середине. Отметьте 'Export for ActionScript' и дайте ему идентификатор 'height'.
Эти два последние мувика были сделаны для того, чтобы рисовать сетку средствами actionscript, и менять размер сетки изменением значения единственной переменной.

Удалите все мувики со сцены (не удаляйте их из библиотеки) и выделите кадр. Откройте панель actions (F9) и введите этот код.
CODE

var drag:Boolean = false;
var i:Number;
var h:Number;
var grid:Number = 25;

for (i=0; (i*grid)<Stage.height; i++) {
   attachMovie("length","l"+i,getNextHighestDepth());
   _root["l"+i]._y = i*grid;
}
for (h=0; (h*grid)<Stage.width; h++) {
   attachMovie("height","h"+h,getNextHighestDepth());
   _root["h"+h]._x = h*grid;
}
attachMovie("ball","ball",getNextHighestDepth());
ball._x = grid+(random(Stage.width-grid*2));
ball._y = grid+(random(Stage.height-grid*2));

ball.onPress = function() {
   drag = true;
   startDrag(this);
};
ball.onRelease =ball.onReleaseOutside= function() {
   drag = false;
   stopDrag();
};

onEnterFrame = function () {  
   if (!drag) {      
       if (Math.abs(Math.floor(ball._x/grid)-(ball._x/grid))<Math.abs(Math.ceil(ball._x/grid)-(ball._x/grid))) {
           ball._x = Math.floor((ball._x/grid))*grid;
       }else{
           ball._x = Math.ceil((ball._x/grid))*grid;
       }
       if (Math.abs(Math.floor(ball._y/grid)-(ball._y/grid))<Math.abs(Math.ceil(ball._y/grid)-(ball._y/grid))) {
           ball._y = Math.floor((ball._y/grid))*grid;
       }else{
           ball._y = Math.ceil((ball._y/grid))*grid;
       }
   }
};
Первые 4 строки - объявления переменных. Drag - это булева переменная, которая говорит нам, перетаскивается шар или нет. 'i' и 'h' - числа для организации цикла, которыый создаст сетку. Grid - это размер сетки. Если вы поменяете значение grid, вы увидите, что произойдет.
Строки 6-13 - создание сетки. Здесь 2 оператора, которые аттачат горизонтальные и вертикальные линии на сцену. Сколько их, и насколько далеко они расположены, зависит от переменной grid .
Строки 14-16 - приаттачивание шарика на сцену и размещение его рандомно на сцене. Проверьте, что он располагается на расстоянии='grid' от краев, так чтобы он не появился вне сцены.
Строки 18-25 - это то, что мы можем таскать шар. Если вы тащите, переменная drag равна true. Если не тащите, она равна false.
CODE

if(Math.abs(Math.floor(ball._x/grid)-(ball._x/grid))<Math.abs(Math.ceil(ball._x/grid)-(ball._x/grid))){

Что здесь происходит? Значение x -координаты шара делится на переменную grid, получаем десятичное число (если нет, то не имеет значения). Затем происходит округление до ближайшего меньшего целого числа (Math.floor()). Затем вычитаем оригинальное число (ball._x/grid) из нового округленного числа, и затем переводим это в положительное число (Math.abs()). Зате делаем то же самое, но вместо округления числа снизу, округляем число сверху, и затем проверяем, какое из получившихся будет больше. Если это второе, будет выполняться скрипт, который заставит прилипнуть шар к ближайшей линии сетки справа, если это первое, то шар прилипнет слева. Возможно есть более простой путь сделать это, но я сделал так.
CODE

ball._x = Math.floor((ball._x/grid))*grid;

Итак, если шарику нужно прилипнуть слева, будет выполнен этот скрипт. Координата шара по x равна Math.floor((ball._x/grid))*grid. Здесь деление х-координаты шара на значение grid, и затем округление снизу. Потом умножение этого числа на grid. Этот номер будет равен x - координате ближайшей линии сетки слева.
CODE

ball._x = Math.ceil((ball._x/grid))*grid;

Этот скрипт будет выполняться, если шарику нужно прилипнуть справа. Он в точности тот же самый, что и скрипт сверху, за исключением того, что число округляется сверху, поэтому результатом будет x - координата ближайшей линии сетки справа.

Остальные строки кода - в точности то же самое, что последние строки, что я объяснил, но они отвечают за прилипание шара сверху и снизу.


Внимание! Вы находитесь на сайте как гость! Зарегистрируйтесь или авторизируйтесь...

Нет времени на регистрацию? Можете войти на сайт через ВКонтакте! Это просто, быстро и удобно!

Похожие материалы

Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.