русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

Градиентная заливка


Дата добавления: 2015-07-04; просмотров: 2418; Нарушение авторских прав


УРОК 9. ГРАДИЕНТНАЯ И ТЕКСТУРНАЯ ЗАЛИВКА.

ПЕРЕТЕКАНИЕ ЦВЕТА И ФОРМЫ.

 

Градиентная заливка

Градиентом называется плавный переход цвета, причем в это понятие входит как переход одного цвета к другому, так и переход от непрозрачности к прозрачности. Градиентной может быть только заливка, но не контур!

В зависимости от расположения вектора градиента в программе заложены следующие их типы:

- линейный;

- радиальный;

- градиентная сетка.

Подробнее остановимся на первых двух типах градиента, представленных на рис. 9.1: линейном и радиальном. О градиентной сетке поговорим в следующем уроке.

Рис. 9.1 – Примеры ахроматических градиентов: в верхней строке – линейные,

в нижней – радиальные (красной стрелкой обозначено направление вектора градиента)

Для работы с градиентной заливкой существует панель Gradient (рис. 9.2), которая нами была выведена на экран в одном блоке с Transparency и Stroke. Кроме того, для этих целей используется инструмент – Gradient Tool, а также имеется возможность создавать и сохранять градиентные заливки в палитре Swatches (урок 6, рис. 6.9).

Рис. 9.2 – Фигура с цветной радиальной заливкой и панель Gradient

Панель Gradient (рис. 9.2). В верхней части слева расположено окошко предварительного просмотра, рядом выбираем тип градиента – Type (тип): Radial (радиальный) или Linear (линейный).

В случае использования линейного градиента активизируется функция Angle (угол), где можно задать угол наклона градиента относительно горизонтального направления (0° или ± 180° – горизонтальный градиент, ± 90° – вертикальный). Знаки ± отвечают за направление градиента (сверху вниз или снизу вверх, справа налево или слева направо).

В нижней части панели расположена градиентная шкала, под которой помещены маркеры, соответствующие задаваемым цветам. Между соседними маркерами создается плавный переход цвета с серединой, отмеченной ромбиком над шкалой. Нижние маркеры можно добавлять, удалять или перемещать вдоль шкалы. Перемещением верхних маркеров задается неравномерный переход цвета. Location (размещение) определяет положение выделенного маркера относительно границ шкалы (0-100%).



Если требуется задать линейный градиент точно в границах фигуры (аналогично тому, как он расположен на градиентной шкале для линейного градиента и из центра до края фигуры для радиального), порядок действий такой:

1) строим фигуру,

2) выбираем в окошке Type тип градиента – линейный или радиальный,

3) в градиентной шкале снизу выделяем поочередно нужные маркеры и задаем им необходимые цвета в палитре Color. Поскольку по умолчанию для градиента стоит цветовой режим Grayscale (серая шкала), перейти к цветной шкале можно открыв меню стрелкой справа вверху и выбрав CMYK из списка. Другой вариант – с нажатой клавишей мыши переместить цвет из палитры Swatches на маркер: это сделать удобно, поскольку она расположена сразу под панелью «градиент». Новый маркер добавляется кликом под шкалой. В случае, если необходимо удалить маркер, тянем его с нажатой клавишей мыши за пределы панели и отпускаем.

4) задаем угол наклона линейного градиента и управляем маркерами в верхней части шкалы, если требуется задать неравномерные переходы цвета.


Инструмент Gradient Tool используется когда градиент вписан в фигуру особым образом, например, начальная точка радиального градиента не совпадает с геометрическим центром фигуры. Инструмент активизируется нажатием пиктограммы с изображением градиента на панели инструментов или клавиши G. Рассмотрим работу инструмента на примере, представленном на рис. 9.3:

Рис. 9.3 – Построение сложного радиального градиента со смещенным центром

при помощи инструмента Gradient Tool

Этапы работы:

а – построение фигуры инструментом «эллипс»: для круга удерживаем клавишу Shift;

б – применение радиального градиента на панели «градиент»;

в – с помощью инструмента «градиент» прочерчиваем с нажатой клавишей мыши линию, задающую границы будущего градиента – начало в месте блика, конец – правая нижняя граница круга;

г – результат применения инструмента «градиент» – центр градиентной заливки смещен влево и вверх;

д – на панели «градиент» в нижней шкале изменяем местоположение белого и черного маркеров, сдвигая их к центру; добавляем темно-серый маркер справа – он будет имитировать рефлекс – осветление тени с краю; изменяем локализацию верхнего левого маркера, чтобы блик был лучше выражен. Результат представлен на рис. д, рядом на панели – используемый градиент..

Аналогичным образом можно получить объемное изображение цветных фигур. Эффект объема можно усилить использованием падающей тени и блика (рис. 9.4).

Рис. 9.4 – Имитация рисунка капли с помощью градиента

 

Для случая, представленного на рис. 9.4, важно соблюдать правильный порядок работы: сначала строим круг, затем вводим градиентную заливку, рисуем падающую тень (с равномерной заливкой без градиента и прозрачностью 50%), блик. Тень помещаем за каплей, а блик – на самом верхнем уровне: напомним, что такое перемещение в пределах одного слоя производится с помощью меню, открываемого правой клавишей мыши – можем переместить на один слой выше или ниже, на самый нижний или самый верхний слой, – или через главное меню: ObjectArrange. Далее строим зеленый прямоугольник (фон), отправляем его на самый нижний слой (рис. 9.5) и только после этого сжимаем каплю по вертикали – получаем эллипс. В противном случае круговой градиент не будет соответствовать форме эллипса – убедитесь в этом, окрасив радиальным градиентом эллипс, а не круг.

Рис. 9.5 – Перемещение объекта по уровням в пределах одного слоя (Arrange)

Существует несколько вариантов сохранения градиента в палитре Swatches. Первый – перетащить с нажатой клавишей мыши окошко предварительного просмотра панели Gradient (квадрат слева вверху) на панель Swatches. Второй вариант – задав градиент в панели Gradient или кликнув на фигуру с нужной градиентной заливкой (она появится в квадрате «заливка» в панели инструментов) перейти к панели Swatches и нажать верхнюю правую стрелку, далее в появившемся меню выбрать «New Swatch…». Третий вариант – нажать на панели Swatches вторую справа кнопку в нижнем ряду (квадратик с отогнутым уголком). Переименовать градиент можно двойным кликом на квадратике с его изображением.

Градиентная заливка различается в случае использования составного пути (урок 8) или группы объектов, хотя в частных случаях получаем одинаковые результаты. Продемонстрируем это на примере узора и надписи (рис. 9.6). В первом случае (а) узор представляет собой составной путь и логически является единой фигурой, поэтому градиентная заливка растягивается от начала до конца всей фигуры в заданном направлении (в нашем случае – по горизонтали). Во втором (б) – если узор представляет собой группу элементов – каждая его часть будет залита отдельным градиентом.

Рис. 9.6 – Различие в применении градиентной заливки[1]:

а – составной путь, б – группа

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

Преобразовать сложный градиент в градиентную сетку или группу, состоящую из заданного количества мелких ступеней с равномерной заливкой (иногда это требуется при подготовке файлов к печати), следует через меню ObjectExpand и выбрав, соответственно, один из двух вариантов преобразования: Gradient Mesh или SpecifyObjects.



<== предыдущая лекция | следующая лекция ==>
Смещение пути | Текстурная заливка


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.005 сек.