Волченков Проектирование WИНДОWС-приложениы на языке ВИСУАЛ БАСИЦ 2015

списке. Сектора надо рассматривать, двигаясь по часовой стрелке, начиная от оси, направленной вправо.

Этап проектирования интерфейса для данного приложения рассматривать не будем, так как он не содержит новых для студентов идей и понятий. Рассмотрим лишь фрагмент кода модуля формы (код 3.1) с одной процедурой – построения круговой диаграммы:

Код 3.1

Public Class Form1

Dim	w, h, Dw, Dh As Integer
Dim	i, n As Short
Dim	a, s, f1, f2, dx, dy As Single
Dim	c As Color
Dim	pen As New Pen(Color.Brown, 1)
Private	Sub Диаграмма_Click(ByVal _
	sender As Object, _
	ByVal e As System.EventArgs) _
	Handles Диаграмма.Click
	Dim gr As Graphics = PictureBox1.CreateGraphics
	w = PictureBox1.Width : h = PictureBox1.Height
	dx = w / 10 : dy = h / 10
	Dw = w - 2 * dx : Dh = h - 2 * dy
	n = ListBox1.Items.Count
	s = 0
	For i = 0 To n - 1
	a = CSng(ListBox1.Items.Item(i))
	s = s + a
	Next
	gr.Clear(PictureBox1.BackColor)
	f1 = 0 : f2 = 0
	For i = 0 To n - 1
	a = CSng(ListBox1.Items.Item(i))
	f1 = f1 + f2
	f2 = 360 * (a / s)
	c = Color.FromArgb(255, _
	150 + 100 * Rnd(), 150 + 100 * Rnd(), _
	150 + 100 * Rnd())
	Dim br As New SolidBrush(C)
	gr.FillPie(br, dx, dy, Dw, Dh, f1, f2)
	gr.DrawPie(pen, dx, dy, Dw, Dh, f1, f2)
	Next
End	Sub

End Class

31

В рассмотренной процедуре сначала объявлена переменная gr как объект (экземпляр) класса Graphics, позволяющий применять графические методы к графическому окну PictureBox1.

Переменные Dw и Dh – это горизонтальный и вертикальный диаметры эллипса.

Переменные dx и dy – это «поля» на графическом окне, чтобы эллипс не касался краёв окна.

Переменная s – это сумма чисел в списке длиной n.

Переменные f1 и f2 – углы, измеряемые в градусах – параметры методов FillPie и DrawPie – рисования сектора.

Цвет сектора – это «случайный» цвет (переменная c) для кисти (переменная br), которая определяется в цикле для каждого сектора. Чтобы цвет был не слишком тёмным, каждая из трёх составляющих цвета получает значение 150 + 100 * Rnd().

Следующий шаг проектирования данного приложения – это

реализация печати округленных значений	ai	100%	на секторах
	ai

диаграммы.

Рис. 3.2. Окно приложения с напечатанными значениями на секторах

Указанные значения печатаются на секторах с помощью графического метода DrawString путем добавления в процедуру (в тело цикла For … Next) вызова данного метода:

32

gr.DrawString(Round(a / s * 100)								& "%", Font, brs, _
(w	/	2	-	15) + 0.35 * Dw *				_
				Cos(3.14 *		(f1	+	f2	/	2)	/ 180), _
(h	/	2	-	5) + 0.35	*	Dh * _
				Sin(3.14	*	(f1	+	f2	/	2)	/ 180))

Числа 5, 15 и 0.35 в значениях параметров метода DrawString подобраны эмпирически – для установки нужных мест печати. Напомним (см. работу № 2), что для успешной работы математических функций перед объявлением класса данной формы необходимо вставить строку Imports System.Math.

Необходимо также определить особую кисть для печати – вставить в начало программы строку:

Dim brs As New SolidBrush(Color.Black).

Рассмотрим теперь вопрос о редактировании списка чисел – добавлении в меню ещё одной команды: Редактировать список. Создадим для этой команды подменю с 4 командами: Добавить,

Вставить, Удалить и Изменить (рис. 3.3).

Рис. 3.3. Добавление в приложение команд меню Редактировать список с подменю

Рассмотрим две из четырёх процедур для команд этого

подменю:

Код 3.2

Private Sub Добавить_Click(ByVal sender As _ System.Object, ByVal e As System.EventArgs) _ Handles Добавить.Click

33

ListBox1.Items.Add(InputBox("Введите значение"), _

"Ввод нового элемента")

End Sub

Private Sub Удалить_Click(ByVal sender As _ System.Object, ByVal e As System.EventArgs) _ Handles Удалить.Click

i = ListBox1.SelectedIndex If i < 0 Then

MsgBox("Выделите удаляемый элемент!", _

MsgBoxStyle.Critical)

Else

ListBox1.Items.RemoveAt(i) End If

End Sub

Можно модернизировать выполненный проект, изменив параметры методов FillPie и DrawPie так, чтобы сектора немного сместились от центра эллипса

(рис. 3.4).

Рис. 3.4. Круговая диаграмма со смещёнными центрами секторов

Для указанной модернизации следует ввести две переменные: px и py – горизонтальное и вертикальное смещение:

q = 0.025 'коэффициент "разбегания" (смещения) px = q * Dw * Cos(3.14 * (f1 + f2 / 2) / 180) py = q * Dh * Sin(3.14 * (f1 + f2 / 2) / 180)

Значения 2-го и 3-го параметров указанных методов FillPie и DrawPie надо изменить на значения этих переменных:

gr.FillPie(br, dx + px, dy + py, Dw, Dh, f1, f2) gr.DrawPie(pen, dx + px, dy + py, Dw, Dh, f1, f2)

34

Задание 3.2. Добавить в меню на экранной форме проекта приложения 1-го задания команду Редактирование списка, содер-

жащую команды подменю Добавить, Удалить, Вставить и Из-

менить в соответствии с вариантами задания.

Вариант 1. Написать и отладить процедуру для команды подменю Вставить – включения нового элемента в список – перед выделенным элементом.

Указание. Вместо метода Add, рассмотренного в коде 3.2, следует использовать метод Insert, в котором не один, а два аргумента:

ListBox1.Items.Insert(i, InputBox("Введите значение", _ "Ввод нового элемента", _ ListBox1.Items.Item(i)))

(3-й аргумент функции InputBox – значение «по умолчанию».)

Как и в процедуре для команды Удалить (код 3.2), необходимо предусмотреть случай, когда пользователь не выделил элемент, перед которым вставляется новое значение.

Вариант 2. Написать и отладить процедуру для команды меню Изменить – замены старого значения выделенного элемента новым значением.

Указание. Использовать последовательное применение двух методов: Insert (см. указание к варианту 1) и RemoveAt (см. код 3.2):

ListBox1.Items.Insert(i, InputBox("Введите значение", _

"Ввод исправленного элемента", _

ListBox1.Items.Item(i))) ListBox1.Items.RemoveAt(i + 1)

Как и в процедуре для команды Удалить (код 3.2) необходимо предусмотреть случай, когда пользователь не выделил элемент, значение которого надо изменить.

Задание 3.3. Реализовать построение линейной и прямоугольной диаграмм в соответствии с вариантами задания.

35

Вариант 1. Создать проект приложения «Линейная диаграмма» (рис. 3.5), в котором применяются графические методы DrawLine и DrawRectangle.

Вариант 2. Создать проект приложения «Прямоугольная диаграмма» (рис. 3.6), в котором применяются графические методы

FillRectangle и DrawRectangle.

Рис. 3.5. Форма приложения «Линейная диаграмма»

Рис. 3.6. Форма приложения «Прямоугольная диаграмма»

Указание. Для более естественного представления диаграмм целесообразно перенести начало координат вниз и перевернуть направленную вниз ось ординат:

36

dx = w / (n + 2) dy = 0.1 * h

gr.ScaleTransform(1, -1) gr.TranslateTransform(dx, -h + dy)

Кроме того здесь проведено масштабирование:

длина оси абсцисс составляет теперь (n + 2) условных еди-

ниц.

длина оси ординат устанавливается в зависимости от значения переменной max – максимального числа в списке чисел, которое надо найти перед циклическим рисованием отрезков (линейная

диаграмма) или прямоугольников (прямоугольная диаграмма). На каждом шаге этого циклического процесса:

1) изображение очередного отрезка (в случае линейной диаграммы) строится следующим образом:

x2 = (0.5 + i) * dx

y2 = CSng(ListBox1.Items.Item(i))

y2 = y2 * (0.8 * h / max) gr.DrawLine(pen, x1, y1, x2, y2) gr.DrawLine(pens.Black, x2, 0, x2, y2) x1 = x2 : y1 = y2

2) изображение очередного прямоугольника (в случае прямоугольной диаграммы) строится следующим образом:

x1 = i * dx : y1 = 0

dy = CSng(ListBox1.Items.Item(i)) dy = dy * (0.8 * h / max) gr.FillRectangle(br, x1, y1, dx, dy)

gr.DrawRectangle(pen, x1, y1, dx, dy)

Как и для круговой диаграммы (код 3.1) кисть br надо определять на каждом шаге цикла, чтобы закрашивать прямоугольники разными случайными цветами:

c = Color.FromArgb(255, _

150 + 100 * Rnd(), 150 + 100 * Rnd(), _ 150 + 100 * Rnd())

Dim br As New SolidBrush(c)

Для большей выразительности можно сделать прямоугольное обрамление – как у линейной, так и у прямоугольной диаграммы:

37

gr.DrawRectangle(pen, 0, 0, _

w - 2 * dx, h - 2 * dy + 5)

Дополнение к заданию 3.3. Реализовать печать значений:

ai	100%	на диаграммах в соответствии с вариантом.
ai

Изображения диаграмм с напечатанными на них указанными значениями показаны на рис. 3.7.

а

б

Рис. 3.7. Печать значений в окне изображения приложения: «Линейная диаграмма» (а) и «Прямоугольная диаграмма» (б)

38

Фрагмент кода для варианта 1:

gr.ScaleTransform(1, -1) For i = 0 To n - 1

a = CSng(ListBox1.Items.Item(i)) a = Round(100 * a / s)

gr.DrawString(a & "%", Font, brs, _

dx * (0.5 + i) - 10, 2)

Next

Фрагмент кода для варианта 2:

gr.ScaleTransform(1, -1) For i = 0 To n - 1

a = CSng(ListBox1.Items.Item(i)) a = Round(100 * a / s)

gr.DrawString(a & "%", Font, brs, dx * i, 0)

Next

Отметим, что в данных фрагментах вертикальная ось, перевернутая для построения линейной или прямоугольной диаграммы в

традиционной системе координат, опять переворачивается с помо-

щью строки: gr.ScaleTransform(1, -1).

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

Отчет о работе

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

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

39

Работа 4

Исследование графических объектов и методов

2D-графики языка Visual Basic .NET (2005, 2010)

на примере проектирования приложений «Построение графиков функций» и «Построение сложных фигур»

Цель работы: изучение возможностей реализации двумерной (2D) графики с помощью графических объектов и методов языка VB .NET (2005, 2010) на примере проектирования двух приложений «Построение графиков функций» и «Построение сложных фигур».

В ходе проведения работы исследуется полезный класс графи-

ческих объектов – Drawing2D из пространства имён System.Drawing, входящего в состав .NET Framework – ядра системы Visual Studio .NET (2005, 2010).

Подготовка к работе

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

1.Что представляют собой графические объекты-структуры Point (точка), Rectangle (прямоугольник), Size (размер)? К какому пространству имён они принадлежат? Приведите примеры графических методов, в которых они используются.

2.Как с помощью метода Inflate можно изменять размеры изображаемых прямоугольников и эллипсов?

3.Для каких графических методов необходим объект Brush (графическая кисть)? Как определить новую кисть?

4.Какие графические объекты используются в качестве двух аргументов графического метода DrawString?

5.Как с помощью графического метода DrawString можно напечатать на некотором объекте ряд чисел? Как напечатать эти числа разными цветами и/или разными шрифтами?

40