Конспекты уроков ЛПЗ

Использование графических возможностей Delphi

20 апреля, 2018
Администратор ресурса

Тема: Использование графических возможностей.
Цель лабораторной работы – Познакомиться с графическими возможностями Delphi.

Студенты должны научиться:

  • Создавать какие-либо графические штуки J
  • Использовать графические возможности
  • Применять графические возможности
  • Создавать графики

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

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

 Пиктограмма Название Страница Назначение
Image (изображение) Additional Используется для отображения графики: пиктограмм, битовых изображений и метафайлов
Shape (форма) Additional Используется для построения геометрических примитивов
DrawGrid

(таблица рисунков)

 Additional Используется для создания в приложении таблицы, которая может содержать графические изображения
Chart

(диаграммы и графики)

 Additional Используется для создания диаграмм и графиков
PaintBox

(окно для рисования)

 System Используется для создания на форме некоторой области, в которой можно рисовать

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

Shape: только условно может быть отнесен к средствам отображения графической информации, поскольку просто представляет собой различные геометрические фигуры, соответствующим образом заштрихованные. Основное свойство этого компонента — Shape (форма), которое может принимать значения, Brush (кисть) – это свойство является объектом типа TBrush, имеющим ряд подсвойств, в частности: цвет (Brush.Color) и стиль (Brush.Style) заливки фигуры. Третье из специфических свойство компонента Shape — Pen (перо), определяющее стиль линий.

Image:  основные свойства: Picture – отвечает за загрузку изображения, Stretch – отвечает за размер изображения в компоненте Image, AutoSize – отвечает за размер компонента, в который было загружено изображение с учетом размера изображения.

Chart: Для задания отображаемых значений надо использовать методы серий Series. Рассмотрим три из них.

Метод Clear очищает серию от занесенных ранее данных.

Метод Add: – Add(Const AValue: Double; Const ALabel: String; AColor: TColor)

позволяет добавить в диаграмму новую точку. Параметр AValue соответствует добавляемому значению функции, а значение аргумента функции заполняется автоматически, поэтому его задавать не нужно, параметр ALabel – название, которое будет отображаться на диаграмме и в легенде, AColor – цвет. Параметр ALabel – не обязательный, его можно задать пустым: ”.

Метод AddXY – AddXY(Const AXValue, AYValue: Double; Const ALabel: String; AColor: TColor)

позволяет добавить новую точку в график функции.  Параметры AXValue и AYValue соответствуют аргументу и функции. Параметры ALabel и AColor те же, что и в методе Add.

PaintBox: находиться на странице System. Он представляет из себя простое окно с канвой, где можно рисовать произвольные изображения. Графические инструменты  содержаться в свойствах Font, Brush и Pen.  Канва (холст) содержится в свойстве Canvas компонента. Само рисование программируется в обработчике события onPaint.

Задание 1

  1. Создать программу, которые знакомит вас с компонентом Image. Необходимо поместить компоненты: Label, Image, BitBtn, Button. Подписать как на изображении и загрузить любое изображение. Настройте компоненты, чтоб в Image1 изображение входило в рамки, а в Image2 изображение соответствовало своему размеру. Сделайте всплывающие подсказки, при наведении на каждое изображение, свойство Hint отвечает за подсказки, для отображения нужно ввести текст и включить подсказки в свойстве ShowHint.

 

Задание 2

  1. Увеличить размер формы, и добавить компоненты: Shape, Label. Подписать.
  2. Каждому компоненту Shape применить свои стили согласно изображению:

Задание 3

  1. Для примера, расположим компонент PaintBox на форму. Обработчик onPaint:

with PaintBox1, canvas do

begin

Brush.Color := clRed;

Pie(12,100,140,280,12,100,140,280);

Pen.Width := 4;

Pen.Color := clGreen;

Pen.Style := psDash;

Rectangle(120,60,Width,Height);

Pen.Width := 1;

Pen.Color := clRed;

Polyline([Point(40, 10), Point(20, 60), Point(70, 30),

Point(10, 30), Point(60, 60), Point(40, 10)]);

TextOut(75,20,’Здесь может быть Ваш текст!’);

end;

Пояснение: Первая строка задает цвет заполнения: Brush.Color := clRed; Вторая рисует часть эллипса: Pie(12,100,140,280,12,100,140,280); Следующие строки задают параметры пера (какая будет окантовка у фигур), ширину, цвет и стиль линии: Pen.Width := 4; Pen.Color := clGreen; Pen.Style := psDash; Но в данном случае мы будем видеть одну сплошную линию, так как при толщине более одного пиксела стиль линий будет psSolid (сплошной). За прорисовку квадрата отвечает следующая строка: Rectangle(120,60,Width,Height); Красную звездочку рисует нижеследующая команда: Polyline([Point(40, 10), Point(20, 60), Point(70, 30), Point(10, 30), Point(60, 60), Point(40, 10)]); За вывод текста отвечает последняя строка: TextOut(75,20,’Здесь может быть Ваш текст!’);

Задание 4

1.                  Сделать программу, которая строит заданный график функции y=10*sin(x)

  1. Увеличить в размерах форму и поместить на нее компонентTСhart из вкладки Additional, и разместить компонент Button, Label. Растянуть новый TСhart до удобного для разработки размера.
  2. Заходим в редактор графиков двойным нажатием на компонент. Редактируем и настраиваем внешний вид Series. Для этого нажимаем Add и выбираем тип графика Line и жмем ОК. Для смены заголовка, нажать Title и ввести формулу y=10*sin(x).
  3. Прописать код для вычерчивания графика в событии OnClick компонента Button:

Var i:integer;

begin

Series1.Clear;

for i:=0 to 22 do

begin

Series1.AddXY(i*0.29,10*sin(i*0.29),”,clGreen);

end;

Пояснение: метод Series1.Clear; очищает серию от занесенных ранее данных, чтоб при обновлении не было старых значений. Для рисования графика, необходимы значения, в нашем случае 22 значения, при которых происходит прорисовывание графика функцией Series1.AddXY(i*0.29,10*sin(i*0.29),”,clGreen);, где i*0.29 (AXValue) это аргумент, а 10*sin(i*0.29) (AYValue) значение вычисления функции, ” (ALabel) название, которое будет отображаться на диаграмме и в легенде, можно оставить пустым, и clGreen (AColor ) – цвет линий.

  1. Самостоятельно выполнить следующее задание: нарисовать график функций
  2. y=3.2*(14*x) [5..10]
  3. y=sin (x) [1..25]
  4. y=cos (x) [5..17]
  5. y=x2+cos(x) [1..5]
  6. y=x2-4.5*4 [1,0 .. 2,0]

Задание 5

  1. Создайте приложение, которое позволяет просматривать символы системных шрифтов.
  2. Увеличить в размерах форму, разместить DrawGrid1, ComboBox1, Label. Настройте у компонента DrawGrid1 следующие свойства: RowCount=7, ColCount=32, FixedCols=0, FixedRows=0, DafaultColWidth=20, DefaultRowHeight=20.
  3. Для того чтобы содержимое каждой ячейки перерисовывалось, создайте обработчик события OnDrawCell для компонента DrawGrid1. Для изображения символов шрифта воспользуемся свойством Canvas компонента DrawGrid1. Непосредственно нам понадобится метод TextRect свойства Canvas. Этот метод используется для вывода текстовой информации в определенной ячейке. Обработчик события будет выглядеть так:

DrawGrid1.Canvas.textrect(rect, Rect.Left, Rect.Top, char ((ARow+1)*32+acol));

  1. Сохраните проект. Убедитесь, что в ячейках таблицы отображаются символы системного шрифта, установленного по умолчанию.
  2. Для выбора шрифта воспользуемся компонентом ComboBox1. Для того чтобы данный компонент содержал все экранные шрифты, надо при создании формы занести их в список. Названия всех экранных шрифтов можно узнать с помощью глобальной переменной Screen типа TScreen. Данная переменная автоматически добавляется во все приложения Delphi. Пе­ременная Screen содержит информацию о текущем состоянии экрана приложения: названия форм и модулей данных, кото­рые используются приложением; данные об активной форме и компонентах, используемых этой формой; размер и разрешение используемого экрана; информацию о доступных приложению курсорах и шрифтах. Информация о доступных приложению шрифтах содержит­ся в свойстве Font, принадлежащем переменной Screen.
  3. Создайте для формы обработчик события onCreate и внесите в него операторы:

with ComboBox1 do begin

Items:=Screen.Fonts;

ItemIndex:=Items.IndexOf(Font.Name);

  1. Сохраните и запустите проект. Компонент DrawGrid1 содержит символы шрифта, установленного в ComboBox1.
  2. Для того чтобы связать значение имени шрифта у DrawGrid1 и ComboBox1, создадим еще один обработчик события:

DrawGrid1.Font.Name:=ComboBox1.Text;

  1. Сохраните и запустите проект.

Содержание отчета:

  1. Номер, тема, цель лабораторной работы.
  2. Задание к работе.
  3. Описание входных, промежуточных и результирующих данных с указанием их типа.
  4. Программа на языке программирования.
  5. Результат выполнения программы (Введенное данные и полученные данные)
  6. Вставить код, написанный вами
  7. Вывод о проделанной работе.Тема: Использование графических возможностей.

    Цель лабораторной работы – Познакомиться с графическими возможностями Delphi.

    Студенты должны научиться:

    • Создавать какие-либо графические штуки J
    • Использовать графические возможности
    • Применять графические возможности
    • Создавать графики

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

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

     Пиктограмма Название Страница Назначение
    Image (изображение) Additional Используется для отображения графики: пиктограмм, битовых изображений и метафайлов
    Shape (форма) Additional Используется для построения геометрических примитивов
    DrawGrid

    (таблица рисунков)

    		 Additional Используется для создания в приложении таблицы, которая может содержать графические изображения
    Chart

    (диаграммы и графики)

    		 Additional Используется для создания диаграмм и графиков
    PaintBox

    (окно для рисования)

    		 System Используется для создания на форме некоторой области, в которой можно рисовать

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

    Shape: только условно может быть отнесен к средствам отображения графической информации, поскольку просто представляет собой различные геометрические фигуры, соответствующим образом заштрихованные. Основное свойство этого компонента — Shape (форма), которое может принимать значения, Brush (кисть) – это свойство является объектом типа TBrush, имеющим ряд подсвойств, в частности: цвет (Brush.Color) и стиль (Brush.Style) заливки фигуры. Третье из специфических свойство компонента Shape — Pen (перо), определяющее стиль линий.

    Image:  основные свойства: Picture – отвечает за загрузку изображения, Stretch – отвечает за размер изображения в компоненте Image, AutoSize – отвечает за размер компонента, в который было загружено изображение с учетом размера изображения.

    Chart: Для задания отображаемых значений надо использовать методы серий Series. Рассмотрим три из них.

    Метод Clear очищает серию от занесенных ранее данных.

    Метод Add: – Add(Const AValue: Double; Const ALabel: String; AColor: TColor)

    позволяет добавить в диаграмму новую точку. Параметр AValue соответствует добавляемому значению функции, а значение аргумента функции заполняется автоматически, поэтому его задавать не нужно, параметр ALabel – название, которое будет отображаться на диаграмме и в легенде, AColor – цвет. Параметр ALabel – не обязательный, его можно задать пустым: ”.

    Метод AddXY – AddXY(Const AXValue, AYValue: Double; Const ALabel: String; AColor: TColor)

    позволяет добавить новую точку в график функции.  Параметры AXValue и AYValue соответствуют аргументу и функции. Параметры ALabel и AColor те же, что и в методе Add.

    PaintBox: находиться на странице System. Он представляет из себя простое окно с канвой, где можно рисовать произвольные изображения. Графические инструменты  содержаться в свойствах Font, Brush и Pen.  Канва (холст) содержится в свойстве Canvas компонента. Само рисование программируется в обработчике события onPaint.

    Задание 1

    1. Создать программу, которые знакомит вас с компонентом Image. Необходимо поместить компоненты: Label, Image, BitBtn, Button. Подписать как на изображении и загрузить любое изображение. Настройте компоненты, чтоб в Image1 изображение входило в рамки, а в Image2 изображение соответствовало своему размеру. Сделайте всплывающие подсказки, при наведении на каждое изображение, свойство Hint отвечает за подсказки, для отображения нужно ввести текст и включить подсказки в свойстве ShowHint.

     

    Задание 2

    1. Увеличить размер формы, и добавить компоненты: Shape, Label. Подписать.
    2. Каждому компоненту Shape применить свои стили согласно изображению:

    Задание 3

    1. Для примера, расположим компонент PaintBox на форму. Обработчик onPaint:

    with PaintBox1, canvas do

    begin

    Brush.Color := clRed;

    Pie(12,100,140,280,12,100,140,280);

    Pen.Width := 4;

    Pen.Color := clGreen;

    Pen.Style := psDash;

    Rectangle(120,60,Width,Height);

    Pen.Width := 1;

    Pen.Color := clRed;

    Polyline([Point(40, 10), Point(20, 60), Point(70, 30),

    Point(10, 30), Point(60, 60), Point(40, 10)]);

    TextOut(75,20,’Здесь может быть Ваш текст!’);

    end;

    Пояснение: Первая строка задает цвет заполнения: Brush.Color := clRed; Вторая рисует часть эллипса: Pie(12,100,140,280,12,100,140,280); Следующие строки задают параметры пера (какая будет окантовка у фигур), ширину, цвет и стиль линии: Pen.Width := 4; Pen.Color := clGreen; Pen.Style := psDash; Но в данном случае мы будем видеть одну сплошную линию, так как при толщине более одного пиксела стиль линий будет psSolid (сплошной). За прорисовку квадрата отвечает следующая строка: Rectangle(120,60,Width,Height); Красную звездочку рисует нижеследующая команда: Polyline([Point(40, 10), Point(20, 60), Point(70, 30), Point(10, 30), Point(60, 60), Point(40, 10)]); За вывод текста отвечает последняя строка: TextOut(75,20,’Здесь может быть Ваш текст!’);

    Задание 4

    1.                  Сделать программу, которая строит заданный график функции y=10*sin(x)

    1. Увеличить в размерах форму и поместить на нее компонентTСhart из вкладки Additional, и разместить компонент Button, Label. Растянуть новый TСhart до удобного для разработки размера.
    2. Заходим в редактор графиков двойным нажатием на компонент. Редактируем и настраиваем внешний вид Series. Для этого нажимаем Add и выбираем тип графика Line и жмем ОК. Для смены заголовка, нажать Title и ввести формулу y=10*sin(x).
    3. Прописать код для вычерчивания графика в событии OnClick компонента Button:

    Var i:integer;

    begin

    Series1.Clear;

    for i:=0 to 22 do

    begin

    Series1.AddXY(i*0.29,10*sin(i*0.29),”,clGreen);

    end;

    Пояснение: метод Series1.Clear; очищает серию от занесенных ранее данных, чтоб при обновлении не было старых значений. Для рисования графика, необходимы значения, в нашем случае 22 значения, при которых происходит прорисовывание графика функцией Series1.AddXY(i*0.29,10*sin(i*0.29),”,clGreen);, где i*0.29 (AXValue) это аргумент, а 10*sin(i*0.29) (AYValue) значение вычисления функции, ” (ALabel) название, которое будет отображаться на диаграмме и в легенде, можно оставить пустым, и clGreen (AColor ) – цвет линий.

    1. Самостоятельно выполнить следующее задание: нарисовать график функций
    2. y=3.2*(14*x) [5..10]
    3. y=sin (x) [1..25]
    4. y=cos (x) [5..17]
    5. y=x2+cos(x) [1..5]
    6. y=x2-4.5*4 [1,0 .. 2,0]

    Задание 5

    1. Создайте приложение, которое позволяет просматривать символы системных шрифтов.
    2. Увеличить в размерах форму, разместить DrawGrid1, ComboBox1, Label. Настройте у компонента DrawGrid1 следующие свойства: RowCount=7, ColCount=32, FixedCols=0, FixedRows=0, DafaultColWidth=20, DefaultRowHeight=20.
    3. Для того чтобы содержимое каждой ячейки перерисовывалось, создайте обработчик события OnDrawCell для компонента DrawGrid1. Для изображения символов шрифта воспользуемся свойством Canvas компонента DrawGrid1. Непосредственно нам понадобится метод TextRect свойства Canvas. Этот метод используется для вывода текстовой информации в определенной ячейке. Обработчик события будет выглядеть так:

    DrawGrid1.Canvas.textrect(rect, Rect.Left, Rect.Top, char ((ARow+1)*32+acol));

    1. Сохраните проект. Убедитесь, что в ячейках таблицы отображаются символы системного шрифта, установленного по умолчанию.
    2. Для выбора шрифта воспользуемся компонентом ComboBox1. Для того чтобы данный компонент содержал все экранные шрифты, надо при создании формы занести их в список. Названия всех экранных шрифтов можно узнать с помощью глобальной переменной Screen типа TScreen. Данная переменная автоматически добавляется во все приложения Delphi. Пе­ременная Screen содержит информацию о текущем состоянии экрана приложения: названия форм и модулей данных, кото­рые используются приложением; данные об активной форме и компонентах, используемых этой формой; размер и разрешение используемого экрана; информацию о доступных приложению курсорах и шрифтах. Информация о доступных приложению шрифтах содержит­ся в свойстве Font, принадлежащем переменной Screen.
    3. Создайте для формы обработчик события onCreate и внесите в него операторы:

    with ComboBox1 do begin

    Items:=Screen.Fonts;

    ItemIndex:=Items.IndexOf(Font.Name);

    1. Сохраните и запустите проект. Компонент DrawGrid1 содержит символы шрифта, установленного в ComboBox1.
    2. Для того чтобы связать значение имени шрифта у DrawGrid1 и ComboBox1, создадим еще один обработчик события:

    DrawGrid1.Font.Name:=ComboBox1.Text;

    1. Сохраните и запустите проект.

    Содержание отчета:

    1. Номер, тема, цель лабораторной работы.
    2. Задание к работе.
    3. Описание входных, промежуточных и результирующих данных с указанием их типа.
    4. Программа на языке программирования.
    5. Результат выполнения программы (Введенное данные и полученные данные)
    6. Вставить код, написанный вами
    7. Вывод о проделанной работе.

Автор публикации

не в сети 2 месяца

Администратор ресурса

Здравствуйте. Если у Вас возникают какие-либо вопросы касательно работы сайта, то вы можете написать на электронную почту admin@learn-more.kz
Комментарии: 24Публикации: 275Регистрация: 25-01-2017

Добавить комментарий