Знакомство с графическими примитивами

В этом уроке мы познакомимся с графическими примитивами. То есть научимся рисовать линии и делать заливки. Сразу скажу, что мои примеры далеки от канонов объектно-ориентированного стиля... просто таким образом оформленные примеры мне кажутся... более простыми в понимании основной мысли. Да простят меня взрослые и умные дяденьки. 🙂

Итак, повторяем то же, что мы делали в прошлый раз, только теперь файл базового класса и сам класс будут называться Main.

Вот его содержимое:

package {
	import flash.display.Sprite;
	import flash.display.Shape;

	public class Main extends Sprite {
		public function Main() {
			var k1 = Kvadrat(100,0xFF0000); // Красный квадрат 100 на 100
	 		var k2 = Kvadrat(200,0x00FF00); // Зеленый квадрат 200 на 200

			addChild(k1); // Добавляем Красный квадрат на основную сцену
		 	k1.x=50;
	 		k1.y=50;

			addChild(k2); // Добавляем Зеленый квадрат на основную сцену
	 		k2.x=100;
		 	k2.y=100;
		 }

		private function Kvadrat(w:Number, col:uint) { // Функция, рисующая квадрат
	 		var kvadrat:Shape = new Shape();
 			var Width=w;
 			with (kvadrat.graphics) {
 				beginFill(col, 0.80); // Закрашиваем квадрат, непрозрачность  - 80%
	 			lineTo(0,Width);
 				lineTo(Width,Width);
 				lineTo(Width,0);
 				lineTo(0,0);
	 			endFill();
 			}
 			return kvadrat;
		}
	}
}

В принципе, я думаю и так все понятно... Но на всякий случай рассмотрим алгоритм выполнения этой маленькой программы:

  • Вызывается основная функция Main().
  • С помощью вызова функции Kvadrat() создаем 2 квадрата:
    • beginFill() - задать цвет заливки
    • lineTo() - рисовать линию до координат, указанных в параметрах
    • endFill() - закончить заливку (кстати, многие "взрослые" программеры часто забывают выключить заливку, что порой приводит к непредвиденным ситуациям
  • Добавляем квадраты на сцену командой AddChild()
  • Изменяем координаты с помощью параметров .x и .y

Ну вот, вроде бы и все на сегодня...'

Вливайтесь в общение

17 комментариев

  1. Да, а мой коммент к следующему посту чего не заапрувил? 🙂
    ? почему у тебя блог работает на день вперед? 🙂

  2. var kvadrat:Shape = new Shape();
    Что означает :Shape ?

  3. var kvadrat:Shape = new Shape();
    Что означает :Shape ?

    Это означает что переменная kvadrat — это экземпляр класса Shape.
    Класс Shape используется для создания легковесных графических элементов с помощью ActionScript.

    В отличие от класса Sprite, который тоже имеет методы рисования, класс Shape не имеет свойств и методов, присущих так называемым display object container-ам. Например экземпляры класса Shape не могут иметь дочерних объектов. А также не поддерживают события по клику мы?ки. ? вообще кроме графики ничего в себе не содержат. За то мень?е памяти занимают в сравнении с тем же Sprite.

  4. Спасибо за урок.
    Что если в addChild задавать координаты не жестко, а брать координаты указателя мышки в момент щелчка. И именно по щелчку рисовать квадраты. Тогда можно будет выбирать, где именно его расположить.
    Еще можно добавить в функцию Kvadrat переменную, содержащую координаты указателя мыши. И в зависимости от этого рассчитывать размеры квадрата. Или менять их при перетаскивании мыши с нажатой кнопкой.

  5. Ура!! Наконец то я нашел!! болье часа искал!! Спасибо за урок=) Можно сказать спас…. Пошел делать..

    З.ы. Сайт занес в закладки.. Как раз то что я сейчас учу.. Удачи автору!!

  6. Ура!! Наконец то я нашел!! болье часа искал!! Спасибо за урок=) Можно сказать спас…. Пошел делать..
    З.ы. Сайт занес в закладки.. Как раз то что я сейчас учу.. Удачи автору!!

    Спасибо за отклик. Если есть какие-то вопросы, то могу написать отдельный пост, раскрывающий их…

  7. with (kvadrat.graphics) {

    }

    данная конструкция означает что все что внутри будет применено относительно kvadrat.graphics?

  8. chefil :
    with (kvadrat.graphics) {

    }
    данная конструкция означает что все что внутри будет применено относительно kvadrat.graphics?

    именно так

  9. А зачем такие извращения для рисования квадрата? Если можно использовать
    drawRect(0,0,Width,Width)
    Или с закругленными углами
    drawRoundRect(0,0,Width,Width,10,10)

Оставьте комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *