§ 4. Элементы управления для работы с графикой

4.2. Построение графиков функций

Некоторые компоненты в Delphi, такие как форма, компонент Image и др., имеют свойство Canvas (канва, холст). Канва представляет собой область, на которой можно рисовать или выводить на нее растровые изображения. Система координат у канвы такая же, как и для любого компонента в Delphi — точка с координатами (0, 0) расположена в верхнем левом углу, ось ОY направлена вниз. Каждая точка имеет координаты X и Y. Координаты измеряются в пикселях. Важнейшее свойство пикселя — его цвет. Цвет пикселя канвы определяется значением свойства Pixels. Это свойство представляет собой двумерный массив, в котором хранится цвет каждого пикселя. Для задания цвета в Delphi можно воспользоваться несколькими способами (пример 4.4).

Класс TCanvas содержит большое количество свойств и методов, позволяющих строить изображения. Многие из методов канвы совпадают с процедурами, которые использовались в библиотеке GraphABC среды программирования PascalABC.Net. Описание этих методов приведено в приложении.

Пример 4.5. Создать проект, в котором построить график функции  y = xsinна промежутке, заданном пользователем.

Этапы выполнения задания

  1. Поместить на форму компоненты: Image, два компонента Label, два компонента Edit и компонент Button.
  2. Изменить свойства Caption у компонентов Label1, Label2 на x0 и xn соответственно.
  3. Изменить свойства Text у компонентов Edit1 и Edit2 на — 20 и 20 соответственно.
  4. Изменить свойства Caption у компонента Button1 на «Построить график».
  5. Написать обработчик события OnClick для компонента Button1, график функции по точкам.

5.1. Нарисовать оси координат в виде двух перпендикулярных линий, пересекающихся в центре компонента Image.
5.2. Чтобы получить видимость сплошной линии, количество точек, которые образуют график функции, должно быть не менее 10000 (n = 10000 ).
5.3. Шаг изменения значения x определяется как
5.4. При построении нужно учитывать масштаб: ширина компонента Image должна соответствовать длине заданного промежутка. Тогда масштабный коэффициент можно рассчитать по формуле
5.5. Поскольку расположение осей координат на экране не совпадает с расположением осей, принятым в математике, то нужно преобразовать координаты: точке (0; 0) должна соответствовать точка в центре компонента Image. Для этого полученное значение x нужно увеличить на значение cx = Image1.Widt div2, а значение у на cy = Image1.Height div2. Так как ось Y направлена вниз, а не вверх, то значение  нужно изменить, поменяв знак на противоположный. На канве будет закрашиваться точка с координатами ( xekr = x · k + cx,  yekr = –y · k + cy).
5.6. Необходимо учитывать, что при вычислении значения x и y будут вещественными, а значения координат на канве могут быть только целыми. Поэтому перед прорисовкой точки нужно преобразовать вещественные числа в целые с помощью функции trunc.

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

  Image1.Picture := Nil;

Пример 4.4. Способы задания цвета в Delphi:

  1. Задание цвета с помощью констант. Значения констант начинаются на буквосочетание cl. Далее может следовать имя цвета (например, clSkyBlue — небесно-синий, clRed — красный) или элементов Windows, цвет которых зависит от настроек пользователя (clBtnFace — цвет поверхности кнопки, clActivCaption — цвет строки заголовка активного окна). Список возможных значений можно посмотреть в инспекторе объектов у любого компонента, обладающего свойством Color или посмотреть в приложении.
  2. Задание цвета с помощью шестнадцатеричных чисел. Пары цифр шестнадцатеричного числа задают интенсивность синего, зеленого и красного цветов соответственно. Например, $FF0000 — синий цвет, $00FF00 — зеленый, $000000 — черный, $FFFFFF — белый.
  3. Шестнадцатеричные числа можно перевести в десятичную систему счисления и пользоваться этими значениями.
  4. Для задания цвета можно воспользоваться функцией RGB, три параметра которой задают интенсивность красного, синего и зеленого цветов соответственно. Значения параметров могут изменяться от 0 до 255.

Пример 4.5. Форма на этапе конструирования:

Обработчик события OnClick для компонента Button1.

procedure TForm1.Button1Click(Sender: TObject);
var x0, xn, x, y, h, k :real;
    x_ekr, y_ekr, c_x, c_y, n, i :integer;
 begin
  // количество точек
  n := 10000;
  // концы промежутка
  x0 := StrToFloat(Edit1.Text);
  xn := StrToFloat(Edit2.Text);
  // центр области построения
  c_x := Image1.Width div 2;
  c_y := Image1.Height div 2;
  // масштабный коэффициент
  k := Image1.Width / (xn - x0);
  // шаг
  h := (xn - x0) / n;
  // оси
  Image1.Canvas.MoveTo(0, c_y);
  Image1.Canvas.LineTo(2*c_x, c_y);
  Image1.Canvas.MoveTo(c_x, 0);
  Image1.Canvas.LineTo(c_x, 2*c_y);
  x := x0;
  for i := 1 to n do
  begin
    y := x * sin(x);
    //преобразование координат
    x_ekr := trunc(x * k) + c_x;
    y_ekr := trunc(-y * k) + c_y;
    //построение точки синим цветом
    Image1.Canvas.Pixels[x_ekr, y_ekr] := clBlue;
    //следующая точка
    x := x + h;
  end;
end;

 Работающее приложение:

Пример 4.6. Изменение начальных значений концов промежутка:

Константа Nil, имеет значение «ничего». Формально — это значение указателя, который не ссылается ни на какой объект.