Балаха
РЕГИСТРАЦИЯ

СобытияБизнесПрограммы для бизнеса, компьютеры
 
Часть 1. Подготовительная(Flash - как много в этом звуке)

Предисловие

Существует такая замечательная технология как Flash(Flash). Первоначально зародившаяся, как плагин для заставок на сайтах и именовавшаяся Future Splash, позднее поменяв название сначала в Macromedia Flash, а потом Adobe Flash, эта технология стала стандартом де-факто для казуальных игр, анимации в Web и RIA-приложений. Трудно найти человека, который не слышал про Flash. Я же постараюсь приоткрыть тайны этой технологии (по мере сил) и покажу, что рисовать во Flash совсем просто, а возможности ограничены лишь Вашим воображением. Всё нетрудно, нужно только начать!

План статей о Flash (Flash roadmap).

  1. Часть 1. Подготовительная(Flash - как много в этом звуке)
    1. Начинаем-с
    2. Первое знакомство
    3. Инструменты управления и рисования
      1. Инструмент "Выделение"
      2. Инструмент выделения вершин фигур
      3. Инструмент изменения масштаба
      4. Инструменты изменения цвета заливки и контура
      5. Инструмент рисования "карандаш"
      6. Инструмент рисования "кисть"
    4. Ссылки по теме

Начинаем-с

Итак, первое, что нужно сделать - это скачать Adobe Flash. Где и как это сделать я рассказывать не буду, но оговорюсь, что все торговые марки описанные в этой статье являются зарегистрированными товарными марками и/или товарными знаками и принадлежат своим право-обладателям.

Скачав flash, необходимо установить эту чудо программу. Обычно установка производится в каталог Program FilesAdobeAdobe Flash CS4 (На момент написания статьи версия CS4 была самой последней, поэтому речь пойдёт именно о ней. Хотя с небольшими поправками всё сказанное в статье актуально и для более ранних версий).

После установки, в меню Пуск -> Программы -> Adobe можно найти иконку Flash вот такую: Пункт меню Adobe Flash CS4

Запустим Flash и познакомимся с этой средой и редактором

Первое знакомство

После того, как пройдут все подготовительные мероприятия, мы должны увидеть экран похожий на этот:

Экран приветствия Flash CS4

Кликните по картинке, чтобы увидеть увеличенную версию изображения "Экран приветствия Flash CS4" в новом окне

На этом screenshot'е видны панель инструментов слева, панели палитры и библиотеки справа и панелька с последними документами в самом центре. Так же с этой панели можно легко создать новый клип нажав на ссылку Flash File в разделе Create New.

Можно не читать но...
Пара слов о том, почему в этом списке несколько вариантов создания клипов:
Первоначально Flash создавался как инструмент для создания анимационных клипов для Web, однако позднее создатели увидели всю мощь и перспективность этой технологии. Тогда в версии 4 появился простенький скриптовый язык, который позволял добавить интерактивности к клипу, ну например переход по ссылке или переход на другой кадр в анимации. Но и этого оказалось мало, тогда в состав Flash был внедрён скриптовый язык Action Script(1) (который с небольшими изменениями взят из спецификации на язык ECMAScript, спецификация ECMA-262 Ecma Script). Этот язык очень мало отличается от другого скриптового языка JavaScript. Однако, возможностей языка ActionScript 1 (или сокращённо AS1 ) явно не хватало, и позднее появился AS2, который имел некоторый намёк на объектную модель и ООП ориентированность, а с появлением Flash 9 появился язык AS3 - который является абсолютно объектно-ориентированным. (В одной из статей я постараюсь рассказать о языках AS2 и AS3)

Мы будем ориентироваться на новые технологии, хотя в данной статье не будем пользоваться Action Script вообще, но тем не менее выберем Flash File(Action script 3.0)

Окно редактора Flash станет вот таким:

Окно редактора с новым клипом

Нажмите, чтобы открыть большое изображение в новом окне

В центре чистый белый лист, на котором мы и будем рисовать. Слева панель инструментов, о которой сейчас поговорим подробнее, справа - панель настроек и палитры, снизу - панель управления кадрами.

Остановимся на панели инструментов и рассмотрим её подробнее:

Инструменты управления и рисования

панель инструментов Flash и описание инструментов по функциям

Остановимся на каждом инструменте поподробнее

Инструменты и их функции

  1. Выделение (Selection) Выделение
    Один из самых востребованных и используемых инстументов. Позволяет выделять как элменты целиком, так и части элементов. Выделенный элемент закрашивается таким способом, что его не перепутаешь с неактивным (в эдакую сеточку). Чтобы выделить элемент, достаточно щёлкнуть на нём (в случае символов или кривых) или кликнуть мышкой и потянуть, попавшие в область выделения элементы станут выделенными.
    Примеры, выделения:
    Примеры выделения фигур и символов
    Примеры выделений фигур и символов.
    Также доступно выделение нескольких фрагментов, зажав Shift можно легко выделить множество фрагментов или наоборот снять выделение с некоторых из них.
    Выделенные фрагменты можно переносить, если зажать левую кнопку мыши ;)
    Если выбран данный инструмент и подвести указатель к линии или кривой, то появится курсор с кривой, как на картинке ниже, это свидетельствует о том, что линию можно изгибать.
    Попробуйте, это просто. Просто хватаем и изменяем кривую.
    Изгиб линий и кривых
    Сперва пройдёмся по всем инструментам, а потом покажу примеры как их использовать.
  2. Выделение вершин Инструмент выделения вершин фигур.
    FLASH является редактором векторной графики (векторная графика) - это означает, что минимальным элементом фигур являются вершины, которые связаны несколькими типами линий, например, обычными линиями или сплайнами (точнее кривыми Безье 3 порядка). При работе с этим инструментом Вы сможете изменять тип вершин или оперировать с самими вершинами.
    Вот результат выделения фигуры таким инструментом.
    Результат выделения круга инструментом выделения вершин
    Как видно из рисунка, физическим представлением круга является набор кривых, связывающих ряд вершин. Вы сможете выделять эти вершины, перетаскивать или, например, менять вид кривой. Например, так:
    Изменение вида кривой
    Выделим одну из вершин составляющих круг. Появятся усики управления видом кривой, потянем за усик, за счёт чего осуществится преобразование кривой. Щелчок на другой фигуре или на пустом пространстве рабочей области приведёт к снятию выделения.
  3. Инструмент изменения масштаба Инструмент изменения масштаба.
    Если выделить объект, а оптом выбрать данный инструмент, то вокруг объекта появляется чёрная рамка с модификаторами размеров. Как на рисунке:
    Рамка изменения размеров объекта
    Потянув за один их чёрных "квадратиков", можно изменять размеры объекта по заданным направлениям. Например, если подвести курсор к правому нижнему углу и потянуть за него, то изображение исказиться согласно тому, как Вы изменяете масштаб. Если же нужно пропорциональное изменение ширины и высоты объекта, то изменяйте масштаб вышеописанным способом с зажатой клавишей Shift.
    Белый кружок в центре фигуры показывает точку, относительно которой рассчитывается масштаб. Центр масштабирования тоже можно перетаскивать для удобства.
  4. Инструменты изменения цвета заливки и контура Инструменты изменения цвета заливки и контура.
    Подосновной панелью инструментов расположены 2 поля, в которых отображается цвет заливки и цвет контуров фигур(под изображением карандаша отображается цвет контура, под изображением банки с краской - цвет заливки).
    Щелчёк левой кнопкой мыши открывает панель выбора цвета(в зависимости от того, на каком цвете щёлкнуть выбор цвета будет производится для контура или для заливки области).
    Вот, пример, диалога выбора цвета.
    Диалог выбора цвета
    Однако, более тонкий выбор цветов и оттенков, а также настройка градиентов возможна в панели Color, которая отображается в правой части рабочей области и вызывается с помощью комбинации клавиш SHIFT+F9 или в меню Window->Color.
    Панель управления цветами и градиентами. Color.
    Выбор цветов стандартен. Отметим лишь полезные кнопки, а тонкую настройку градиентов и т.д. рассматрим в последющих статьях.
    black and white.Чёрный и белый. Сделать цветом заливки белый цвет, а цветом контура - чёрный.
    Поменять цвета заливки и контура местами. Нажатие на эту кнопку приводит к обмену между собой цветов заливки и контура.

Можно не читать но...
Пара слов о том, когда будут описаны остальные инструменты.
Наилучшим способом научиться что-то делать – является практическое применение изученных навыков, поэтому здесь рассмотрены лишь те, инструменты, которые понадобятся нам в работе. Остальные инструменты будут рассмотрены в следующих статьях, однако всегда можно вернуться и прочитать про инструменты подробнее. В будущих статьях, если это необходимо, буду давать ссылки на те статьи, в которых было упоминание про описанные инструменты.

А сейчас давайте рассмотрим ещё 2 инструмента и приступим к рисованию.

  1. Карандаш Инструмент рисования "карандаш".
    Самый простой инструмент для рисования. Карандаш позволяет рисовать контуры будущих фигур. Цвет рисования задаётся, как мы уже сказалаи, с помощью инструментов задания цвета контура.
    После выбора этого инструмента можно легко начать рисовать фигуры на рабочей области.
    Важным свойством этого инструмента является то, что есть возможность выбора аппроксимации(аппроксимация) кривых для нарисованных контуров.
    В нижней части панели инструментов, после выбора инструмента карандаш отображается меню выбора типа аппроксимации кривых(показанное на рисунке):
    Выбор типа аппроксимации кривых
    • Straighten - грубое приближение. Элементом приближения является прямая.
    • Smooth - обычное приближение. Фигуры приводятся к плавно переходящим друг в друга кривым.
    • Ink - слабое приближение. Фигуры приводятся наиболее точно к той кривой, которая нарисована пользователем.
  2. Инструмент рисования кисть Инструмент рисования кисть.
    Кисть позволяет рисовать фигуры наравне с карандашём, однако для кисти цветом является цвет заливки.
    Однако для кисти можно выбрать так же размер и тип кисти, а также тип закрашивания (внутри, снаружи, посади и т.д.)
    Всё это производится в раскрывающихся панелях в низу панели инструментов.
    Выбор размера кисти
    Меню выбора размера кисти.

    Выбор формы кисти
    Меню выбора формы кисти.

    Так же как и в случае с карандашём, над фигурами, нарисованные кистью, проводится аппроксимация.

Время практикума

Сейчас я предлагаю Вам попрактиковаться с инструментами и нарисовать что-нибудь для души.

Ссылки по теме

  1. Adobe Flash, или просто Flash (/флэ:ш/) называют формат SWF (Shockwave Flash) Adobe Flash Player, Adobe Flash Professional, программу разработки мультимедийного контента для платформы «Adobe Engagement Platform» (такого, как веб-приложения, игры и мультфильмы)(страница в Wikipedia о Adobe Flash)
  2. ECMAScript — это интерпретируемый язык программирования, стандартизированный международной организацией ECMA (страница в Wikipedia о Ecma Script)
  3. Векторная графика — это использование геометрических примитивов, таких как точки, линии, сплайны и многоугольники, для представления изображений в компьютерной графике (страница в Wikipedia о Векторной графике).
  4. Аппроксимация, или приближение — математический метод, состоящий в замене одних математических объектов другими, в том или ином смысле близкими к исходным, но более простыми (страница в Wikipedia об аппроксимации).
ПОИСК ПО ФИРМАМ
 
Добавить фирму
 
За добавление актуальной информации Вы получите до 20 Балахов
 
ФОРУМ
 
 Балахи и как их получить
1133030 24 ноября в 12:28
 Стрижка собак и кошек без наркоза
naletova 16 октября в 12:47
 IrinaIfMeg
IrinaIfMeg 28 февраля в 01:26
 Прикольные рассказы
kombat 18 декабря в 00:27
 Анекдоты
kombat 18 декабря в 00:14
 Мисс Декабрь!!!!!!
Tashka 17 декабря в 20:12
 Handmade
Tashka 17 декабря в 19:48
 КОНКУРС "Handmade"
fly-fenix 17 декабря в 15:54
 новый вид конкурсов "Блиц-опрос"
krevenko 17 декабря в 15:16
 Билет - Кремлевская елка(родитель+дитя)
krevenko 17 декабря в 13:06
 Пролам фотоаппарат Sony a300 Kit
Werewolf 16 декабря в 17:38
 Какой режим дня у Вашего ребенка?
skiper_zver 16 декабря в 16:44
 Кафе и рестораны
limon4ik_01 16 декабря в 16:37
 Новогодние Ёлки
Milena 16 декабря в 15:01
 Игра: угадай фильм по кадру!
Werewolf 16 декабря в 10:43
© 2008-2009 Городской портал Балаха.ru Контакты Размещение рекламы Рейтинг@Mail.ru