C# — График функции


Содержание

Двумерная графика на C#, классы Graphics, Pen и Brush

На примере графики наглядно видны преимущества ООП, смысл использования классов, их методов и свойств. Добавляя в пространство имен своего проекта соответствующие библиотеки, вы получаете сразу набор инструментов, необходимых для графики. Это графические примитивы (линии, прямоугольники, эллипсы и т.п.), перо для черчения, кисть для закраски и много других полезных объектов и методов.

2D-графика делится, как вы знаете, на растровую и векторную. Растровое изображение — это набор цветных пикселей, заданных в прямоугольной области, хранящихся в файлах *.bmp, *.jpg, *.png и т.п. Самый простой растровый редактор — программа Paint. Векторная графика намного экономнее (по объемам памяти) растровой. Так для рисования прямоугольника достаточно задать координаты двух точек (левого верхнего и правого нижнего углов) и цвет и толщину линии. В этом разделе в основном рассмотрим методы векторной графики.

Пространство имен System.Drawing (Рисование) обеспечивает доступ к функциональным возможностям графического интерфейса GDI+ , используя около 50 (!) классов, в том числе класс Graphics. Чуть позже мы будем использовать дополнительные пространства имен System.Drawing.Drawing2D, System.Drawing.Imaging, System.Drawing.Printing, System.Drawing.Text, расширяющие функциональные возможности библиотеки System.Drawing.

Класс Graphics предоставляет методы рисования на устройстве отображения (другие термины — графический контекст, «холст»). Определимся сразу, на чем мы хотим рисовать. Далее в примерах он обозначается как объект g.

Способы задания «холста»

1. Графический объект — «холст» для рисования на форме Form1 (указатель this) можно задать, например, одним оператором:
Graphics g = this.CreateGraphics();
Примечание. Заметим, что стандартным образом
Graphics g = new Graphics();
создать объект-холст не удается.
На этом операторе генерируется ошибка:
Для типа «System.Drawing.Graphics» не определен конструктор.

2. Еще пример задания графического контекста на визуальном компоненте PictureBox (ящик для рисования) через растровый объект класса Bitmap. В классе Form1 зададим два объекта:
Graphics g; // графический объект — некий холст
Bitmap buf; // буфер для Bitmap-изображения
В конструктор Form1() добавим следующие операторы:
buf = new Bitmap(pictureBox1.Width, pictureBox1.Height); // с размерами
g = Graphics.FromImage(buf); // инициализация g

3. В принципе, иногда (если все графические операции выполняются внутри одной функции) эти четыре строки могут быть заменены одной строкой:
Graphics g = Graphics.FromImage(new Bitmap(pictureBox1.Width, pictureBox1.Height));
После этого можно задать фон холста белым:
g.Clear(Color.White);

4. Еще один пример задания «холста» на форме через дескриптор окна:
Graphics g = Graphics.FromHwnd(this.Handle);
Далее в примерах конкретизируются эти способы.

Объекты других классов из библиотеки System.Drawing

Такие классы, как Rectangle (прямоугольник) и Point (точка) инкапсулируют элементы GDI+. Отметим, что Point вообще то является структурой (struct) с полями x,y. Это уточнение несущественно, так как в C# структуры похожи на классы, a инициализация объекта-структуры point может выглядеть так же, как инициализация объекта-класса:
Point point= new Point();

Класс Pen (перо) используется для рисования линий и кривых, а классы, производные от класса Brush (кисть) используются для закраски замкнутых контуров (см. ниже).

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

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

Класс Graphics

Он инкапсулирует поверхность рисования GDI+. Этот класс не наследуется. Методов в этом классе огромное количество, поэтому сначала представим их в таблице, а затем рассмотрим некоторые из них с примерами и пояснениями.
В третьем столбце таблицы указывается число перегрузок метода, различающихся набором параметров (используйте интеллектуальную подсказку IntelliSense для выбора нужного Вам варианта метода).

Имя метода Описание Число перегрузок
Clear(Color) Очищает всю поверхность рисования и выполняет заливку поверхности указанным цветом фона. 1
CopyFromScreen(Point, Point, Size) Выполняет передачу данных о цвете, соответствующих прямоугольной области пикселей, блоками битов с экрана на поверхность рисования объекта Graphics. 4
Dispose() Освобождает все ресурсы, используемые данным объектом Graphics. 1
DrawArc(Pen, Rectangle, Single, Single) Рисует дугу, которая является частью эллипса, заданного структурой Rectangle. 4
DrawBezier(Pen, Point, Point, Point, Point) Рисует кривую Безье, определяемую четырьмя структурами Point. 3
DrawBeziers(Pen, Point[]) Рисует несколько (N) кривых Безье, определяемых массивом из (3N+1) структур Point. 2
DrawCloseCurve(Pen, Point[ ]) Рисует замкнутый фундаментальный сплайн 4
DrawEllipse(Pen, Rectangle) Рисует эллипс 4
DrawIcon(Icon, Rectangle) Рисует значок 2
DrawImage(Image image, int x, int y) Рисует заданное изображение image, используя его фактический размер в месте с координатами (x,y) 30
DrawLine(Pen, Point, Point) Проводит линию, соединяющую две структуры Point. 4
DrawLines(Pen, Point[ ]) Рисует набор сегментов линий, которые соединяют массив структур Point. 2
DrawPath(Pen, gp) Рисует пером Pen объект GraphicsPath gp. 1
DrawPie(Pen, Rectangle, Single, Single) Рисует сектор, который определяется эллипсом, заданным структурой Rectangle и двумя радиалtьными линиями. 4
DrawPolygon(Pen, Point[]) Рисует многоугольник, определяемый массивом структур Point. 2
DrawRectangle(Pen, Rectangle) Рисует прямоугольник, определяемый структурой Rectangle. 3
DrawRectangles(Pen, Rectangle[]) Рисует набор прямоугольников, определяемых структурами Rectangle. 2
DrawString(String, Font, Brush, PointF) Создает указываемую текстовую строку в заданном месте с помощью определяемых объектов Brush и Font. 6
Equals(Object) Определяет, равен ли заданный объект текущему объекту. (Унаследовано от Object.) 1
ExcludeClip(Rectangle) Обновляет вырезанную область данного объекта Graphics, чтобы исключить из нее часть, определяемую структурой Rectangle. 1
ExcludeClip(Region) Обновляет вырезанную область данного объекта Graphics, чтобы исключить из нее часть, определяемую структурой Region. 1
FillClosedCurve(Brush, Point[]) Заполняет внутреннюю часть замкнутой фундаментальной кривой, определяемой массивом структур Point. 6
FillEllipse(Brush, Rectangle) Заполняет внутреннюю часть эллипса, определяемого ограничивающим прямоугольником, который задан структурой Rectangle. 4
FillPath(Brush, GraphicsPath) Заполняет внутреннюю часть объекта GraphicsPath. 1
FillPie(Brush, Rectangle, Single, Single) Заполняет внутреннюю часть сектора, определяемого эллипсом, который задан структурой RectangleF, и двумя радиальными линиями. 3
FillPolygon(Brush, Point[]) Заполняет внутреннюю часть многоугольника, определяемого массивом точек, заданных структурами Point. 4
FillRectangle(Brush, Rectangle) Заполняет внутреннюю часть прямоугольника, определяемого структурой Rectangle. 4
FillRegion(Brush, Region) Заполняет внутреннюю часть объекта Region. 1
Flush() Вызывает принудительное выполнение всех отложенных графических операций и немедленно возвращается, не дожидаясь их окончания. 2
IntersectClip(Region) Обновляет вырезанную область данного объекта, включая в нее пересечение текущей вырезанной области и указанной структуры 3
ResetClip() Сбрасывает выделенную область g, делая ее бесконечной 1

Подробнее еще о двух классах.

Класс Pen

Класс Pen определяет объект, используемый для рисования прямых линий и кривых. Этот класс не наследуется. Конструкторы класса (тоже пример перегрузки методов):
1) Pen(Color) инициализирует новый экземпляр класса Pen с указанным цветом.
2) Pen(Color, Single) инициализирует новый экземпляр класса Pen с указанными свойствами Color и Width. (Width — устанавливает ширину пера Pen, в единицах объекта Graphics, используемого для рисования
Например:
Pen redPen = new Pen(Color.Red); // толщина пера по умолчанию 1 пиксель
или используя промежуточную переменную green
Color green = Color.Green;
Pen greenPen = new Pen(green, 4.5f);
Можно вводить новый объект без указания явного имени пера (пример создания динамического объекта — пера):
g.DrawRectangle(new Pen(Color.Red, 3), r);
например, для рисования прямоугольника r красным пером толщиной 3 пикселя, используя графический контекст («холст») g.

Класс Brush

Класс Brush определяет объекты, которые используются для заливки внутри графических фигур, таких как прямоугольники, эллипсы, круги, многоугольники и дорожки. Это абстрактный базовый класс, который не может быть реализован. Для создания объекта «кисть» используются классы, производные от Brush, такие как SolidBrush, TextureBrush и LinearGradientBrush, например:
Sol >
g.FillRectangle(br, r); // закраска прямоугольника r на «холсте» g
Или без явного объявления объекта «кисть» br:
g.FillRectangle(new SolidBrush(Color.Red), r);

Для первоначального привыкания к стилю ООП в графике рассмотрим первый пример рисования.

Программируем на C#

Блог содержит статьи, исходные тексты программ на C#. Здесь можно скачать исходник нужной программы.

График линейной функции

Листинг 24.1. Наш код в шаблоне метода для кнопки Graph.

double a_Form3, b_Form3, x_min_Form3, x_max_Form3;

Form5 myForm5 = new Form5();

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

//Объявляем булеву переменную myColor со значением false:

bool myColor = false;

private void timer1_Tick(object sender, EventArgs e)

if (myColor == false)

//Выводим красный цвет переключателя:

//Изменяем значение myColor на противоположное:

//Выводим белый цвет переключателя:

//Изменяем значение myColor на противоположное:

Листинг 24.2. Первая часть кода (выше шаблона pictureBox1_Paint).

//Параметры графика функции y = a*x + b

//в виде глобальных переменных:


public float a, b, x_min, x_max;

float Function_of_graph(float x)

//Метод y = f(x), график которой будем строить:

Function = a * x + b;

Листинг 24.3. Вторая часть кода (выше шаблона pictureBox1_Paint).

//Число точек графика:

public int Npoints = 100;

//Величины (в пикселах) O_x_pix и O_y_pix

//для параллельного переноса

//осей «x» и «y» новой системы координат (по сравнению

//со старой системой в верхнем левом углу рамки PictureBox):

public float O_x_pix = 500;

public float O_y_pix = 350;

//Масштабы по осям «x» и «y» (M_x и M_y) для перехода

//от действительных значений к пикселам

//и построения графика в пикселах:

public float M_x = 450;

public float M_y = 300;

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

Листинг 24.4. Главный код построения графика функции на экране монитора.

//Шаг по оси абсцисс «x» между точками графика:

float step_x = (x_max-x_min)/Npoints;

//Наибольшее абсолютное значение x_max_abs

//из двух концов заданного нами числового интервала

float x_max_abs = Math.Abs(x_max);

if (x_max_abs y_1) y_min = y_1;

if (y_max y_1) y_min = y_1;

//Шаг сетки в направлении оси «y»

//(высота всей сетки равна 2 единицам):

float step_grid_y, step_grid_y_pix;

//Преобразование типов переменных:

//Выбираем красное перо толщиной 1:

Pen redPen = new Pen(Color.Red, 1);

//Строим сетку от нулевой линии в одну сторону (вниз):

int j_y; float y1, y1_pix;

//Шаг сетки в направлении оси «x»

//(ширина всей сетки равна 2 единицам):

//Выбираем красное перо толщиной 1:

Pen redPen_y = new Pen(Color.Red, 1);

//Строим сетку от нулевой линии в одну сторону (вправо):

Раздел 7. Основы работа с графикой на С# в Visual Studio 2005/2008


Аннотация: Весь изложенный материал, без особого труда, можно найти в MSDN и сети, но для большинства статей характерен уход в вопросы, которые затрудняют создание четкого и ясного представления о том, как работать с графикой. При решении корпоративной задачи вывода графиков в Web приложении, автору сначала потребовалось обобщить материал, и, лишь после того, приступить собственно к выполнению задания. Материалы этого обобщения и приводятся в данной статье.

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

Глава 1. Использование графики в Windows приложениях

Параграф 1. Где и как возможно отображать графическую информацию в Windows приложениях

В Visual Studio Net нет стандартных средств для создания графиков, диаграмм. Поэтому, большинство статей на рассматриваемую тему рекомендуют использовать Office Web Components (OWC) — компонент Windows для построения диаграмм в Web. Как достоинство этого подхода обычно отмечается простота построения графиков и диаграмм и интуитивно близкие задания параметров графической информации с их заданием при использовании графики в MS Office. Но простота не всегда достоинство, когда мы строим график «под себя». Да и достаточно для программиста сомнительна, когда он однажды создав код графического класса, он всегда легко и быстро может его перенастроить его для конкретной задачи, не влезая в дебри некого универсального кода, где порой гораздо больше времени будет затрачено на уяснение параметров и задание их значений и границ. Поэтому, речь далее пойдет о создании собственных графиков с «чистого листа». Основные типы графиков, которые будут рассмотрены, по мнению автора, могут стать достаточными для большинства практических задач и базой для дальнейших собственных разработок.

В Microsoft Windows существует несколько средств для вывода графической информации, включая DirectDraw, OpenGL, GDI и т.д. Мы будем использовать Graphics Device Interface (GDI, более поздние версии GDI+) — подсистему Windows, ответственную за вывод графики и текста на дисплей и принтер. Именно CGI+ обеспечивает вывод на экран всего того, что видит пользователь Windows в окне монитора. GDI+ является базовым способом вывода графики в Windows.

CGI+ — это библиотека функций и программных средств на базе API, позволяющая приложениям абстрагироваться от особенностей конкретного графического оборудования. .Net Framework использует расширенный графический интерфейс GDI+.

С графикой Windows (при использованием GDI+) связано понятия контекста устройства (device context, DC). Это структура данных, содержащая информацию о параметрах и атрибутах вывода графики на устройство (дисплей, принтер. ). .Net Framework освобождает программиста от необходимости обращения к DC. Основной объект для графического отображения Graphics — класс имитации поверхности рисования в GDI+. Класс не имеет конструкторов по причине того, что объекты этого класса зависят от контекста конкретных устройств вывода. Создаются объекты специальными методами разных классов, например, он может быть создан из объекта Bitmap, или к нему можно получить доступ, как к некоторому объекту, инкапсулированному в некоторые контролы, в том числе, и в объект формы приложения. Метод CreateGraphics класса Control — наследника класса Form — возвращает объект, ассоциированный с выводом графики на форму.

Рассмотрим простейшие примеры. Создадим решение Windows приложения с одной кнопкой и следующим обработчиком ее нажатия:

Результат вывода при нажатии кнопки 1, показан на Рис.1:

Рис.1. Создание и использование объект класса Graphics на основе битовой матрицы

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

Одинакового эффекта (Рис.1.), можно добиться и при непосредственном создании объекта Graphics:

А так можно рисовать (писать) на кнопке и на других контролах, для которых может быть создан обработчик события Paint (Рис.2.):

Класс Graphics находятся в пространстве имен Drawing (хотя, забегая вперед, нам понадобится и пространство имен Drawing.Drawing2D, по сему, целесообразно сразу добавить их в решение).

Для того чтобы рисовать в окне формы Windows приложения, необходимо иметь не только связанный с этим окном объект Graphics, как холст для рисования, но и инструменты рисования. Используют два основных инструмента: карандаш и кисть. Карандаш мы использовали в примерах, приведенных выше. В конструкторе класса Pen задается цвет пера и можно задать толщину (по умолчанию 1). Класс Brush определяет кисти для рисования. Это абстрактный класс. Кисти этого класса создать нельзя, хотя можно создавать кисти классов-потомков Brush:

SolidBrush — сплошная закраска цветом кисти;

TextureBrush — наложение картинки (image) на область закраски;

HatchBrush — закраска области предопределенным узором;

LinearGradientBrush — сплошная закраска c переходом цвета кисти (градиентная закраска);

PathGradientBrush -сплошная закраска c переходом цвета кисти по специальному алгоритму.

Пример использования конструктора HatchBrush показан на Рис.2.:

Рис.2. Пример использования конструктора HatchBrush

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

Здесь нет необходимости подробно описывать все методы объекта Graphics, их можно легко увидеть из контекстной подсказки, как обычно, поставив точку после написания имени объекта. По этой же причине нет необходимости перечислять и преопределенные цвета карандашей (Color.) и кистей (Brushes.)

Отметим еще два важных момента, которые нам понадобятся далее:

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

Использование событий Paint для отображения графики не всегда оправдано из-за необходимости постоянной перерисовки изображения при перерисовке формы.

Рисование непосредственно на форме не всегда является и не есть хороший тон, кода Visual Studio предлагает специальный контрол, который, как нельзя лучше, подходит для вывода графической информации и обладает всеми преимуществами контролов: программное позиционирование и масштабирование без перерисовки формы, возможность выполнять Stretch Image и множество других полезных свойств и событий. Кроме того простой доступ к Graphics, аналогично через событии Paint и возможность использования битовых карт Bitmap для создания объекта Graphics, с последующим переносом их в контрол (аналогично, как мы делали это в первом примере):

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

Параграф 2. Создание линейных графиков

2.1. В качестве постановки задачи

Однажды мне пришлось делать задачку, на базе продолжения работы над которой появилась программа «LitFrequencyMeter» — программа определения частоты повторения слов и знаков в литературных произведениях, графики из которой приведены ниже (Рис.3-5.). И когда я приступил к заключительному этапу работы над программой, то понял, что материал главы практически написан в кодах — осталось только его озвучить.

Что и какие аспекты были заложены в программу:


Настройка всего и вся: цветов, шрифтов, фонов, надписей, положения диаграмм на холсте, использование пояснений, легенд, смена числа отсчетов и т.д., и т.п.

Хранение всех настроек (включая шрифты) в реестре.

Создание статистики из .txt, .html, .doc файлов.

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

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

Рис.3. Линейеая диаграмма

Рис.5. Круговая диаграмма

2.2. Постановка задачи

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

Конечная цель — помещение созданного графического изображения в элемент управления PictureBox.

2.3. Исходные данные

Исходные данные перед их отображением могут находиться где угодно (файл, таблица базы данных. ). Однако рассматривать чтения из базы данных или из файла значений графиков — только засорять отображение материала. Мы всегда можем прочитать данные с любого источника в массив значений. Автор предпочитает работать со строковым массивом, как позволяющим хранить цифровые и текстовые значения. В примерах, приводимых ниже, используется массив строк string[,] rgsValues. В программе, о которой шла выше речь, этот массив использован для настройки параметров, отображаемых на графике. Заполнять массив будем с помощью датчиков случайных чисел:

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

2.4. Проект решения

Создадим простой проект WindowsApplication решения с любым именем (у меня graph1). Поместим на форму три кнопки, в свойствах «Текст» которых напишем соответственно: «Линейная диаграмма», «Гистонрамма» и «Круговая диаграмма». Ниже кнопок поместим контрол PictureBox. Подберем удобное для себя расположение кнопок и PictureBox (в реальных программах для размещения удобнее использовать контролы TableLayoutPanel, но сейчас нас интересует графика, а не размещение).

В окне Solutation Explorer кликаем правой кнопкой мышки на узле решения (у меня graph1) и в контекстном меню выбираем Add\New Item. В окне Templates выбираем Class, даем ему имя, например PaintCl.cs и нажимаем кнопку Add. Будет создан пустой класс.

Нашей задачей будет постепенное наполнение этого класса при минимуме добавления кода в основной файл кода приложения — Form1.cs.

Для начала создадим обработчик события нажатия кнопки «Линейный график» (клик мышкой на кнопке), а также обработчики для событий Load и FormClozed (первый можно кликом мышки на форме, второй через окно Properties формы — закладка Events — клик в окошечке против события FormClosed). Слегка преобразуем код, как показано ниже:

Назначение переменной viNumButton, будет ясно далее. Массив значений у нас создан. Осталось нарисовать по значениям массива график, используя класс.

2.5. Конструкторы класса

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

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

2.6. Создаем объект для рисования

Используем второй конструктор и создадим и инициализируем в классе сразу все объекты, которые нам необходимы:

Таким образом, нам понадобятся в классе еще две функции: установки фона холста и приема изображения из класса. Добавим их в класс:

Выполним решение на данном этапе. Результат показан на Рис.6.:

Рис.6. Взаимодействие кода формы с кодом класса

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

2.7. Рисуем оси

Добавим в классе переменные для хранения отступов от краев холста (они нам еще понадобятся не один раз).

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

Осталось добавить вызов функции рисования осей:

В функции vDravAxis мы задали параметры непосредственно. Отметим еще раз, что все величины целесообразно иметь настраиваемыми и их значения хранить в реестре.

Рис.7 Рисование осей линейного графика

2.8. Рисуем сетку

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

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

В функции vCreateLinGr() добавим код и выполним решение:

Результат показан на Рис.8.:


Рис.8. Рисование сетки

2.8. Рисуем линию графика

Как мы уже делали — зададим цвет и толщину пера. Далее нам понадобятся данные из нашего массива значений непосредственно в классе. Для этого в классе определим массив и доступ к нему:

В классе создадим функцию рисования линий графика. Линии рисуются по соседним точкам массива:

Код vCreateLinGr() на данный момент:

Результат выполнения решения на данном этапе показан на Рис.9.:

Рис.9. Рисование линий графика

2.10. Надписи на графике

Надписи можно наносить по оси Х, по оси Y и над точками линий графика. Причем иногда бывает целесообразно выполнять соседние надписи со сдвигом по оси Y. Кроме того — надписи выполняются не пером, а кистями и требуют задания шрифта. Таким образом, перед выполнением надписей надо установить в классе соответственно шрифт и кисть (Brush).

Для передачи шрифта и кисти создадим в классе свойства:

В функции рисования графика запишем код:

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

Мы создали полностью код для отображения линейного графика. Все функции для управления построением и изменения внешнего вида представлены в void vCreateLinGr():

Результат выполнения кода показан на Рис.10.:

Рис.10. Линейный график

Параграф 3. Создание гистограмм

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

И так, нам понадобится всего лишь одна новая функция. Основное отличие — использование функции FillRectangle.

Запишем код обработки нажатия кнопки 2 и выполним решение:

Цветом показано единственное отличие от кода создания линейной диаграммы. Результат работы кода приведен на Рис.11.:

Параграф 4. Круговые диаграммы и элементы 3D графики

Построение круговых диаграмм с элементами 3D графики требует несколько больших затрат по сравнению с рассмотренным выше материалом. Прежде всего, необходимо определить дополнительные переменные для величин: оси эллипса (vfDiamX, vfDiamY), центр круговой диаграммы (vfXcirc, vfYcirc). Кроме того, если мы хотим, что бы в легенде (пояснению к графику) цвета надписей соответствовали цветам секторов диаграммы, то потребуется задать массив цветов однозначно соответствующий массиву цветов кистей. Зададим в классе:

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

Рисовать диаграмму будем в несколько этапов:

Первый этап: Против часовой стрелки рисуем последний сектор и сектора, выходящие за границу 180 градусов, но не заходящие за границу 270 градусов. Рисовать будем кистью с прозрачностью, например 25%, и каждый из них со сдвигом на 1 пиксель вниз. Иначе, если толщина диаграммы задана 20 пикселей, то сектор потребуется нарисовать 20 раз, каждый раз сдвигая на 1 пиксель вниз (Рис.12.1.).

Рис.12.1. Первый этап создания круговой диаграммы

Второй этап: Накладываем на данную диаграмму сектора от 0 градусов до сектора, заходящего за 270 градусов, используя Sol >

Рис.12.2. Второй этап создания круговой диаграммы

Третий этап: по часовой стрелки рисуем сектора, начиная со второго, используя HatchBrush. Рисование выполняем до сектора заходящего за границу -90 градусов, со сдвигом на толщину диаграммы (Рис.12.3.).

Рис.12.3. Третий этап создания круговой диаграммы

Четвертый этап: По часовой стрелке накладываем без сдвига, начиная со второго сектора до сектора, заходящего за границу -90 градусов, используя Sol >

Рис.12.4. Четвертый этап создания круговой диаграммы

Отдельно рисуем первый сектор, сначала используя HatchBrush со сдвигом на толщину диаграммы, затем накладываем сектор Sol >

Рис.12.5. Пятый этап создания круговой диаграммы

Алгоритм рисования можно упростить, например, один раз и последним этапом наложить сектора эллипса, нарисованный кистью SolidBrush, но, в этом случае пострадает наглядность.

Эти этапы рисования выполняет следующая функция:

Добавляем функции надписи и легенду и, в принципе, построение диаграммы закончено. Единственное, что потребуется от нас при рисовании надписей на диаграмме — это немного вспомнить начальную школу при расчете координат нанесения значений:

Оформим вызовы функций:


Отметим, что при задании толщины диаграммы, равной нулю, получим обычную эллиптическую диаграмму, а при равенстве осей Х и Y — круговую.

Результат выполнения решения показан на Рис.12.6:

Рис.12.6. Круговая диаграмма

В заключении, еще раз повторим, что все параметры целесообразно иметь настраиваемыми, что позволяет быстро подобрать приемлемый вид графического отображения для демонстрации. Целесообразно также выполнить автономную настройку диаграмм по тестовым значениям (как это сделано в программе LitFregMeter — см. Параграф 2.). Тогда мы сможем быстро подбирать параметры, например так:

Параграф 5. Базовый класс для рисования графиков

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

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

Молчанов Владислав 21.09.2005г. Материал переработан 14.10.2008г.

Как отрисовать 3D графики функции в C# Visual Studio .NET (WIndows Forms)?

Нужно построить график в трехмерном пространстве (с осями x, y, z) в Windows Forms. Ось Z нужна не как «глубина», а как полноценная ось.
Пример:

Копался в Chart, но там только X и Y.

  • Вопрос задан более года назад
  • 2724 просмотра

Как вариант, можно взять 3D-графики, которые дают WPF-контролы и внедрить в WinForms, там есть специальный контрол.

Метеостанция + построение графика + C#

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

Итак, работа заключается в следующем: с известного многим датчика DHT11 (датчик влажности и температуры) принимаем данные через COM порт, далее записываем данные в текстовый файл и по этим данным строим график изменений.

Arduino Uno

Arduino Uno построен на ATmega328. Платформа имеет 14 цифровых вход/выходов, 6 аналоговых входов, кварцевый генератор 16 МГц, разъем USB, силовой разъем, разъем ICSP и кнопку перезагрузки. Для работы необходимо подключить платформу к компьютеру посредством кабеля USB, либо подать питание при помощи адаптера AC/DC или батареи.

Характеристики:

Микроконтроллер ATmega328
Рабочее напряжение 5 В
Входное напряжение (рекомендуемое) 7-12 В
Входное напряжение (предельное) 6-20 В
Цифровые Входы/Выходы 14
Аналоговые входы 6
Постоянный ток через вход/выход 40 мА
Постоянный ток для вывода 3.3 В 50 мА
Флеш-память 32 Кб (ATmega328) из которых 0.5 Кб используются для загрузчика
ОЗУ 2 Кб (ATmega328)
EEPROM 1 Кб (ATmega328)
Тактовая частота 16 МГц

Датчик DHT11

  • разрешение = 16 Bit
  • повторяемость = ±1%
  • точность = если 25℃, то ±5%
  • взаимозаменяемость = полностью взаимозаменяемый
  • время отклика = 1-2 сек
  • гистерезис =

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

Подключение

1 — VCC — питание 3,5 — 5,5 V
2 — DATA — передача данных
3 — NC — не используется
4 — GND — отрицательное питание

Для подключения к arduino необходимо подключить между 1 и 2 ножкой резистор = 10кОм.

Схемы подключения

Схема:

Программный код (скетч для датчика DHT11)

Загружаю данный скетч, на каждую минуту и получаю данные в мониторе COM порта

34 — в % относительная влажность
25 — в ℃ температура

Далее я так сказать украшал свою программу, придавал ей товарный вид. Все это я делал в среде программирования Microsoft Visual Studio 2012 .NET. Я сделал приложение, которое через COM порт получает данные и обрабатывает их. Получаю, записываю в файл. Тоже построчно. В первой строке значение, вторая строка — дата и время в момент получения данных. Это пригодится для построения графиков. Кто не знаком с работой в C# очень рекомендую, удобная вещь. Создаю форму с 2-мя текстбоксами, 1- будет выводится значение влажности, 2 — значение температуры. Из них создается файл, если не был создан, если был создан до дописываем в него. 2 файла — 1-График_температуры, 2-График_влажности. Названия можете придумать свои. Элементы, используемые в программе: textbox и textbox1, openFileDialog — для работы с выбором файла для графика, notifyIcon — для работы с иконкой, для сворачивания в трей.

Вот запуск приложения

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

Далее нажимаем — Открыть, и увидим график

Это график относительной влажности. Есть свойство графика — он масштабируется по оси Х. Если большой интервал, мы мышкой выделяем зону, которая нам интересна и он приближает. Если общий график, то на оси Х около 0 нажмем «-» и график будет общим.

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

1ый значок в трее — программа. По нажатию левой кнопки мыши сворачивается или разворачивается программа.


C# — График функции

Прошу прощения за доставленные неудобства.

Контент будет доступен.

Построение графиков

В этой будет описано как воспользоваться библиотекой для графиков. На данный момент это наиболее простой способ впихнуть в свою программу график. Вы можете воспользоваться моей библиотекой и имортировать ее в проект. Я покажу как ей пользоваться.

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

1) Добавляем новое расширение (рис. 1, рис. 2)

2)Делаем перестроение проекта (ри. 3)

4)Добавляем новый контрол (рис. 4, рис. 5)

5)Настраиваем форму (рис. 6)

Теперь настроим програмную часть формы:

И в конечном итоге вид графика будет имет следующий вид (рис. 7):

Также можно воспользоваться всеми свойствами контролла, их довольно много. Может, напишу какой нибудь мануал по этому поводу. Для начала можете просто поэкспериментировать со всеми свойствами: плохого ничего не сделаете.

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

BestProg

Разработка программы рисования графика функции одной переменной. Функция задана формулой

Приводится пример рисования на канве графика функции одной переменной y = f(x).

Функция задается формулой

Условие задачи

Разработать приложение, в котором строится график функции

График функции должен выводиться в отдельной форме.

Математическая постановка задачи

Для построения любого графика функции y = f(x) нужно задать прямоугольную область экрана, в которой этот график функции будет выводиться.

Прямоугольная область экрана задается координатами крайних точек (рис. 1):

– ( x1 ; y1 ) – левый верхний угол экрана;

– ( x2 ; y2 ) – правый нижний угол экрана.

Рис. 1. Прямоугольная область экрана

При построении графиков функций на экране монитора нужно реализовать масштабирование прямоугольника с координатами ( x1 ; y1 ), ( x2 ; y2 ) в прямоугольник с координатами экрана ( xx1 ; yy1 ), ( xx2 ; yy2 ) как изображено на рисунке 2.

Рис. 2. Масштабирование координат

Масштабирование по осям OX и OY реализуется с помощью линейных зависимостей:

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

Решение

1. Загрузить Borland C++ Builder .

Создать проект как «VCL Form Application». Автоматически создается основная форма приложения с именем Form1.

2. Создание основной формы.

Разместить на форме компоненты таких типов:

  • пять компонент типа TLabel . Создаются объекты с именами Label1 , Label2 , Label3 , Label4 , Label5 ;
  • пять компонент типа TEdit . Создаются объекты с именами Edit1 , Edit2, Edit3, Edit4, Edit5;
  • один компонент типа TButton. Создается объект с именем Button1.

Откорректировать позиции компонент на форме как показано на рисунке 3.

Рис. 3. Размещение компонент на форме Form1

3. Настройка формы.


Чтобы форма Form1 имела корректный вид, в Object Inspector нужно сделать следующее:

  • из вкладки Action установить свойство Caption = « График функции одной переменной » (заголовок формы);
  • из вкладки Visual установить свойство BorderStyle = «bsDialog» (рис. 4). В результате исчезнут кнопки управления формой;
  • из вкладки Miscellaneous установить свойство Position = «poScreenCenter» (рис. 5). Это действие отобразит форму в центре экрана во время выполнения приложения.

Рис. 4. Свойство BorderStyle формы Form1

Рис. 5. Свойство Position

4. Настройка свойств и размеров компонент, размещенных на форме.

Нужно настроить следующие свойства компонентов:

  • в компоненте Label1 свойство Caption = » К-во точек по горизонтали, n = «;
  • в компоненте Label2 свойство Caption = « Левая граница, x1 = «;
  • в компоненте Label3 свойство Caption = » Правая граница, x2 = «;
  • в компоненте Label4 свойство Caption = « Верхняя граница, y1 = «;
  • в компоненте Label5 свойство Caption = « Нижняя граница, y2 = «;
  • в компоненте Button1 свойство Caption = » Вывести график … «.

Также нужно изменить размер и позицию компонента Button1 на форме. Приблизительный вид формы с размещенными компонентами изображен на рисунке 6.

Рис. 6. Общий вид формы Form1

5. Программирование события активизации формы Form1.

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

Пример программирования события в C++ Builder описан здесь.

Листинг обработчика события OnActivate имеет следующий вид:

В обработчике события заполняются значения полей, которые являются координатами прямоугольной области, в которой выводится график. Прямоугольная область задается координатами левого верхнего угла ( x1 ; y1 ) и правого нижнего угла ( x2 ; y2 ).

6. Создание новой формы вывода графика функции.

Создать форму с именем «Form2» по образцу, как показано на рисунке 7. Пример создания новой формы в C++ Builder приведен здесь.

Форма Form2 описывается в файлах « Unit2.h » и « Unit2.cpp «.

Разместить на форме компоненты следующих типов:

– компонент типа TButton (кнопка). Автоматически создается объект с именем Button1;

– компонент типа TImage. Создается объект с именем Image1. В этом компоненте будет выводиться график функции sin(x) .

Рис. 7. Форма Form2 вывода графика функции sin(x)

С помощью Object Inspector осуществить настройку основных свойств компонент:

  • в компоненте Button1 свойство Caption = «OK»;
  • в компоненте Button1 свойство ModalResult = «mrOk». Это означает, что во время клика на кнопке Button1 форма будет закрываться с кодом возвращения mrOk.

С помощью Object Inspector осуществить настройку свойств формы Form2:

– из вкладки Action установить свойство Caption = « График функции sin(x) «;

– из вкладки Visual свойство BorderStyle = «bsDialog». Это означает, что окно формы примет вид диалогового окна;

– из вкладки Miscellaneous свойство Position = «poScreenCenter». В результате форма будет выводиться по центру экрана.

Также нужно откорректировать размеры и позиции компонентов Button1 и Image1.

В результате выполненных действий, форма Form2 будет иметь вид, как изображено на рисунке 8.

Рис. 8. Форма Form2

7. Программирование дополнительных функций масштабирования и вычисления sin(x) .
7.1. Ввод внутренних переменных в модуль формы Form2 .

Нужно ввести следующие внутренние переменные в текст файла « Unit2.h » (рис. 9).

Для этого выполняется следующая последовательность действий.

  1. Перейти в заголовочный файл « Unit2.h » (рис. 9).
  1. В разделе private класса TForm2 ввести четыре переменные:


Эти переменные соответствуют экранным координатам (см. рис. 2 б).

  1. В разделе public класса TForm2 ввести пять переменных:

Эти переменные отвечают фактическим координатам (рис. 2 а) прямоугольной области, в которой выводится график. Переменная n задает количество точек, которые будут соединены линиями. Чем больше значение n , тем более плавно выглядит график на экране.

Значение этих переменных заполняется из основной формы Form1. Поэтому они размещаются в разделе public.

Рис. 9. Вид файла модуля « Unit2.h «

Пока что листинг файла « Unit2.h » следующий:

//———————————————— #ifndef Unit2H #define Unit2H //———————————————— #include #include #include #include

Лабораторная работа №7. Графика

Пространство имен System.Drawing обеспечивает доступ к функциональным возможностям графического интерфейса GDI+ Windows. Класс Graphics предоставляет методы рисования на устройстве отображения.

Рассмотрим пример использования графических возможностей С# для метода DrawLine класса Graphics .

Задача: На форме, в модуле pictureBox посторить треугольник, заданный прямоугольными координатами вершин. Координаты должны быть заданы относительно pictureBox.

Рисование в pictureBox имеет то преимущество, что при сворачивании формы прорисованные объекты сохраняются. Если же рисовать непосредственно в поле формы, то этого не происходит.

Создадим новый проект Windows Form

Поместим на форме два контролла из панели инструментов: кнопку Button1 и окно для рисунка pictureBox1. Начальное положение и размеры этих объектов могут быть произвольными, далее программно мы их «причешем».

Создадим в нашем коде функцию загрузки формы, для этого в конструкторе формы дважды щелкнем мышкой на поле формы – создастся процедура private void Form1_Load(object sender, System.EventArgs e)

Создадим в нашем коде функцию- события одного щелчка по кнопке Button1, для этого в конструкторе формы дважды щелкнем мышкой на этой кнопке – создастся процедура private void button1_Click(object sender, EventArgs e).

Создадим в нашем коде функцию- события рисования pictureBox1, для этого в конструкторе формы правой кнопкой мышки щелкнем на pictureBox1 и выберем «Свойства». В свойства pictureBox1 выберм вкладку «События» и выберм событие Paint, дважды щелкнем мышкой на этом элементе списка – создастся процедура private void pictureBox1_Paint(object sender, System.Windows.Forms.PaintEventArgs e)

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

Ключевой строчкой в коде является:

pictureBox1.Paint += new System.Windows.Forms.PaintEventHandler(this.pictureBox1_Paint);

Она связывает событие рисования на pictureBox1 с процедурой pictureBox1_Paint.

Запускаем проект на выполнение и кликаем по кнопке «Построить».

// Пространство имен для графики, эта строчка вставляется автоматически при создании проекта.

Построение графиков с помощью компоненты Chart

Обычно результаты расчетов представляются в виде графиков и диаграмм. Система Builder имеет мощный пакет стандартных программ вывода на экран и редактирования графической информации, который реализуется с помощью компоненты Chart, находящейся на панеле компонет Additional — .

Построение графика (диаграммы) производится по вычисленным значениям координат точек х и y = f(x), которые с помощью метода AddXY передаются в специальный двухмерный массив Series[k] компоненты Сhart (k = 0,1,2. – номер используемого графика).

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

Установив компоненту Chart1 на форму, для изменения ее параметров двойным щелчком кнопкой мыши вызываем окно редактирования EditingChat1 (рис. 9.1). Для создания Series1 нажимаем кнопку Add на странице Series.

В появившемся после этого окне TeeChart Gallery выбираем пиктограмму с надписью Line (график выводится в виде линий). Если нет необходимости представления графика в трехмерном виде, отключается независимый переключатель 3D. Для изменения названия нажимаем кнопку Title. Название графика вводится на странице Titles.

Данные по оси X автоматически сортируются, поэтому, если необходимо нарисовать, например, окружность, сортировку отключают функцией Order: Chart1->Series[0]->XValues->Order = loNone.

Нажимая различные кнопки меню, познакомьтесь с другими возможностями редактора EditingChat.

Использование класса Сanvas

Для рисования используется класс типа TСanvas, который является не самостоятельной компонентой, а свойством многих компонент, таких как Image, PaintBox, и представляет собой холст (контекст GDI в Windows) с набором инструментов для рисования. Каждая точка холста имеет свои координаты. Начало осей координат располагается в верхнем левом углу холста. Данные по оси Х увеличиваются слева направо, а по оси Y сверху вниз.

Компонента Image находится на странице Additional, а PaintBoxSystem.

Основные свойства класса Canvas:

Pen – перо (определяет параметры линий),

Brush – кисть (определяет фон и заполнение замкнутых фигур),

Font – шрифт (определяет параметры шрифта).

Некоторые методы класса Canvas:


Ellipse(х1,у1, х2,у2) – чертит эллипс в охватывающем прямоугольнике (х1, у1), (х2, у2) и заполняет внутреннее пространство эллипса текущей кистью;

MoveTo(х,y) – перемещает карандаш в положение (х,y);

LineTo(х,y) – чертит линию от текущего положения пера до точки (х,y);

Rectangle(х1,у1, х2,у2) – вычерчивает и заполняет прямоугольник (х1,у1), (х2, у2). Для вычерчивания без заполнения используйте FrameRect или Polyline;

Polygon(const TPoint* Points, const int Points_Size) – вычерчивает многоугольник по точкам, заданным в массиве Роints размера Points_Size. Конечная точка соединяется с начальной и многоугольник заполняется текущей кистью. Для вычерчивания без заполнения используется метод Polyline.

TextOut(х, у, const AnsiString Text)– выводит строку Техt так, чтобы левый верхний угол прямоугольника, охватывающего текст, располагался в точке (х, у).

Пример создания оконного приложения

Написать программу отображения графика выбранной функции с помощью компонент Сhart и Image.

Настройка формы

Панель диалога программы с получеными результатами представлена на рис. 9.2.

Текст программы, реализующий поставленную задачу, может иметь следующий вид:

typedef double (*Tfun)(double);

void __fastcall TForm1::FormCreate(TObject *Sender)

void __fastcall TForm1::Button1Click(TObject *Sender)

case 0: f = fun0; break;

case 1: f = fun1; break;

case 2: f = fun2; break;

y_min = y_max = f(a);

if(y_max Series[0]->Clear(); // Очистка графика

for(double x=a; x Series[0]->AddXY(x,f(x));

void __fastcall TForm1::Button3Click(TObject *Sender)

void __fastcall TForm1::Button4Click(TObject *Sender)

int xmax, ymax, xt, yt, y0, x0;

Image1->Canvas->Pen->Color=clBlack; // Установка цвета пера

// Поиск координат правого нижнего угла холста Image

// Закрашивание холста Image текущей белой кистью

// Поиск середины холста

// Вычерчивание координатных линий

Image1->Canvas->Pen->Color=clRed; // Установка цвета пера

// Поиск шагов по х и у с масштабированием

for(x=a; x Canvas->LineTo(ceil(x0+x/hx),ceil(y0-f(x)/hy));

C# — График функции

Используем возможности языка C# для разработки программы рисования графиков функций.

Откроем среду программирования C#, выбирая последовательно Пуск -> Все программы -> Microsoft Visual C# 2008 Express Edition.

На начальной странице (Start Page) выберем пункт Create: Project. В результате появится диалоговое окно выбора типа создаваемого проекта.

В качестве типа создаваемого проекта выберем Windows Application, в поле Name: зададим имя проекта (например, DrawFunction) и нажмем кнопку OK.

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

Щелчком мыши на форме Form1, выберем ее и в окне свойств (Properties) изменим свойство Text, заменив Form1 на «График функции». Изменим также имя формы, по которому к ней можно обращаться из программы, заменив в свойстве (Name) Form1 на frmMain. Необходимо сразу отметить и запомнить, что это два совершенно разных свойства, используемых для различных целей, и никогда их не путать.

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

Для формирования графического интерфейса приложения наведем мышку на иконку Toolbox, расположенную слева и сверху от формы, и в появившемся окне элементов графического интерфейса выберем PictureBox, и перенесем его на форму. Для этого нужно щелкнуть левой кнопкой мыши в том месте формы, где должен находиться левый верхний угол элемента и, не отпуская кнопку, перетащить мышь в то место, где должен находиться правый нижний угол элемента, и там отпустить кнопку.

Для появившегоя элемента PictureBox изменим его свойство (Name) с pictureBox1 на graphWind. Кроме того, рекомендуется изменить свойство BorderStyle с None на Fixed3D, а также свойство BackColor на белый (White).

Аналогичным образом разместим на форме кнопку Button, выбрав ее с панели элементов управления Toolbox. Получившаяся форма должна иметь примерно следующий вид.

Основная работа приложения — рисование графика функции, будет выполняться при щелчке на кнопке «Нарисовать график». Чтобы вставить код обработчика соответствующего события, нужно дважды щелкнуть на кнопке и в результате откроется окно кода с требуемым заголовком нужной процедуры.

Вставьте в этот обработчик следующий код.

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

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

Цукерберг рекомендует:  Панель обложок на jQuery UI
Понравилась статья? Поделиться с друзьями:
Все языки программирования для начинающих