Приклад 8.1

Завдання: створити користувацьку систему координат на поверхні форми з початком відліку в лівому нижньому куті графічного поля. При цьому вісь Х має бути спрямована вправо, а вісь Y – угору. Ширина графічного поля дорівнює 400 мм, а висота 300 мм (рис. 8.2).

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

ScaleMode = vbMillimeters ' опис одиниць вимірювання графічного поля

Form1.Scale (0, 300) – (400, 0)

Тут (0, 300) – координати точки 1, (400, 0) – координати точки 2.

Для очищення поверхні графічного об'єкта (форми або об'єкта PictureBox) використовується метод Сls. Наприклад, у програмному коді для очищення форми слід увести вираз Form1.CLS

8.3. Позиціонування точки на графічній поверхні

 

У процесі малювання будь-якого зображення обов’язково існує остання точка. Ця точка називається поточною, а її координати можуть бути використані для наступної операції малювання (тоді цю дію буде виконано в так званих відносних координатах).

Наприклад, проводячі лінію в абсолютних координатах (у яких за початок відліку береться лівий верхній кут) необхідно указувати координати її початкової і кінцевої точок. Якщо ж використовувати відносні координати, де початком відліку служитиме поточна точка, то потрібно буде задати тільки параметри кінцевої точки цієї лінії.

Рис. 8.2. Користувацька система координат на поверхні форми з початком відліку в лівому нижньому кутку графічного поля

Координати поточної точки форми або елемента можна встановити (або отримати), скориставшись властивостями Currentx і Currenty. Наприклад, подані нижче команди встановлять координати (50, 100) для поточної точки форми.

Forml.CurrentX = 50

Forml.CurrentY =100

Встановити координати для поточної точки можна також накресливши точку-примітив на поверхні форми: Pset (X, Y), де X, Y – координати зображеної точки. Щоб точка-примітив не відображалась на екрані, необхідно їй присвоїти колір поверхні графічної області.

 

8.4. Графічні примітиви

 

Будь-яка картинка, креслення, схема є сукупністю графічних примітивів: точок, ліній, кіл, дуг, тексту та ін.

Викреслювання (виведення) графічних примітивів на графічній поверхні виконують за допомогою відповідних методів (табл. 8.2).

Таблиця 8.2

Методи викреслювання (виведення) графічних примітивів

Метод	Дія
PSet	Зображує точку
Line	Залежно від значення параметрів креслить лінію, прямокутник або контур прямокутника
Circle	Залежно від значення параметрів креслить коло, еліпс, дугу, круг або сектор
Print	Виводить текст

 

8.4.1. Зображення точки

 

Точку на графічній поверхні зображують за допомогою методу PSet. Інструкцію виклику методу PSet у загальному вигляді можна записати таким чином:

Об'єкт.Pset Step(х, у), Color

Параметр Об'єкт задає об'єкт, на поверхні якого треба зобразити точку. Якщо її проставляють на поверхні поточної форми, то цей параметр можна не використовувати.

Параметри х і у задають координати точки на графічній поверхні, колір якої треба змінити.

Параметр Color задає колір точки. У ролі цього параметра можна використовувати одну з пойменованих констант (див. табл. 8.3), а також значення функції Rgb, яка повертає код кольору, заданий червоною, зеленою і синьою складовими (як відомо, будь-який колір можна отримати шляхом змішування в різних пропорціях червоної, зеленої та синьої фарб). У функції Rgb три параметри: перший задає частку червоної (red), другий – зеленої (green) третій – синьої (blue) складових. Значення кожного з параметрів має перебувати в діапазоні від 0 до 255. Наприклад, значенням функції Rgb (205, 127, 50) є код " золотого" кольору. Параметр Color не є обов'язковим. Якщо його не названо, то колір зафарбовування точки залежить від значення властивості Forecolor графічної поверхні, для якої застосовано метод.

Таблиця. 8.3

Константи, які використовуються при завданні кольору

Константа	Колір
vbBlack	Чорний
vbRed	Червоний
vbGreen	Зелений
vbYellow	Жовтий
vbBlue	Синій
vbMagenta	Пурпурний
vbCyan	Бірюзовий
vbWhite	Білий

Ключове слово Step можна не зазаначати. У цьому випадку параметри x і у задають абсолютні координати точки. Якщо слово Step вживається, то координати точки роблять свій відлік від поточного положення покажчика графічного виведення.

Розмір (діаметр) точки, яку зображують з використанням методу Pset, залежить від поточного значення властивості Drawwidth поверхні.

 

8.4.2. Проведення лінії

 

Викреслювання прямої лінії відбувається за допомогою методу Line.

Інструкція виклику методу Line, що забезпечує викреслювання лінії, в загальному вигляді записується таким чином:

Об'єкт.Line Step(x1, y1) – Step(x2, y2), Color

Параметр Об'єкт задає об'єкт, на поверхні якого треба провести лінію. Якщо це відбувається на поверхні форми, то цей параметр можна не використовувати.

Параметри x1 і y1 задають координати початкової точки лінії, а параметри х2 і у2 – координати точки кінця.

Параметр Сolor задає колір лінії. У ролі цього параметра можна використовувати одну з пойменованих констант (див. табл. 8.3) або значення функції Rgb. Параметр Color не вважається обов'язковим. Якщо його не вжито, то колір лінії залежить від значення властивості Forecolor графічної поверхні, на якій використано метод Line.

При цьому ключове слово Step можна не вживати. Тоді параметри x1, y1 і х2, у2 задають абсолютні координати кінця лінії. Якщо слово Step вжито перед параметрами x1, y2, координати початкової точки лінії відліковуються від покажчика графічного виведення. Коли ж слово Step вжито перед параметрами х2, у2, то координати кінцевої точки лінії починають свій відлік від її початку.

Товщину і вид (стиль) лінії визначають відповідно до властивостей DrawWidth і DrawStyle графічної поверхні, на якій використовують метод Line. У табл. 8.4 перелічено константи, використовуючи які, можна задати вид лінії. Слід звернути увагу: лінія, товщина якої більш ніж 1 піксел, може бути тільки суцільною, бо провести її пунктирною неможливо.

Таблиця 8.4

Константи, для використовуються для завдання графічної поверхні лінії

Константа	Вид (стиль) лінії
VbSoli	Суцільна
VbDash	Штрихова (довгі штрихи)
VbDot	Пунктирна (короткі штрихи)
VbDashdot	Штрих-пунктирна
VbDashDotDot	Штрих, два пунктири

 

8.4.3. Креслення прямокутника

 

Метод Line дозволяє зобразити не тільки лінію, але й прямокутник (див. рис. 8.3).

Рис. 8.3. Використання методу Lineдля креслення прямокутника

Інструкцію виклику методу Line, що забезпечує зображення прямокутника, в загальному вигляді записуємо таким чином:

Об'єкт.Line Step(x1, y1) – Step(х2, у2), Color, В

Параметр Об'єкт задає об'єкт, на поверхні якого треба накреслити прямокутник. Якщо це відбувається на поверхні поточної форми, то параметром Об'єкт можна не користуватись.

Параметри x1 і y1 задають координати лівого верхнього (нижнього) кута прямокутника, а параметри х2, у2 – координати правого нижнього (верхнього) кута.

Параметр В вказує на те, що за допомогою методу Line потрібно накреслити прямокутник, його колір задає параметр Сolor. У ролі цього параметра можна використовувати одну з пойменованих констант (див. табл. 8.3) або значення функції Rgb. Параметр Сolor вважаеється обов'язковим. Якщо його не використано, то колір залежить від значення властивості ForeColor графічної поверхні, на якій застосовано метод.

Товщину і вид (стиль) лінії прямокутника визначають відповідно до властивостей DrawWidth і DrawStyle графічної поверхні, на якій використано метод Line. У ролі властивості DrawStyle можна використовувати одну з наведених у табл. 8.4 констант. Якщо товщина лінії, яка обмежує прямокутник більш ніж 1 піксель, то розмір прямокутника (по зовнішній межі) буде більшим від розміру поля, заданого параметрами x1, y1 і х2, у2. Щоб розмір прямокутника (по зовнішній межі) дорівнював розміру графічного поля (у тому випадку, коли ширина межі перевищує 1 піксель), то властивості DrawStyle треба присвоїти значення vbInsideSoiid. Тоді лінія межі буде накреслена так, що її зовнішній край буде розташований точно в межах графічного поля, заданого точками (x1, y1) і (х2, у2).

Колір і стиль зафарбовування внутрішнього поля прямокутника визначають відповідно до властивостей FillColor і FilStyle тієї графічної поверхні, на якій застосовано метод. За умовчуванням значення властивості FillStyle відповідає vbSFTransparent, тому метод застосовується тільки для зображення меж прямокутника. Щоб внутрішнє поле прямокутника було зафарбовано, задане властивістю FillColor значення властивості FillStyle має відповідати vbFSSoiid (суцільне тонування). Внутрішнє поле прямокутника також може бути заштриховане. Константи, за допомогою яких можна задати стиль зафарбовування, наведені в табл. 8.5.

Ключове слово Step можна не вживати. В цьому випадку параметри x1, y1 і х2, у2 задають абсолютні координати кутів прямокутника.

Якщо слово Step вживається перед параметрами x1, y1, то координати лівого верхнього (нижнего) кута прямокутника починають відлік від поточного положення покажчика графічного виведення.

Якщо слово Step зазначається перед параметрами х2, у2, то координати правого нижнього (верхнього) кута прямокутника починають відлік від іншого діагонального кута, тобто фактично ці параметри задають розмір прямокутника (х2 – ширина, у2 – висота).

Якщо замість параметра В вжито параметр BF, то метод передбачає зображення зафарбованого прямокутника, колір межової лінії та колір зафарбовування якого збігатимуться. Колір прямокутника в цьому випадку визначить параметр Сolor або (якщо його не використовують) властивість ForeColor. Слід звернути увагу, що після того як за допомогою методу Line буде намальовано прямокутник, покажчик графічного виведення перебуватиме в точці (х2, у2).

Таблиця 8.5

Стилі зафарбовування внутрішнього поля прямокутника

Константа	Спосіб (стиль) зафарбовування
vbFSTranspparent	Внутрішнє поле прямокутника не фарбується
vbFSSolid	Звичайне (суцільне) зафарбовування
vbHorisontalLine	Горизонтальне штрихування
vbVerticalLine	Вертикальне штрихування
vbUpwardDiagonal	Діагональне штрихування (нахил ліній уліво)
vbDownwardDiagonal	Діагональне штрихування (нахил ліній управо)
vbCross	Клітинка
vbDiagonalCross	Діагональна клітинка

 

8.4.4. Зображення кола й круга

 

Метод Circle залежно від значення параметрів дозволяє креслити коло, еліпс, дугу або сектор. Інструкцію виклику методу Circle, що забезпечує зображення кола або круга в загальному вигляді можна записати таким чином:

Об'єкт.Circle Step(x, y), r, Color

Параметр Об'єкт задає об'єкт, на поверхні якого треба накреслити коло. Коли це відбувається на поверхні форми, то цим параметром можна не користуватись.

Параметри x1 і y1 задають координати центра кола (круга). Якщо вжито слово Step, то положення центра починає відлік від поточного положення покажчика графічного виведення.

Параметр r задає значення радіуса кола (круга).

Параметр Сolor визначає колір кола або межової лінії. У ролі цього параметра можна використовувати одну з пойменованих констант (див. табл. 8.3) або значення функції Rgb. Параметр Сolor не вважається обов'язковим. Якщо цей параметр не використано, то колір кола або межової лінії залежить від значення властивості ForeColor графічної поверхні, на якій застосовано метод.

Товщину і вид (стиль) лінії кола або межової лінії визначають відповідно до властивостей DrawWidth і DrawStyle графічної поверхні, на якій використано метод.

Колір і стиль зафарбовування внутрішнього поля кола визначають відповідно до властивостей FillColor і FillStyle тієї графічної поверхні, на якій застосовано метод. Щоб внутрішню область кола було зафарбовано, значення властивості FillStyle має відрізнятись від значення vbFSTransparent.

 

8.4.5. Креслення дуги й сектора

 

Інструкцію виклику методу Circle, що забезпечує зображення дуги або сектора в загальному вигляді, можна записати таким чином:

Об'єкт.Circle Step(x, y), r, Color, start, fin

За допомогою параметрів x, у, r і Color визначають відповідно координату центра кола, з якого вирізана дуга (сектор), радіус кола і колір лінії дуги (межі сектора). Товщину і стиль лінії дуги або межі сектора, а також колір і стиль тонування внутрішнього поля сектора визначають відповідно, використовуючи параметри DrawWidth, DrawStyle, FillColor і FillStyle графічної поверхні, на якій застосовується метод Circle.

Параметр Start задає початкову точку дуги, яка лежить на перетині лінії кола і прямої, проведеної з центра кола під кутом Start до осі X.

Параметр fin задає кінцеву точку дуги (див. рис. 8.4). Кутові координати вимірюються в радіанах і зростають у напрямку проти годинникової стрілки. Дуга викреслюється від початкової точки до кінцевої також проти годинникової стрілки. Слід звернути увагу на те, що метод Сircle застосовується для викреслювання дуг, коли значення параметрів start і fin додатні, а якщо перед параметрами поставлено знак мінус, то викреслюється зображення сектора (рис. 8.5). Щоб зобразити сектор з точки, яка відповідає куту 0 градусів, замість нуля, треба записати: 2*3.14.

Рис. 8.4. Використання параметрів start і fin для креслення дуги

 

Рис. 8.5. Зображення сектора за допомогою методу Circle

 

8.4.6. Зображення еліпса

 

Метод Сircle дозволяє також зображувати також еліпс, еліптичну дугу або еліптичний сектор. Інструкцію виклику методу Сircle, який забезпечує викреслювання еліпса, в загальному вигляді можна записати таким чином:

Об'єкт.Circle Step(х, у), r, Color, start, fin, aspect

Уводячи параметри x і у визначають координату центра еліпса, параметр Сolor – встановлює колір межової лінії еліпса. Товщину і стиль лінії еліпса, дуги або сектора, а також колір і стиль тонування внутрішнього поля еліпса (сектора) визначають відповідно, користуючись параметрами DrawWidth, DrawStyle, FillColor і FillStyle графічної поверхні, на якій застосовано метод Сircle.

Користуючись параметрами start і fin, задають точки початку і кінця еліптичної дуги. При цьому параметр r відповідає більшому радіус еліпса, а параметр aspect – коефіцієнту стискування (трансформації) радіуса. Якщо значення параметра aspect менше від одиниці, то еліпс будується шляхом стискування кола по вертикалі, а якщо більше, то по горизонталі (рис. 8.6). У разі якщо значення параметра aspect дорівнює одиниці, то результатом побудови буде коло.

Рис. 8.6. Креслення еліпса за допомогою методу Circle

8.4.7. Відображення тексту

 

Виведення тексту на графічну поверхню відбувається методом Print. Інструкцію виклику методу в загальному вигляді можна записати таким чином:

Об'єкт.Print Рядок

Параметр Рядок задає розмір рядка, який треба вивести. Позиція, в якій з'явиться рядок, залежить від поточного положення покажчика графічного виведення.

Перш ніж викликати метод Print, треба встановити покажчик графічного виведення (присвоїти значення властивостям СurrentХ і СurrentY) в ту точку форми, де має бути лівий верхній кут текстового поля. Наприклад:

Private Sub Form_Click()

Scale (0, 0) – (100, 100) 'завдання розмірів графічного поля і напрямку

‘координатних осей

' Координати початку тексту

CURRENTX = 10 ' координата

CURRENTY = 10

Print " Національний гірничий університет"

End Sub

Результат виконання цих інструкцій бачимо на рис. 8.7.

CurrentX

 

 

CurrentY

Положення покажчика поля виведення рядка

Рис. 8.7. Виведення тексту методом Print

 

 

Після виведення рядка покажчик автоматично переміщається в точку (0, Y). При цьому значення координати Y залежить від висоти текстового поля, яка, у свою чергу, залежить від характеристики (розміром) шрифту, що при цьому використовується для виведення тексту.

Характеристику шрифту, який застосовується в методі Print для відображення тексту, впливає на властивість Font графічної поверхні, колір символів, тобто ForeColor.

Якщо в ролі параметра методу Print увести змінну або вираз, тип якого відрізняється від параметра String, то відбудується автоматичне перетворення значення в рядок. Наприклад, у програмі оголошено змінну Today типу Date. Далі виконуємо такі інструкції:

Today = Now ' значення функції Now – поточна дата і час

Currentx =10

CURRENTY =10

Print Today

Це означає, що у форму буде введено поточну дату і час.

Найбільш часто використовувані формати рядків розглянуто в табл. 8.6

Таблиця 8.6

Формати відображення даних

Формат	Опис	Приклад використання
#.##	Дробове число з двома знаками після коми (десяткового роздільника). Якщо дробова частина числа дорівнює нулю, то її знаки не відображаються	Format(x, " #.##")
#0.00	Дробове число з двома знаками після коми (десяткового роздільника). Виконується округлення	Format(x, " #0.00")
### ### ##0.00	Дробове число з двома знаками після десяткового роздільника. Цифри цілої частини об'єднані в групи по три і розділені пропусками. Виконується округлення. Використовується для відображення грошових сум (у цьому випадку в кінці рядка зазвичай додають позначення грошової одиниці)	Format(summ " ### ### ##0.00" грн.")
#0.00%	Відсоток. Значення автоматично множиться на 10 і в кінці рядка додається символ відсотка	Format(discount, " #0.00%")
dd/mm/yy	Дата у форматі день, місяць, рік. Символ-роздільник визначає операційна система	Format(Now, " Сьогодні dd/mm/yy")
ddd	День тижня	Format(Now, " Сьогодні dd/mm/dddd")
mmmm	Назва місяця в повному форматі	Format(Now, " Сьогодні dd mmmm, dddd")

Для перетворення значення виразу в рядок потрібного формату доцільно використати функцію Format. Вона має два параметри: вираз, значення якого треба перетворити в рядок, і рядок форматування. Наприклад, значення Format(С, " ### ### ##0.00 грн.") являє собою подання змінної С, у вигляді рядка в якому цифри, об'єднано в групи по три, розділено пропусками, а після десяткового роздільника завжди відображаються дві цифри (навіть якщо дробова частина числа дорівнює нулю), при цьому в кінеці рядка додається позначення грошової одиниці.

Слід звернути увагу на те, що форматування наведеного рядка забезпечує автоматичне округлення числа за відомими правилами. Наприклад, якщо значення змінної С дорівнює 28580, 446, то значенням функції Format буде такий рядок: 28580, 45.

Для того, щоб повернутися до поточної дати і часу потрібно використати функцію now.

 

8.5. Виконання ілюстрацій

 

Компоненти РictureBox та Image забезпечують відображення ілюстрацій у таких форматах: BMP, GIF, JPG, JPEG, PNG, а також метафайлів (WMF, EMF) і значків (ICO). Компонент РictureBox має ширші, порівняно з компонентом Image, можливості (зокрема, на його поверхні можна створювати зображення). Разом з тим компонент РictureВox не дозволяє відображати ілюстрацію, розмір якої його перевищує (для виконання великих ілюстрацій слід використовувати компонент Image, який має здатність до масштабування). Основні властивості компонента PictureBox описано в табл. 8.7.

Таблиця 8.7

Властивості компонента PictureBox

Властивість	Опис
Picture	Ілюстрація, що відображається в полі компонента
AutoSize	Ознака автоматичної зміни розміру компонента відповідно до розміру ілюстрації. Якщо значення рівне True, то розмір компонента відповідає розміру ілюстрації
Visible	Ознака відображення компонента на поверхні форми. Дозволяє приховати компонент (False) або зробити його видимим (True)
Appearance	Стиль компонента. Поле компоненту може перебувати над поверхнею форми (у цьому випадку значення властивості дорівнює 3D), або розміщуватись на одному рівні з поверхнею форми (у цьому випадку властивість набуває значення Flat)
BorderStyle	Тип межі компонент. Межа може бути тонкою (FixedSingle) або повністю відсутньою (None)
ScaleMode	Одиниця вимірювання розмірів компонента і об'єктів на ньому
ScaleWidth	Ширина робочого поля компонента (без урахування ширини його лівої і правої меж)
ScaleHeight	Висота робочого поля компонента (без урахування ширини його нижньої і верхньої меж)
Left	Відстань від лівої межі компонента до лівої межі форми
Закінчення табл. 8.7
Тор	Відстань від верхньої межі компонента до верхньої межі форми
Width	Ширина компонента з урахуванням ширини межі
Height	Висота компонента з урахуванням ширини межі

 

Ілюстрацію, яка відображається в полі компонента PictureBox, можна задати як під час розробки форми додатка, так і в поцесі роботи програми.

Щоб задати ілюстрацію під час розробки форми, треба в рядку властивості Picture клацнути на кнопці з трьома крапками і в діалоговому вікні Load Picture вибрати файл ілюстрації. Слід звернути увагу: файл, в якому зберігається ілюстрація, вибрано таким чином, що під час роботи програми він не потрібний (Visual Basic автоматично поміщає копію ілюстрації у виконуваний файл програми).

Якщо розмір ілюстрації більший від розміру компонента, але не перевищує розміру поля форми, яка може бути використана для відображення цієї ілюстрації, то властивості Autosize можна присвоїти значення True. Унаслідок цього результаті розмір компонента буде відповідати розміру вибраної ілюстрації. Якщо є обмеження на розмір поля, то замість компонента PictureBox доведеться використовувати компонент Image.

Основні властивості компонента Image перелічено в табл. 8.8.

Таблиця 8.8

Властивості компонента Image

Властивість	Опис
Picture	Ілюстрація, що відображається в полі компоненту
Stretch	Ознака необхідності масштабування ілюстрації так, щоб вона займала все поле відображення. Масштабування відбувається, якщо властивість набуває заначення True
Width	Ширина компонента (зона відображення ілюстрації) з урахуванням ширини лінії, яка обмежує ілюстрацію
Height	Висота компонента з урахуванням ширини лінії, яка обмежує ілюстрацію
Left	Відстань від лівої межі компонента до лівої межі форми
Тор	Відстань від верхньої межі компонента до верхньої межі форми
Visible	Ознака відображення компонента. Дозволяє приховати компонент (тоді вона набуває значення False) або зробити його видимим (тоді це значення True)
Закінчення табл. 8.8
Appearance	Стиль компонента. Поле компонента перебуває над поверхнею форми (у цьому випадку властивість набуває значення 3D) або розміщується на одному рівні з поверхнею форми (у цьому випадку властивість набуває значення Flat)
BorderStyle	Тип межі компонента. Лінія, що обмежує ілюстрацію може бути тонкою (FixedSingle) або зовсім відсутньою (None)

Слід звернути увагу, що після завантаження в компонент Image ілюстрації якщо властивість Stretch відповідає значенню True, розмір компонента буде відповідати розміру ілюстрації. Якщо властивість Stretch набуває значення False, то зміна значення властивості Рicture не приведе до зміни значень властивостей Width і Height.

Завантаження ілюстрації в поле компонента PictureBox (Image) під час роботи програми забезпечує функція LoadPicture. У ролі параметра цієї функції треба назвати файл ілюстрації, а її значення присвоїти властивості Рicture. Наприклад, унаслідок виконання такої інструкції: Picture1.Picture = LoadPicture (" d: \images\ufo.bmp"), у полі компонента Рicture1 з'явиться ілюстрація, що зберігається в названому файлі.