ресурс для начинающих веб-разработчиков
комплексные веб-услуги по созданию сайтов

Справочный материал по основным языкам программирования и верстки сайтов.

Готовая методика создания простых и сложных динамичных сайтов, с использованием PHP и MySQL.

Использование веб-редактора Adobe Dreamweaver в разработке сайтов.

Использование графических редакторов Adobe Flash, Adobe Photoshop, Adobe Fireworks в подготовке веб-графики.

Разработка веб-сайтов под "ключ".

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

Создание кнопок. Принципы работы с инструментами рисования и операции над объектами. Прямоугольная кнопка

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

C помощью Flash можнот создавать большое разнообразие кнопок, закладок и других элементов меню. Но прежде чем говорить о работе кнопки при реации на действие мыши, необхолимо сделать для кнопки заготовку. В ходе создания кнопки, мы продолжим изучение инструментов рисования, а также рассмотрим принцип работы с инструментом выделения.

Принцип работы с инструментами рисования и операции над объектами

Прежде чем рисовать, необходимо понять основный принципы работы с объектами во Flash, а точнее, с особенностью перекрытия объектов, находящихся в одном слое.

  1. Когда мы проводим линию поперек закрашенной фигуры или другой линии инструментами Карандаш, Линия, Прямоугольник или Овал, Кисть их перекрывающиеся фрагменты разделяются в точках пересечения. Мы можем выделить и переместить с помощью инструмента Стрелка (Выделение) части фигуры, чтобы редактировать их далее отдельно от других.
  2. Если мы хотим что-то нарисовать сверху, но не желаем чтобы это что-то перекрывалось, необходимо сгруппировать отдельные объекты и только затем перемещать их.
  3. Если накладываете одну фигуру на другую, то сверху лежащая фигура будет как бы "съедать" ту, которая расположена снизу.
  4. Если мы не хотим, чтобы фигуры поедали друг друга, то перед тем, как создать объект, надо нажать пиктограмму Рисование объектов Рисование объектов в нижней части панели Инструменты.

Принцип работы с инструментами выделения

Умение выделять нужное — не только полезная способность в повседневной жизни, но и одна из первоочередных опций, с которой мы должны быть знакомы, для того чтобы продуктивно работать во Flash. У программы Adobe Flash CS3 есть целая группа инструментов выделения. Рассмотрим их.

стрелка(выделение) Стрелка (Выделение) — самый применяемый инструмент из всего арсенала Flash. Позволяет выделить для дальнейшего редактирования объект целиком (при щелчке мыши по предмету) или его часть (принажатии и перемещении мыни выделяется прямоугольная область).

Спецвыделение Спецвыделение — позволяет работать с формой объекта, редактируя кривые Безье.

Лассо Лассо — инструмент применяется для выделения произвольных областей.

Прямоугольная кнопка

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

Инструмент Прямоугольник

Воспользуемся инструментом прямоугольник и в новом документе в слое кнопка создадим прямоугольник со сглаженными углами. Чтобы у фигуры получились закругленные концы сделаем следующее:

  1. Выберем инструмент Прямоугольник Прямоугольник.
  2. Чтобы настроить параметры прямоугольника, обратимся к панели Свойства. Ввнедите значение 20 для радиуса угла.

    Свойства прямоугольника

  3. Нарисуйте объект и если есть, удалите контуры.
  4. Настройте градиентную заливку, сделав плавный переход от черного к зеленому цвету.

    Кнопка

Прежде чем перейти к созданию завитка разберемся с принципами работы объектов в одном слое

Операции над объектами

Принципы работы во Flash по операциям над объектами несколько отличаются от тех, с которыми нам приходилось иметь дело в других пакетах компьютерной графики.

Операции подрезки

Когда мы работаем в одном слое с инструментами типа заливка (Кисть, Овал, Прямоугольник), то располагая одну фигуру над другой в пределах одного слоя, мы тем самым выполняем операцию, которая называется Подрезать. То есть верхний объект как бы подрезает или "откусывает" кусок фигуры, расположенный в низу.

Это может вызвать некоторое неудобство в работе, которое легко устранимо, если мы не будем забывать включать режим Рисование объектов Рисование объектов в нижней части панели Инструменты.

Теперь создадим завиток.

  1. Создадим два эллипса, причем для одного из них — настроим градиентную заливку.
  2. для второго эллипса выберем любой цвет из однородной заливки — мы будем использовать его в качестве стирательной резинки.
  3. С помощью инструмента стрелка(выделение) Стрелка расположим второй овал на овале с градиентной заливкой так, как показано на рисунке ниже.
  4. Выделите сплошной овал и нажмите клавишу <Delete>. В результате этого действия исчезнет не только одноцветная фигура, но и часть градиентной расположенной под ней. В итоге у нас должно получиться так.
Завиток

Этим примером "подрезания" одной фигуры другой мы будем еще неоднократно пользоваться. Но мы должны знать и то, что делать, если не хотим чтобы часть фигуры исчезла.

Группировка и упорядочение

Для того чтобы наложения фигур одна на другую ни одна из них не пострадала, необходимо перед их созданием нажать пиктограмму Рисование объектов Рисование объектов на панели Инструменты. Если же вы забыли это сделать, то после того как фигуры созданы, можно воспользоваться операцией группировки.

Сгруппировать объекты можно следующим образом. Выделите объекты, которые хотите сгруппировать, или нажмите комбинацию клавиш <Ctrl>+<G> или воспользуйтесь меню Изменить, выбрав в нем пункт Группировать.

Со сгруппированными предметами вы можете выполнять операции по изменению порядка их наложения друг на друга или другими словами упорядочения. Для этого необходимо воспользоваться меню Изменить и выбрать пункт Упорядочить. В ответ на это появится панель, на которой можно выбрать одну из нужных команд.

Упорядочить

Опции позволяют следующие действия:

  • На передний план — выделенный объект становится самым верхним среди объектов, расположенных в активном слое.
  • Перенести вперед — выделенный объект перемещается на один уровень выше.
  • Поместить на задний план — выделенная фигура переходит на один уровень ниже.
  • Отправить назад — выделенный объект становится самым нижним среди объектов активного слоя.
  • Заблокировать — выделенный объект становится недоступным для редактирования.
  • Разблокировать все — позволяет разблокировать все закрытые ранее объекты.

Все вышеперечисленные действия доступны только для сгруппированных фигур, расположенных в одном слое. Не пытайтесь делать фигуру, расположенную на нижнем слое, более верхней, чем фигура, находящаяся на слое выше. Не думайте, что если вы взяли и создали несколько геометрических фигур даже на одном слое, у вас получится их упорядочить без применения операции группировки <Ctrl>+<G>. Команды будут попросту неактивны.

Возвращаемся к кнопке и сделаем следующее.

  1. Выделим с помощью инструмента стрелка(выделение) Стрелка созданный ранее прямоугольник со сглаженными краями и нажмем комбинацию клавиш <Ctrl>+<G>.
  2. Проделаем аналогичную операцию для завитка.
  3. Разместим завиток на прямоугольнике. Теперь можно на бояться перемещать завиток по прямоугольнику — фигуры не покусают друг друга.
  4. Выберем инструмент Текст Текст и напишите название для кнопки.
  5. Собираем кнопку.
Кнопка