Информатика21-22. Методические указания по курсу Информатика Пятигорск 2020 Лабораторная работа 1
 Скачать 4.27 Mb.
|
Лабораторная работа №7Тема: Использование графических объектов в программе. Примитивы. Основные вопросы: Графические объекты в прикладных программах. Управление свойствами графических объектов с помощью Инспектора объектов и программным путём. • Графические примитивы. Методы рисования сложных объектов. Теоретическая часть. Delphi позволяет программисту разрабатывать программы, которые могут выводить графику: схемы, чертежи, иллюстрации. Программа выводит графику на поверхность объекта (формы или компонента Image). Поверхности объекта соответствует свойство Canvas. Для того чтобы вывести на поверхность объекта графический элемент (прямую линию, окружность, прямоугольник и т. д.), необходимо применить к свойству Canvas этого объекта соответствующий метод. Например, инструкция Forml.Canvas.Rectangle (10, 10, 100, 100) вычерчивает в окне программы прямоугольник. Художник в своей работе использует карандаши и кисти. Методы, обеспечивающие вычерчивание на поверхности холста графических примитивов, тоже используют карандаш и кисть. Карандаш применяется для вычерчивания линий и контуров, а кисть — для закрашивания областей, ограниченных контурами. Карандашу и кисти, используемым для вывода графики на холсте, соответствуют свойства Pen (карандаш) и Brush (кисть), которые представляют собой объекты типа TPen и TBrush, соответственно. Значения свойств этих объектов определяют вид выводимых графических элементов. Примитивы Для использования простейших геометрических фигур (примитивов) в палитре компонентов Additional необходимо выбрать компонент класса TShape. При добавлении компонента в форму автоматически создается прямоугольник. Для задания типа фигуры в свойствах компонента используется свойство Shape. Для всех фигур, кроме квадрата и окружности, размеры (ширину и высоту) компонента можно задавать произвольно. Для квадратов и окружности размеры определяют размеры контейнера, в который помещён данный объект, а действительный размер фигуры определяется наименьшим размером.
Рисование примитивов Для создания нарисованных объектов многие компоненты имеют свойство Canvas - холст. Данное свойство не является визуальным свойством (оно не отображается в Инспекторе объектов), но оно присутствует в качестве свойства во многих других компонентах, которые должны уметь нарисовать себя и отобразить какую-либо информацию. На форме или в других объектах, где возможно рисование, единицей измерения координат является пиксель, началом координат является левый верхний угол компонента. Для рисования канва включает в себя шрифт, перо (карандаш) и кисть. Кроме того, можно рисовать и поточечно, получив доступ к каждому пикселю.
Для рисования многих фигур необходимо задать координаты ограничивающих точек. Рисование окружностей и эллипсов.   Для рисования окружности и эллипса используется единый метод Ellipse. Параметрами метода являются координаты левого верхнего и нижнего правого углов прямоугольника, в который вписана окружность или эллипс. Например, для рисования окружности в канве на форме можно использовать следующую команду:  Рисование дуги окружности и эллипса Для рисования дуги используется метод Arc. Точки с координатами (x3, y3) и (xl, yl) : (x3, y3) (xl, yl)  к (x4, y4) - это произвольные (не обязательно лежащие на эллипсе!) точки, лежащие на луче из центра эллипса этим точкам. Очевидно, что центр эллипса определяется точкой с координатами ((x2 - x1)/2, (y2 - y1)/2). Рисование происходит против часовой стрелки. Для рисования изображений на практике часто применяются объекты Form и PaintBox, свойствами которых является компонент Canvas . Для рисования в компоненте PaintBox используется событие onPaint. Это событие наступает каждый раз при отображении компонента PaintBox. Перед выводом изображения соответствующим методом можно задать параметры свойств Pen (карандаш) и Brush (кисть). В свою очередь их свойства, как компонентов, задаются аналогично тому, как это делается для объекта Shape. Пример рисования эллипса в компоненте PaintBox. PaintBox1.Canvas.Pen.Color := clGreen;//цвет контура PaintBox1.Canvas.Pen.Width := 3; //толщина контура PaintBox1.Canvas.Brush.Color := clRed^/цвет заливки PaintBox1.Canvas.Ellipse(10, 10, 100, 15 0);//рисование эллипса При выполнении целой группы действий с одними и теми же объектами часто приходится повторять целые последовательности команд, содержащие наименование одних и тех же объектов, а так же их свойств. Это аналогично тому, как в большом математическом выражении в каждом слагаемом используется общий множитель, который можно вынести за скобку и это во многом упрощает и написание и понимание выражения. В языке Pascal и Delphi для записей и объектных компонентов используется оператор доступа или группировки with (с, вместе с). Оператор доступа служит для удобной и быстрой работы с составными частями объектов, в том числе с полями записей. Для обращения к полю записи необходимо указывать имя записи и имя этого поля, разделенные точкой. Аналогичным путем образуется имя составной части какого-либо объекта, например, формы или кнопки. Оператор доступа имеет следующий основной формат: with <Имя объекта> do <Оператор> В операторе, расположенном после слова do, для обращения к составной части объекта можно не указывать имя этого объекта, которое уже задано после слова with. Оператор может быть составным оператором, т.е. содержать несколько компонентов, относящихся к компоненту верхнего уровня. Данный пример с использованием оператора доступа может иметь следующий вид: With PaintBox1.Canvas do begin Pen.Color := clGreen; Pen.Width := 3; Brush.Color := clRed; Ellipse(10, 10, 100, 150); end; Допускается вложение операторов with друг в друга. Например, внутри составного оператора для настройки свойств объекта Pen использовано два оператора. С вложением ещё одного оператора with этот фрагмент кода может быть следующим: With PaintBox1.Canvas do begin with Pen do begin Color := clGreen; Width := 3; end; Brush.Color := clRed; Ellipse(10, 10, 100, 150); end; В данном случае выигрыш в объёме программного кода скорее отсутствует, но наглядность этого примера в том, что он иллюстрирует принцип использования вложения. Для задания цвета контура и заливки можно использовать собственное название именованного цвета (см. Приложение 4. Обозначения цветов в шестнадцатеричной кодировке). Кроме того, цвет можно задавать, используя шестнадцатеричный код цвета. Для большинства систем программирования порядок цветов задаётся в виде RGB, т.е. на первом месте (старший байт) стоит компонент красного цвета (Red), на втором - зелёного (Green), на третьем - голубого (Blue). В Delphi этот порядок - обратный, т.е. BGR. Следовательно, там, где в обычной ситуации, например в HTML, красный цвет обозначается как $FF0000, то в Delphi - $0000FF. PaintBox1.Canvas.Brush.Color := RGB(255, 0, 0);//интенсивность каждого компонента Результат выполнения каждой из трёх команд будет абсолютно одинаковым. Задание свойства Color через диалоговое окно Цвет Для задания цвета любого объекта, где предусмотрено свойство Color, вместо задания определённого цвета можно использовать стандартную для Windows палитру компонентов в виде диалогового окна. Для этого в проект необходимо добавить компонент ColorDialog из палитры компонентов Dialogs. Данный компонент не является визуальным в проекте, он только лишь используется для вызова диалогового окна Цвет. Для вызова диалогового окна используется метод Execute()  Для открытия диалогового окна цвет можно использовать процедуру, выполняющуюся по щелчку на кнопке. При этом, например, выбранный цвет из диалогового окна Цвет должен быть назначен заливке объекта Shapel. Программный код процедуры может иметь следующий вид: ColorDialog1.Execute(); //открываем диалог Цвет Shape1.Brush.Color := ColorDialog1.Color; //объекту Shapel, его свойству Кисть (Brush) задаётся //цвет, совпадающий с выбранным в ColorDialog1 Рисование многоугольников. Для рисования двух объектов - многоугольника и ломаной линии (незамкнутый многоугольник) в качестве точек используются объекты класса TPoint - стандартного для Delphi класса Точка. Этот класс объектов для каждого своего объекта использует два параметра - координата X (абсцисса) и Y (ордината). Для вычерчивания многоугольника по его вершинам в соответствующей процедуре необходимо в качестве переменной объявить массив точек - одномерный массив, компонентами которого являются объекты класса TPoint. Например, var a: array [1..10] of TPoint; В процедуре обращение к элементам этого массива производится с указанием имени массива и компонента (свойства) - координаты. Например, a[5].X := 250; //пятой точке присваивается абсцисса равная 250 a[5].Y := 120; //пятой точке присваивается ордината равная 120 После задания координат точек вычерчивание замкнутого многоугольника или незамкнутой ломаной линии выполняется аналогично вызову метода рисования любого примитива, но параметром этого метода будет имя массива точек. Например, PaintBox1.Canvas.Polyline(a);//вычерчивание ломаной Для вычерчивания замкнутых или незамкнутых контуров проще использовать эти два метода, однако, не в каждой системе программирования может для этого оказаться подходящий метод. Более общим является метод вычерчивания линейных контуров с помощью отдельных отрезков. Для рисования каждого отдельного звена можно рисовать отрезок. Для этого используются два метода, выполняемых последовательно для рисования одного отрезка: MoveTo(X0, Y0); //помещает курсор в начальную точку для рисования отрезка LineTo(X1, Yl); //рисует отрезок из точки с координатами (X0, Y0) в точку с координатами ( X1, Y1) Для вычерчивания отдельных отрезков, концы которых не совпадают, эти два метода выполняются последовательно попарно. Т.е. для каждого отдельного отрезка необходима пара таких команд. Например, в форме или компоненте PaintBox для вычерчивания координатной сетки через заданный шаг. for j := 1 to k do begin with Canvas.Pen do begin Width := 1; Color := clGreen; Style := psDot;//штриховая линия end; with Canvas do begin MoveTo(5, dy*j); // рисование вертикальной линии LineTo(PaintBox8.Width, dy*j); // с шагом dy end; end; Метод базовой точки При программировании сложных изображений, состоящих из множества элементов, используется метод, который называется методом базовой точки. Суть этого метода заключается в следующем: Выбирается некоторая точка изображения, которая принимается за базовую. Координаты остальных точек отсчитываются от базовой точки. В виде команд это может выглядеть следующим образом: //Вычерчивание контура методом базовой точки x0 := 10; y0 := 50;//задаём координаты базовой точки with PaintBox.Canvas do begin Pen.Width := 2; Pen.Color := clGreen; MoveTo(x0, y0); //установка пера в начальную (базовую) точку таниц по X, по Y - без изменений  Метод Pixels Для рисования графиков функций можно использовать метод Pixels. Поверхности, на которую программа может осуществлять вывод графики, соответствует объект Canvas. Свойство Pixels, представляющее собой двумерный массив типа TColor, содержит информацию о цвете каждой точки графической поверхности. Используя свойство Pixels, можно задать требуемый цвет для любой точки графической поверхности, т. е. «нарисовать» точку. Например, инструкция FormLCanvas.Pixels [10,10]:=clRed; окрашивает точку поверхности формы с координатами X = 10, Y = 10 в красный цвет. Используя уравнение функции, можно вычислить положение точки в произвольной системе координат. Если считать исходную систему координат с осями OX и OY, используемую в компонентах, базовой системой, то любая новая система координат с осями O'X' и CY' может быть использована как относительная система координат. Относительную систему координат всегда выбирают таким образом, чтобы вычисления координат точек в ней были максимально просты. Но построение точек любом случае необходимо выполнить в базовой системе координат. Для этого необходимо координаты точки М в относительной (новой) системе координат преобразовать в координаты в базовой (старой) системы. Если координаты начала новой системы координат в базовой системе координат равны (x0, yo), то связь между координатами можно выразить следующими уравнениями:  В случае задания новой системы координат, в которой оси не будут параллельны осям базовой системы координат, то уравнения преобразования будут иметь другой вид. Вывод точечных изображений. Для вывода точечных изображений в приложении используется компонент Image из палитры компонентов Additional. Для вывода изображения в свойствах компонента Image используется свойство Pictures, щелчком по которому вызывается диалоговое окно Picture Editor.  Кнопка Load позволяет в дальнейшем в окне проводника выбрать соответствующий диск, папку и файл изображения.  Для использования в приложениях Delphi доступны точечные изображения в формате GIF, JPG, BMP, файлы ярлыков ICO и векторные метафайлы в формате EMF и WMF. В свойствах объекта Image для отображения изображения целиком необходимо задать два свойства, которые позволяют автоматически масштабировать изображение: Proportional - при значении True изображение автоматически масштабируется для отображения в пределах компонента Image. При этом пропорциональность исходного изображения сохраняется при любом изменении размера компонента Image. Если размер изображения превышает размеры охватывающего прямоугольника компонента, а свойство Stretch имеет значение False, то изображение будет урезано. Для контроля пропорционального изменения ширины и высоты изображения при растяжении предусмотрено свойство Proportional, указывающее, следует ли (значение True) сохранять изначальное соотношение ширины и высоты: Если данная возможность используется, то изображение увеличивается до того момента, когда его ширина либо высота достигнут, соответственно, ширины или высоты охватывающего прямоугольника компонента. При перемещении проекта Delphi с использованием изображений на другой компьютер необходимо чтобы графические файлы находились в той же папке, что и файлы проекта (или во вложенной папке). 2. Для окна проекта задать следующие свойства: Размер формы: ширина - 700 пикселей, высота - 500 пикселей. Заголовок формы - Лабораторная работа № 10. Для предотвращения изменения размера окна указанные размеры задать в свойстве Constraints формы. 3. С использованием компонентов сконструировать интерфейс программы.  Задание 1. На вкладке Примитивы разместить объект Shape в свойствах которого задать: тип фигуры - прямоугольник, положение, ширину и высоту прямоугольника задать самостоятельно в конструкторе. Ширину задать больше, чем высоту. Для изменения параметров фигуры использовать группы переключателей, кнопки и счётчик. Для изменения цвета контура и цвета заливки использовать диалоги ColorDialog. По щелчку по соответствующей кнопке процедура может иметь соответствующий вид: ColorDialog1.Execute(); Shape1.Brush.Color := ColorDialog1.Color; Во вкладке Точечные изображения необходимо вставить точечное изображение в компоненте Image и настроить его свойство для отображения всего изображения в целом. Для примера использовать изображение небольшого размера в пикселях - 200-300 точек. Для задания размеров изображения в программе необходимо с помощью группы переключателей задать 3-4 различных размера, но с пропорцией, соответствующей пропорции исходного изображения. Например, размер исходного изображения 300*200 пикселей, тогда размеры в списке группы переключателей могут быть 150*100, 75*50 и т.д.  Задание 3. Используя метод базовой точки, а так же рисование контуров в виде окружностей, прямоугольников, во вкладке Метод базовой точки создать сложный контур, состоящий из 12-15 точек. Для рисования добавить компонент PaintBox и использовать его событие onPaint. Пример процедуры рисования контура методом базовой точки. procedure TForm1.PaintBox1Paint(Sender: TObject); var x0, y0: integer; begin x0 := 15; y0 := 15; //Метод базовой точки для рисования //сложного контура with PaintBox1.Canvas do begin Pen.Color := RGB(200, 100, 50); Pen.Width := 2; MoveTo(x0, y0); LineTo(x0 + 40, y0); LineTo(x0 + 140, y0 + 100); LineTo(x0 + 180, y0 + 100); LineTo(x0 + 220, y0 + 140); LineTo(x0 + 180, y0 + 140); LineTo(x0 + 140, y0 + 180); LineTo(x0 + 140, y0 + 220); LineTo(x0 + 100, y0 + 180); LineTo(x0 + 100, y0 + 140); LineTo(x0 , y0 + 40); LineTo(x0 , y0); Ellipse(x0 + 15, y0 + 15, x0 + 30, y0 + 30); end;  end; | ||||||||||||||||||||||||||||||||||||||||||||||