Графіка у Visual Basic

1. Графічні об'єкти

У Visual Basic (VB) є три графічних об'єкта, які дозволяють працювати  з графікою:

• Форма (Form);

• Керуючий елемент графічне поле (PictureBox);

• Малюнок (Image).

Форма (Form) і графічне поле (PictureBox) – це два об'єкти-контейнера, які:

• здатні містити в собі точковий малюнок з графічного файлу;

• володіють графічними методами і дозволяють за допомогою графічних методів малювати на своїй поверхні;

• здатні містити в собі інші керуючі елементи.

Об'єкт Image (малюнок) може тільки містити в собі точковий малюнок, але він не володіє графічними методами і не може включати керуючих елементів, тобто не є контейнером.

Використання форми, графічного поля і малюнка для відображення графічних об'єктів – рис. 1-3.

2. Система координат

Коли виконується робота з графічними об'єктами або використовуються інструменти малювання, необхідно описувати, де саме на формі (Form) (або на графічному полі (PictureBox)) буде розташовуватися зазначений елемент (або намальована обрана геометрична фігура). Щоб визначити місце розташування того чи іншого графічного елементу або образу, використовуються координати.

Будь-яка точка на формі або на малюнку може бути описана за допомогою пари чисел X і Y, які задають її точне розташування (X – горизонтальна координата, Y – вертикальна). На відміну від математичних позначень, у Visual Basic вертикальна координата Y зростає не знизу вгору, а зверху вниз (горизонтальна координата X збільшується стандартним чином – зліва направо).

Як форма, так і графічне поле володіють системою координат, яка застосовується при будь-якому виведенні на поверхні форми або графічного поля тексту, графіки і малюнків (рис. 4).

За замовчуванням початок відліку знаходиться в лівому верхньому куті об'єкта. Вісь Х спрямована вправо, вісь Y – вниз.

Системою координат можна керувати як на етапі розробки, так і при виконанні програми. У Visual Basic робота з графічними елементами може виконуватися в різних системах координат, в залежності від яких змінюється роздільна здатність зображення.

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

Стандартна система координат VB припускає використання одиниць виміру, званих твіпами. Один твіп дорівнює 1/20 пункту, або 1/1440 дюйма, або 0,0176 мм. В одному сантиметрі приблизно 567 твіпів. Ця одиниця вимірювання є більш точною, ніж піксель. Можна також вибрати у якості одиниці виміру пікселі (розмір точки на малюнку), пункти або символи  (застосовується для тексту), дюйми, сантиметри або міліметри.

Властивість ScaleMode. Вибір тієї чи іншої системи координат для форми (Form) або графічного поля (PictureBox) виконується за допомогою властивості ScaleMode. Встановивши цій властивості необхідне значення на етапі розробки програми або в програмному коді, можна отримати бажані одиниці вимірювання. Однак слід зазначити, що при зміні значення властивості ScaleMode реальні розміри елементів залишаються колишніми, змінюється тільки чисельне вираження їх координат і розмірів.

У тому випадку, коли жодна з пропонованих одиниць вимірювання не влаштовують розробника, він може створити свою власну, вказавши ScaleMode = vbUser. При цьому система координат може бути такою, яка найбільшою мірою задовольняє розробника при створенні програми.

3. Розмір і розташування

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

Для установки користувальницьких координат слід задати ScaleMode = vbUser або ScaleMode = 0. У користувальницької системі координат властивостями розміру і положення є властивості: ScaleLeft, ScaleTop, ScaleWidth і ScaleHeight, встановлення яких має значення тільки для користувальницьких одиниць виміру. При цьому на відміну від стандартних координатних систем в даному випадку координати лівого верхнього кута (ScaleLeft і ScaleTop) можуть бути обрані довільно, тобто не повинні обов'язково дорівнювати нулю.

Властивості ScaleLeft і ScaleTop. Значення цих властивостей визначають числові значення координат лівого верхнього кута об'єкта. Значення цих властивостей не впливають на стан контейнера.

Якщо в програмному коді задати, наприклад, ScaleLeft = 50 і ScaleTop = 100, то значення координат верхнього лівого кута контейнера будуть відповідати рис. 6.

Властивості ScaleWidth і ScaleHeight. Ці властивості задають масштабування висоти і ширини об'єкта, тобто внутрішні розміри. Наприклад:

ScaleWidth = 1000 ScaleHeigt = 100

Ці інструкції визначають одиницю горизонтальної осі як 1/1000 внутрішньої ширини об'єкта і одиницю вертикальної осі як 1/100 поточної внутрішньої висоти об'єкта. Якщо розміри форми при виконанні програми змінюються, одиниці залишаються тими ж.

Метод Scale. Для програмної установки користувальницької системи координат використовується метод Scale. Цей метод дозволяє визначити систему координат і одиницю виміру на формі, графічному полі та об'єкті Printer. Метод Scale задає координати початку і кінця відліку по вертикалі і горизонталі (рис. 7).

Синтаксис методу:

[об'єкт]. Scale [(x1, y1) – (x2, y2)]

x1, y1 – координати лівого верхнього кута обумовленою системи координат об'єкта;

x2, y2 – координати правого нижнього кута обумовленою системи координат об'єкту.

Тут в якості об'єкта зазвичай виступає форма (Form) або об'єкт PictureBox.

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

Метод Scale не змінює розміри об'єкта, а задає значення координат його лівого верхнього і нижнього правого кутів.

Наприклад, щоб в малюнку задати одиниці виміру, відповідні області зміни X від – 10 до 10, а Y від – 20 до 20 в програмному коді можна записати таку команду:

Picture1.Scale (-10,20) - (10, -20)

Еквівалентом зазначеної команді були б наступні присвоєння значень властивостей:

Picture1.ScaleLeft = -10

Picture1.ScaleTop = -20

Picture1.ScaleWidth = 20

Picture1.ScaleHeight = 40

Слід зазначити, що присвоєння будь-якого з цих властивостей або використання методу Scale автоматично задає властивості ScaleMode значення vbUser, тобто виконується перехід до користувальницьких одиниць вимірювання.

4. Графічні керуючі елементи

Для створення графічних образів у вигляді ліній і геометричних фігур у Visual Basic можна використовувати елементи управління Line (лінія) і Shape (фігура), які додаються на форму (Form) або графічне поле (PictureBox) на етапі розробки програми. Ці елементи мають деякі особливості, які відрізняють їх від інших об'єктів, таких як командної  кнопки, списку, мітки і т. д.

Відмінності ліній і фігур від інших елементів управління полягають в наступному:

• для них не обробляються ніякі події (наприклад, клацання миші), як наслідок – об'єкти Line і Shape не можуть мати фокус при виконанні додатка;

• об'єктів цих типів немає в списку елементів проекту, доступних у вікні коду (список Object в лівому верхньому кутку вікна коду).

Таким чином, об'єкти Line і Shape можна змінювати, задаючи різні значення їх властивостями безпосередньо в тексті програми, а також переміщати, використовуючи метод Move.

Елемент управління Line. Елемент управління Line – це лінія, що має за замовчуванням товщину 1. Для зміни виду лінії використовується властивість BorderStyle об'єкту Line. Воно може приймати наступні значення:

0 – Transparent (невидима лінія);

1 – Solid (суцільна лінія);

2 – Dash (штрихова лінія);

3 – Dot (пунктирна лінія);

4 – Dash-Dot (штрихпунктирна лінія);

5 – Dash-Dot-Dot (штрихпунктир з подвійним штрихом);

6 – Inside Solid (безперервна лінія).

Типи лінії в залежності від значення властивості BorderStyle показані на рис. 8.

Товщину лінії можна задати за допомогою властивості Borderwidth. Колір лінії задається властивістю BorderColor.

Елемент управління Shape. Для створення рамок різної форми використовується елемент управління Shape (рис. 9). При цьому форма рамки задається властивістю Shape об'єкта Shape і може бути наступною:

0 – RectangIe (прямокутник);

1 – Square (квадрат);

2 – Oval (еліпс);

3 – Circle (коло);

4 – Rounded Rectangle (прямокутник із закругленими кутами);

5 – Rounded Square (квадрат із закругленими кутами).

При цьому для елементу управління Shape, як і для Line, можна встановити тип лінії рамки, її товщину і колір.

5. Графічні методи

Для створення графіки Visual Basic, на додаток до графічним елементів управління, має декілька графічних методів для застосування на формі та графічному полі (PictureBox).

Крапка Pset. Малює крапку із заданими координатами та кольором.

Object. Pset (X, Y), C

X, Y – координати точки, C – колір.

Якщо Object не вказаний, то побудова здійснюється на формі.

Коло Circle. Малює коло, еліпс або дугу.

Object. Circle (X, Y), R, C, A, B

X, Y – координати центру у вибраній системі координат,

R – радіус,

C – колір,

AB – кути дуги в радіанах.

Якщо Object не вказаний, то побудова здійснюється на формі. Якщо кути не вказані, то будується повна окружність. Якщо кути вказані, то будується дуга проти годинникової стрілки від кута A до кута B.

Для побудови еліпса треба до оператора побудови кола додати коефіцієнт стиснення k.

Object. Сircle (X, Y), R, C, A, B, k

Лінія Line. Малює лінію, прямокутник або заповнене вікно.

Object. Line (X1, Y1) - (X2, Y2), C

X1, Y1 – координати точки початку відрізка,

X2, Y2 – координати точки закінчення відрізка,

C – колір.

Якщо аргумент C колір не вказаний, то колір лінії визначається значенням властивості ForeColor об'єкта.

Прямокутник зі сторонами, паралельними екрану.

Object.Line (X1, Y1) - (X2, Y2), C, B

X1, Y1 – координати точки початку діагоналі прямокутника, X2, Y2 – координати точки закінчення діагоналі прямокутника, C – колір,

B – добудовує прямокутник за його діагоналі (діагональ береться з двох можливих). Сама діагональ при цьому не будується.

BF – добудовує прямокутник по його діагоналі і зафарбовує його кольором C.

Очищення намальованого Cls.  Очищає екран. Синтаксис:

Print. Object.Cls

Якщо Object  не зазначений, то дія відноситься до поточної форми.

Current X, Current Y, step. У процесі малювання Visual Basic постійно змінює властивості форми CurrentX, CurrentY, які дорівнюють координатам останньої намальованої точки. Для методу Line це та з двох точок, координати якої вказані в правих дужках, а якщо справа стосується методу Circle – то це координати центру кола. Для методу PSet все ясно без пояснень. Метод Print теж змінює ці координати, встановлюючи їх в те місце, де має з'явитися наступний надрукований символ. Можна відстежувати ці властивості за допомогою оператора Debug.Print CurrentX, CurrentY.

Перед будь-якими дужками із зазначенням координат можливо писати слово Step. Тоді числа в цих дужках перестають бути абсолютними координатами, а стають зміщенням по горизонталі і вертикалі від точки, координати якої визначаються властивостями CurrentX, CurrentY. Позитивне зміщення по горизонталі – направо, по вертикалі – вниз.

Наприклад,  PSet Step (179, -40).

Point повертає колір в RGB зазначеної точки у формі або на об'єктах типу pictureBox. Синтаксис Point:

object. Point (x, у)

object – об'єкт, в якому використовується метод.

x, у – координати точки в об'єкті.

PainPicture. Метод paintpicture завантажує вміст графічних файлів мають розширення bmp, wmf, emf, cur, ico або dib, в формах або об'єктах типу picture. Синтаксис:

object.PaintPicture picture, xl, yl, width1, height1, x2, y2, width2, height2, opcode

object – об'єкт, в якому застосовується метод. Якщо об'єкт не вказано, то за замовчуванням використовується форма.

picture – початкове зображення з посиланням на властивість picture, яке буде розміщено в об'єкті.

xl, yl – координати лівого верхнього кута об'єкта для розміщення вихідного зображення.

widthi, heightl – ширина і висота розміщення вихідного зображення. Якщо розмір області відрізняється від розміру початкового зображення, то зображення пропорційно збільшується або зменшується.

х2, y2 – координати лівого верхнього кута в оригінальному документі для вставки в об'єкт. Якщо задані координати, відмінні від нуля, то буде вставлена ​​частина вихідного зображення.

width2, height2 – ширина і висота вставляється частини вихідного зображення.

opcode – встановлює режим вставки зображення за допомогою констант з набору RasterOp. Здається тільки для роботи з зображеннями, що мають розширення bmp.

За допомогою негативних значень ширини (width) і висоти (height) можна перевернути зображення вертикально або горизонтально.

6. Графічні властивості об'єктів

Властивості кольорів. Властивість BackColor (колір фону) задає колір фону для форми або елемента керування, у якого є дана властивість.

Властивість FillColor (колір заливки) встановлює колір заливки для малюнків на формі або фігур PictureBox .

Властивість ForeColor (колір малювання) задає колір, яким буде виконуватись малювання.

Властивості ліній. Властивість BorderStyle (тип кордону) визначає стиль межі елементу управління. Набір можливих значень залежить від типу елемента.

Властивість BorderWidth (товщина межі) визначає товщину кордону фігури Shape або товщину лінії Line. Значенням даного властивості може бути ціле число в діапазоні [1; 32767].

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

Властивість DrawWidth (товщина лінії) визначає товщину лінії, що буде малюватися, або кола (для графічних методів). Значенням даної властивості може бути ціле число в діапазоні [1; 32767].

Слід зазначити одну важливу особливість властивості DrawWidth. Якщо вона буде більша 1, то штрихова, пунктирна і штрихпунктирна лінії будуть відображатися як суцільні. Тобто встановлювати при товщині лінії більше 1 стиль зі штрихом або пунктиром (властивість DrawStyle) не має сенсу (аналогічно – властивість BorderWidth для об’єктів Line і Shape).

Типи заливки. FillStyle (тип заливки) – властивість для завдання типу (або візерунка) заливки.

FillStyle = від 0 до 7

0 – непрозорий;

1 – прозорий;

2 – горизонтальні полоси; 

3 – вертикальні полоси;

4 – штриховка вліво; 

5 – штриховка вправо; 

6 – штриховка в клітинку; 

7 – штриховка в  ромб.

Параметри тексту. Відображення тексту на формі (або малюнку) виконується у відповідності з установками властивості Font.

На етапі розробки при встановленні даної властивості буде відображено стандартне діалогове вікно Вибір шрифту, в якому можна задати всі необхідні параметри (гарнітура, розмір, накреслення і т. д.).

У програмному коді доступ до налаштувань шрифту здійснюється також за допомогою властивості Font. Формат доступу до параметрів шрифту з коду програми виглядає наступним чином:

об'єкт. Font. параметр = значення

Тут об'єктом може бути форма або будь-який елемент, що має властивість Text; параметр визначає налаштування шрифту (наприклад, накреслення або розмір), якій присвоюється необхідне значення.

Виведення тексту. Для виведення тексту на формі або малюнку застосовується метод Print. Формат даного методу наступний:

об'єкт. Print значення

тут в якості об'єкта виступає форма (Form) або графічне поле (PictureBox), a значенням зазвичай є рядок або змінна.

7. Робота із зображеннями

Зображення можуть бути поміщені на форму, в елемент управління Графічне поле (PictureBox) та в елемент управління Малюнок (Image). Visual Basic дозволяє завантажувати в додаток файли .jpg і .gif, а також .bmp, .dib, .ico, .cur, .wmf і .emf.

Під час розробки малюнок може бути доданий у форму або елемент управління двома способами:

• з графічного файлу за допомогою властивості Picture;

• через буфер обміну.

В останньому випадку слід скопіювати малюнок з іншої програми в буфер обміну, повернутися в Visual Basic, вибрати форму, малюнок або Графічне поле і в меню Edit (Правка) вибрати Paste (Вставити).

Для видалення малюнка з об'єкта слід виділити цей об'єкт, потім у вікні властивостей вибрати властивість Picture, подвійним клацанням на значенні цієї властивості виділити його і натиснути клавішу Delete.

У період виконання програми можна виконати завантаження зображення теж декількома способами. Наприклад, можна використовувати функцію LoadPicture для присвоєння повного імені файлу властивості Picture.

Наступний оператор завантажує файл bmp1.bmp в елемент керування Picture1:

Picture1.Picture = LoadPicture ("c: \ Pict \ bmp1.bmp")

Можна також скопіювати зображення з одного об'єкта в інший:

Picture1.Picture = Image1.Picture

Щоб видалити зображення в період виконання програми без заміни його іншим зображенням можна скористатися функцією LoadPicture.

Наступний оператор видаляє зображення з графічного поля Image1:

Image1.Picture = LoadPicture ("")

8. Використання кольору

При оформленні форм та інших об'єктів можна використовувати колірне оформлення, використовуючи властивості BackColor, ForeColor, FilStyle, FillColor. Visual Basic дозволяє оперувати 2 563 відтінками.

Програмно колір можна задавати трьома способами.

1-й спосіб – за допомогою константи кольорів. У цьому випадку колір вказується безпосередньо константним словом (табл. 3).

2-спосіб – за допомогою функції QBColor, яка повертає числове представлення одного з 16 кольорів. І в цьому випадку колір вказується так:

QBColor (номер кольору)

3-спосіб – за допомогою функції RGB. Функція RGB повертає числове подання кольору (тип значення при цьому long) відповідно з інтенсивністю трьох колірних складових: R (Red – червоний), G (Green – зелений) і В (Blue – синій). Інтенсивність цих трьох основних кольорів задається шкалою чисел від 0 до 255.

Синтаксис функції:

RGB (Red, Green, Blue)

де Red – інтенсивність червоного кольору від 0 до 255; Green – інтенсивність зеленого кольору від 0 до 255; Blue – інтенсивність синього кольору від 0 до 255.

Питання для перевірки:

1. Що таке графічний об'єкт? Назвіть графічні об'єкти.

2. Що таке графічний метод? Назвіть графічні методи.

3. Які графічні елементи управління Вам відомі?

4. Які одиниці виміру застосовуються в графічних об'єктах?

5. Для чого використовується властивість ScaleMode?

6. Розкажіть призначення методу Scale. Наведіть синтаксис методу.

7. Що таке об'єкт Picture і які його основні властивості?

8. Перерахуйте основні властивості елемента управління Line.

9. Перерахуйте основні властивості елемента управління Shape.

10. Назвіть графічні властивості об'єктів.

11. Як можна додати зображення на форму?

12. Файли яких графічних форматів можна використовувати в елементі управління малюнок (Image)?

13. Який метод використовується для виведення тексту на формі (Form) або малюнку (PictureBox)?

14. Як в програмному коді можна змінити параметри шрифту для виведення тексту на формі (Form)?

15. Які способи використовуються в VB для завдання кольору?

16. Наведіть формат RGB - функції.

17. Наведіть синтаксис методу PSet.

18. Який синтаксис методу Line і що означають його параметри?

19. Який синтаксис методу Circle і що означають його параметри?