Способы создания графических редакторов

Информатика

Именная карта банка для детей
с крутым дизайном, +200 бонусов

Закажи свою собственную карту банка и получи бонусы

План урока:

Что такое графические объекты и примеры их применения в жизни

Графический объект – это любая видимая глазом форма, которую сознание человека выделяет среди прочих форм как самостоятельную сущность. Графический объект может быть простым, а может быть составным, то есть быть скомбинированным из других графических объектов. Технически существует только один полностью простой графический объект – это изображение «геометрической точки». Не случайно, точка это минимальный графический объект в любом графическом редакторе. Любой другой может быть составлен из таких точек или произвольных множеств точек. Но человеческий разум обычно не опускается до такого уровня детализации.

Приведем простые графические примеры. Глядя на картину изображающую лес, мы видим деревья, стволы деревьев, листья, траву, журчащий ручеек и так далее. Сверху в небе мы заметим облака – объекты другого рода, не относящиеся к лесу, который мы можем также считать графическим объектом.

На графические объекты можно взглянуть иначе. А именно, с точки зрения их формы и структуры. Например, будучи изображенными на плоскости, и мяч, и монета, и колесо автомобиля выглядят кругами. Точнее говоря, имеют границу в форме окружности. Различные строения, технические конструкции и другие изготовленные людьми вещи на рисунке выглядят составленными из многоугольников. Встав на такую точку зрения, мы отвлекаемся от конкретного смысла того или иного графического объекта, то есть (как говорят ученые) абстрагируемся от конкретного содержания формы. И переходим к манипулированию так называемыми графическими примитивами– кругами, овалами, прямоугольниками, многоугольниками, прямыми и кривыми отрезками линий.

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

Комбинацией графических примитивов в редакторе достигается создание графических объектов любой сложности.

• Сложные графические объекты могут стать основой прекрасной картины;
• С их помощью можно изготовить плакат или изготовить фон для других изображений;
• Их можно использовать в рекламе и для информационных табличек;
• Более того, почти все, наблюдаемое на экране компьютера – есть комбинация таких объектов, даже текст с изящным шрифтом.

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

Далее мы рассмотрим примеры графических редакторов и решение графических примеров с их помощью.

Компьютерная графика и ее инструменты

Компьютерная графика не ограничивается простыми графическими редакторами для создания обычных картин. Среди прочих ее инструментов можно отметить:

1. Программы для манипуляции трехмерными (объемными) примитивами – 3D-редакторы.
2. Средства компьютерной графики для создания чертежей (CAD-системы).
3. Специализированные технические средства компьютерной графики. Например, для разработки новых шрифтов.
4. Программные средства компьютерной графики для создания презентаций.

И так далее. Виды компьютерной графики и сферы применения компьютерной графики многообразны, а история компьютерной графики – это история совершенствования ее инструментов. Чем совершеннее становятся инструменты, тем шире применение компьютерной графики. Думается, что сегодняшние ее возможности – далеко не предел. Возможно, кто-нибудь из вас, став в будущем специалистом в области компьютерной графики, еще больше раздвинет ее горизонты.

Редакторы компьютерной графики. Классический редактор Paint

Пора переходить от слов к делу. Мы обещали показать вам какой-нибудь редактор графических изображений и рассказать о принципах его работы. Сдержим свое обещание – посмотрите на рисунок ниже:

Перед вами входящий в поставку Windows растровый графический редактор Paint. Одного взгляда на картинку достаточно, чтобы глаз выделил в ней следующие элементы окна программы:

1. Рабочую область программы;
2. Панель инструментов (наподобие той, что имеется в Ворде);
3. Всевозможные кнопки панели инструментов;
4. Стандартное меню панели инструментов.

Как видите ничего нового. Дело в том, что компания Microsoft уже довольно давно ввела единый стандарт на внешний вид окон и органов управления в приложениях Windows. Так что ничего особенно необычного ожидать не приходится. Остается только разобраться в назначении меню и кнопок. Меню представлено закладками, щелкая по которым можно открыть доступ к той или иной панели. В ранних версиях Windows все было немного не так. Стандартная панель инструментов и меню были жестко разделены визуально, хотя и обладали сходной функциональностью. Нынче данный подход уже не популярен, хотя в вашей версии операционной системы Paint может выглядеть немного иначе.

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

На панели можно выбрать атрибуты примитивов: толщину границы, цвет границы и цвет заливки внутренней обрасти изображаемой в данный момент фигуры. Также можно задействовать «Ластик» — для стирания части картинки, «Карандаш» — для проведения произвольных линий разной толщины, «Ведерко» — для заливки цветом, «Лупу» — для увеличения части изображения, а также «Пипетку» — для того чтобы сохранить в памяти цвет данной конкретной точки картинки. Потом сохраненный цвет можно использовать повторно, так как он появляется в виде отдельного квадратика в зоне выбора цвета.

Есть еще один полезный инструмент, обозначенный большой жирной литерой «А». С его помощью в любое место рисунка можно вставить произвольный текст с желаемой гарнитурой (то есть с требуемым сочетанием типа шрифта, размера шрифта и способа его начертания).

Рабочее окно программы можно видоизменять.Например, изменив размер рабочей области графического редактора, потянув мышкой за квадратики в ее углах. Повозившись с Paint-ом какое-то время, вы поймете, что этот графический редактор очень прост и удобен в обращении.

Работа в графическом редакторе. Основные операции с графическими объектами

Последовательность работы с графическим редактором напоминает другие алгоритмы, с которыми вы были ознакомлены в курсе «Информатики». Процесс создания картинки можно описать и сформулировать формально:

Этап 1. Запускаем редактор paint c новым или уже редактированным документом (картинкой). Если просто запустить редактор, то перед вами предстанет пустая рабочая область. А значит,редактирование рисунка начинается сначала. Если вы хотите доработать уже имеющуюся картинку, запустите Paint и откройте ее через меню программы.

Этап 2. Работа с примитивами. С помощью примитивов мы создаем отдельные фрагменты изображения. Но понятие фрагмента шире. Фрагмент – это любая область рисунка, которую можно выделить при помощи инструмента с рамкой (операция «выделение фрагмента»):

Преобразование фрагментов – важнейшая операция при работе с Paint. Рисование примитивов слишком просто, чтобы на нем долго задерживаться. Выбрал примитив (например, прямоугольник на панели – и рисуй себе мышкой). А о манипуляции с фрагментам стоит поговорить всерьез. Выделение графических фрагментов напоминает способы выделения фрагментов текста. Вставка фрагмента в буфер обмена и извлечение фрагмента из буфера также ничем не отличается от таких же точно операций в редакторе Word. Инструменты графического редактора позволяют делать это в два счета. Просто используйте горячие клавиши «Ctrl-C» (копирование), «Ctrl-X» (вырезать фрагмент) и «Ctrl-V» (вставка обратно в рабочую область рисунка).

Как удалить фрагмент, не вырезая его в буфер? Точно так же как и в текстовом редакторе – выделяем и жмем на клавишу DEL на клавиатуре. Как переместить фрагмент? Элементарно: выделяем и тащим фрагмент мышкой. На следующем рисунке мы изобразили примитив в виде окружности, залили его «Ведерком» оранжевой краской, затем выделили внутри круга прямоугольник и перетащили его мышью. Посмотрите на результат:

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

Имейте в виду, будучи на вид примитивными, инструменты графического редактора Paint предоставляют широкую палитру возможностей людям с выраженными творческими способностями. Более того, оттачивать технику рисования имеет смысл именно при помощи элементарных инструментов. И только потом переходить к более сложным программным пакетам. Загляните на Youtube и поищите там впечатляющие образцы работы с Paint профессиональных художников и дизайнеров. Вы будете поражены!

Ввод графической информации в персональный компьютер

Графический редактор можно считать программным средством для помещения изображений в память ПК, Помимо софта этой цели служат и аппаратные ресурсы компьютера – обычные и не совсем устройства ввода информации. Устройства ввода графической информации прошли длинный путь эволюции от простейших приборов вроде графического пера и мониторов со специальной разметкой, до суперсовременных сканеров и видеокамер. К устройствам ввода графической информации относится также и мышь. Но непосредственно использовать ее с этой целью нельзя, а только в симбиозе с программами наподобие Paint. На стареньких 8-битных компьютерах 80-х с этой же целью применялась и клавиатура. По экрану бегало изображение мышки, но управлялась такая виртуальная мышь клавишами-стрелками клавиатуры. То есть на вопрос: «позволяет ли мышь ввод информации» можно ответить и «да» и «нет» одновременно.

Наиболее популярное устройство ввода графической информации – сканер. А также графический планшет, информация в который может быть передана в естественной форме, совершенно прозрачно для пользователя. Так, как будто вы просто рисуете красками.Устройство ввода информации графический планшет особенно рекомендуется начинающим художникам, так как подходит для обучения гораздо лучше компьютера, имитируя процесс рисования полностью. Устройства ввода информации клавиатура и мышь все-таки не очень подходят для профессиональной работы с графикой.

Источник

Разработка графического редактора

Изучение особенностей растровых и векторных графических редакторов. Создание графического редактора: выбор языка программирования, разработка структуры программы и алгоритма работы. Описание интерфейса программы. Руководство программиста и пользователя.

Рубрика	Программирование, компьютеры и кибернетика
Вид	курсовая работа
Язык	русский
Дата добавления	28.07.2013

по дисциплине «Программирование»

на тему: «Разработка графического редактора»

• Введение
• 1. Теоретическая часть
• 1.1 Анализ предметной области
• 1.2 Анализ требований к разрабатываемому программному обеспечению
• 1.3 Описани е методов, применяемых в работе
• 2. Проектная часть
• 2.1 Разра ботка общей структуры программы
• 2.2 Опис ание алгоритма работы программы
• 2.3 Описание разработки
  • 2.3.1 Заставка
  • 2.3.2 Главное окно
  • 2.3.3 Новое изображение
  • 2.3.4 Рабочее состояние
  • 2.3.5 О программе
• 3. Программная документация
• 3.1 Руководство программиста
• 3.2 Руководство пользователя
• Заключение
• Приложение

Представление данных на мониторе компьютера в графическом виде впервые было реализовано в середине 50-х годов для больших ЭВМ, применявшихся в научных и военных исследованиях. С тех пор графический способ отображения данных стал неотъемлемой частью подавляющего числа компьютерных систем, в особенности персональных.

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

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

Без компьютерной графики невозможно представить себе не только компьютерный, но и обычный, вполне материальный мир. На сегодняшний день компьютеры и компьютерная графика неотъемлемая часть жизни современного общества. Например назовём медицину (компьютерная томография), научные исследования (визуализация строения вещества, векторных полей и других данных), моделирование тканей и одежды, опытно-конструкторские разработки, рекламные щиты, цветные журналы, спецэффекты в фильмах — всё это в той или иной мере имеет отношение к компьютерной графике. Поэтому созданы программы для создания и редактирования изображений, то есть графические редакторы.

1. Теоретическая часть

1.1 Анализ предметной области

Графический редактор — программа, позволяющая создавать графические изображения или изменять уже имеющиеся. В настоящий момент, существует достаточно большое количество графических редакторов, как довольно известных, так и не очень распространенных. Изображения в графических редакторах хранятся по-разному.

Растровое изображение хранится с помощью точек различного цвета (пикселей), которые образуют строки и столбцы. Любой пиксель имеет фиксированное положение и цвет. Хранение каждого пикселя требует некоторого количества бит информации, которое зависит от количества цветов в изображении.

Векторные изображения формируются из объектов (точка, линия, окружность и т. д.), которые хранятся в памяти компьютера в виде графических примитивов и описывающих их математических формул. Например, графический примитив точка задается своими координатами (X, У), линия — координатами начала (XI, Y1) и конца (Х2, Y2), окружность — координатами центра (X, У) и радиусом (R), прямоугольник — величиной сторон и координатами левого верхнего угла (XI, У1) и правого нижнего угла (Х2, У2) и т. д. Для каждого примитива назначается также цвет.

Как следствие, графические редакторы подразделяются на две категории: растровые и векторные. Они отличаются по способу, которым представляют графическую информацию.

Векторные графические редакторы

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

Растровые графические редакторы.

Растровые графические редакторы являются наилучшим средством обработки фотографий и рисунков, поскольку растровые изображения обеспечивают высокую точность передачи градаций цветов и полутонов. Способ представления растровых изображений совершенно отличен от векторных. Растровые изображения состоят из отдельных точек, называемых растром. Такое представление изображений существует не только в цифровом виде. Растровые изображения обеспечивают максимальную реалистичность, поскольку в цифровую форму переводится каждый мельчайший фрагмент оригинала. Такие изображения сохраняются в файлах гораздо большего объёма, чем векторные, поскольку в них запоминается информация о каждом пикселе изображения. Таким образом, качество растровых изображений зависит от их размера (числа пикселей по горизонтали и вертикали) и количества цветов, которые могут принимать пиксели. Как следствие того, что они состоят из пикселей фиксированного размера, свободное масштабирование без потери качества к ним не применимо. Эта особенность, а также сама структура растровых изображений несколько затрудняет их редактирование и обработку. Но кроме создания изображений графические редакторы позволяют хранить полученные изображения. Для этого существуют файлы, которые различны для векторных и растровых графических редакторов.

1.2 Анализ требований к разрабатываемому программному обеспечению

Графический редактор должен обладать функцией обработки входных данных в следующих форматах — DIB, JPEG, PNG и GIF. В случае с анимированным gif, редактор должен обработать только первый кадр из последовательности.

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

Графический редактор должен предоставлять функционал для создания изображений выбранных размеров с последующим редактированием. Также, необходимо наличие функций масштабирования. Функции «Отменить»/»Повторить» также приветствуются.

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

Графический редактор должен взаимодействовать с другими графическими редакторами посредством буфера обмена.

1.3 Описание методов, применяемых в работе

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

Функция рисования включает в себя рисование точек, линий произвольной траектории, толщины и цвета, заливку одноцветных поверхностей. Эти функции в полном объеме позволяют реализовать стандартные графические средства Windows, а точнее, средства компонента GDI — Graphical Device Interface, интерфейс графических объектов Windows.

Масштабирование графического изображения осуществляется с помощью изменения свойств стандартных системных компонентов, таких как TImage или TPaintBox.

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

Работа с буфером обмена и создание графического объекта осуществляется с помощью стандартного интерфейса взаимодействия.

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

1.4 Обоснование выбора средства программирования

При выборе средства программирование, главный акцент устремлялся <делался>на качество и способы реализации выбранным средством требований, предъявляемых к работе. В связи с тесной связью с GDI, наличием всех стандартных компонентов, необходимых в работе, а также простотой реализации некоторых функций, средством программирования была выбрана интегрированная среда скоростной разработки приложений Embarcadero RAD Studio Delphi XE 3.

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

Начиная с версии 7.0., среда программирования Delphi официально признана независимым языком разработки, а название среды несколько раз менялась в зависимости от компании-разработчик. Изначально, права на среду разработки принадлежали компании Borland и она носила название Borland Developer Studio. В 2006 году разработкой среды занялось отдельное подразделени Borland — CodeGear, а название среды изменилось на CodeFear RAD Studio. И, наконец, после продажи подразделения CodeGear компании Embarcadero, название интегрированной среды приняло вид «Embarcadero RAD Studio» и существует в такой форме по сей день.

2. Проектная часть

2.1 Разработка общей структуры программы

Общая структура разработки графического редактора включает в себя:

— подпрограммы масштабирования изображения

— подпрограммы копирования и вставки изображения

— подпрограммы открытия и сохранения изображения

— подпрограммы отмены и повтора графической операции

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

2.2 Описание алгоритма работы программы

2.3 Описание разработки

графический редактор растровый векторный

Перед запуском программы, пользователю отображается заставка с краткой информацией о программе. Изображение реализовано компонентом Timage, надписи сделаны при помощи Tlabel.

2.3.2 Главное окно

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

Окно для рисования содержит главное меню и полосы прокрутки.

Панель инструментов содержит собственно инструменты, палитру цветов для фона и рисования, ползунок для толщины кисти и стили карандаша. Стоит отметить, что при использовании кисти, ее стили также возможно поменять при помощи TListBox со стилями карандаша.

2.3.3 Новое изображение

Диалог для задания атрибутов нового изображения

2.3.4 Рабочее состояние

Рис. 6. Рисунок, созданный в редакторе

2.3.5 О программе

Рис. 7.Окно «О программе…»

3. Программная документация

3.1 Руководство программиста

Проект написан на языке Delphi в среде Rad Studio XE 3. Работоспособность проекта тестировалась в среде Delphi 7.0 и дала отрицательный результат вследствие устаревшей версии VCL. Теоретически, компиляция проекта возможна в среде Delphi 2010 Professional и выше.

Готовая сборка (дистрибутив) программы состоит из исполняемого файла VPhotoEditor.exe и расположенных в той же директории курсоров pen.cur, brush.cur, fill.cur.

Программа не требует установки каких-либо сторонних надстроек, кодеков и т.п.

3.2 Руководство пользователя

Для начала работы с редактором графических файлов Вам достаточно запустить исполняемый файл — VphotoViewer.exe. После запуска, программа оповестит Вас о своей загрузке отображением красочной заставки.

После загрузки, Вы можете сразу приступить к работе, создав пустое изображение или открыв уже существующее. Для этого воспользуйтесь соответствующими пунктами меню Файл.

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

Чтобы приступить к работе, выберите инструмент и установите желаемые настройки инструмента.

Графический редактор имеет функцию масштабирования. Для этого Вы можете использовать меню Масштабирование, или же осуществить прокрутку вверх/вниз при нажатой клавише Ctrl.

Было сделано несколько изменений в поведении полос прокрутки, чтобы сделать этот процесс более комфортным для Вас. Используйте колесико мыши для прокрутки вверх/вниз, а также удерживайте клавишу Alt для прокрутки влево/вправо

Вы также с легкостью можете скопировать изображение в другой графический редактор, например Paint, Paint.Net иди Photoshop, а также вставить изображение из других графических редакторов. Все это Вам поможет осуществить меню Правка. Также вы можете вставит в программу скриншот экрана или окна, при помощи PrintScreen и Alt+PrintScreen соответственно.

Разработка графического редактора объединяет в себе как творческие элементы (оформление, цветовая композиция), так и умения программирования. В представленном проекте была продемонстрирована одна из реализаций графического редактора на языке Delphi стандартными средствами Windows. На самом деле, такой подход приемлем, но лишь в ознакомительных целях, так как стандартные компоненты GDI достаточно примитивны и непригодны для реализации редакторов профессионального уровня. В последнем случае, стоит использовать возможности технологий OpenGL, Direct2D или GDI+ в крайнем случае. Все перечисленные технологии достаточно распространены и обладают мощными средствами реализации профессиональной графики. К сожалению, из-за большого количества человекочасов, необходимых для реализации графики на данных технологиях, в проекте применялась технология GDI. В то же время, имеются планы реализовать графический редактор VPhotoViewer в технологии OpenGL, расширить инструментарий, добавить фильтры и возможность подключения плагинов (дополнительных модулей). Проект является стартовой точкой работы автора с графической составляющей Windows, что объясняет особенности реализации и возможные незначительные недостатки

Листинг наиболее значимых модулей программы

Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants,

System.Classes, Vcl.Graphics, gifimg, clipbrd,

Vcl.Controls, Vcl.Forms, Vcl.Dialogs, Vcl.Menus, Vcl.ExtCtrls, Jpeg, Pngimage,

Vcl.StdCtrls, Vcl.ComCtrls, Vcl.Buttons, Vcl.ImgList;

tTools = (Null, Pen, Brush, Fill, Ellipse);

Источник