Список компонентів відображення графічної інформації. Графічні компоненти Delphi Компоненти відображення графічної інформації

Перелік компонентів відображення графічної інформації

Для відображення графічної інформації в бібліотеці Delphi передбачені компоненти, список яких наведено в таблиці 4.1.

Крім того, відображати та вводити графічну інформацію можна на поверхні будь-якого Відображення графіки на канві Canvas.

Канва Canvasне є компонентом, так що, строго кажучи, вона не повинна розглядатися в рамках цієї книги. Але оскільки багато компонентів, зокрема, форми, мають канву і канва надає можливість виводити різну графічну інформацію, деякі початкові відомості про канву все-таки доцільно дати.

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

Кожна точка канви має координати. Xі Y. Система координат канви, як і всюди Delphi, має початком лівий верхній кут канви. Координата Xзростає при переміщенні зліва направо, а координата Y- при переміщенні зверху донизу. Координати вимірюються у пікселях. Піксель - найменший елемент поверхні малюнка, з яким можна маніпулювати. Найважливіша властивість пікселя – його колір.

Канва має властивість Pixels. Ця властивість є двовимірний масивякий відповідає за кольори канви. Наприклад, Canvas. Pixelsвідповідає кольору пікселя, 10-го зліва та 20-го зверху. З масивом пікселів можна поводитися як з будь-якою властивістю: змінювати колір, задаючи пікселю нове значення, або визначати його колір за значенням, що зберігається в ньому. Наприклад, Canvas. Pixels : = 0або Canvas. Pixels : = clBlack- Це завдання пікселя чорного кольору.

Властивість Pixelsможна використовувати для малювання на канві. Спробуємо намалювати по пікселях графік синусоїди на канві форми. Для цього в обробник події форми OnPaint(промальовування) можна вставити наступний код:

TForm1. FormPaint (Sender: TObject);

var, Y: real; // координати функції, PY: longint; // координати пікселів

begin: = clWhite;

for PX: = 0 to ClientWidth do

(X - аргумент графіка,

: = PX*4*Pi/ClientWidth;: =Sin (X);

(PY - координата пікселя,

: =trunc (ClientHeight - (Y+1) * ClientHeight/2);

(Встановлюється чорний колір вибраного

пікселя (Про яскравість) ). Pixels: = 0;

end;

Виконайте цей тестовий додаток і ви побачите результат, представлений на рис.4.1 а. Графік синусоїди вийшов, хоча й дуже хороший, т.к. розбивається на окремі точки – пікселі.

Канва – об'єкт класу TCanvasмає безліч методів, які дозволяють малювати графіки, лінії, фігури за допомогою властивості Pen- Перо. Ця властивість є об'єктом, що у свою чергу має ряд властивостей. Одна з них вже відома вам властивість Color- Колір, яким наноситься малюнок. Друга властивість - Width(Ширина лінії). Ширина задається у пікселях. За замовчуванням ширина дорівнює 1.

Властивість Styleвизначає вид лінії. Ця властивість може приймати такі значення:

У канви є властивість PenPosтипу TPoint(див .). Ця властивість визначає координати канви поточну позицію пера. Переміщення пера без промальовування лінії, тобто. зміна PenPos, виробляється методом канви MoveTo (X, Y).Тут ( X, Y) -координати точки, до якої переміщається перо. Ця поточна точка стає вихідною, від якої методом LineTo (X,Y)можна провести лінію в точку з координатами ( X, Y).При цьому поточна точка переміщується в кінцеву точку лінії та новий виклик LineToбуде проводити точку з цієї нової поточної точки.

Спробуємо намалювати пером графік синуса з попереднього прикладу. У цьому випадку обробник події форми OnPaintможе мати вигляд:

procedure TForm1. FormPaint (Sender: TObject);

var, Y: real; // координати функції, PY: longint; // координати пікселів

begin: = clWhite;. MoveTo (0,ClientHeight div 2);

for PX: =0 to ClientWidth do

(X - аргумент графіка,

відповідний пікселю з координатою РХ): = PX*4*Pi/ClientWidth;: = Sin (X);

(PY - координата пікселя,

відповідна координаті Y): = trunc (ClientHeight - (Y+1) * ClientHeight/2);

(Проводиться лінія на графіку). LineTo (PX, PY);

Результат роботи програми у цьому варіанті ви можете бачити на рис.4.1 б. Як бачите, якість графіка суттєво покращилася.

Перо може малювати як прямі лінії, а й постаті. Повний список методів канви, що використовують перо, див. у вбудованій довідці Delphi. А поки як приклад наведемо лише один з них - Ellipse, що малює еліпс або коло. Він оголошений як

procedure Ellipse (X1, Y1, Х2, Y2: Integer);

де параметри X1, Х2, Y1, Y2визначають координати прямокутника, що описує еліпс або коло. Наприклад, оператор

Ellipse (10, 40, 20, 50);

намалює коло з діаметром 10 і координатами центру (15, 45).

Фігури в загальному випадку малюються не порожніми, а зафарбованими за допомогою канви Brush- пензлик. Властивість Brushє об'єктом, що має у свою чергу ряд властивостей. Властивість Colorвизначає колір заповнення. Властивість Styleвизначає шаблон заповнення (штрихування). За замовчуванням значення Styleодно bsSolidщо означає суцільне зафарбовування кольором Color.

У пера Penє ще одна властивість, яку ми поки що не розглядали. Ця властивість - Mode(Режим). За замовчуванням значення Mode = pmCopy. Це означає, що лінії проводяться кольором, заданим у властивості Color. Але можливі інші режими, в яких враховується не тільки колір Color, а також колір відповідних пікселів фону. Найцікавішим із цих режимів є режим pmNotXor- додавання з фоном по інверсному виключає АБО. Якщо встановлено цей режим, то повторне малювання тієї ж фігури на тому ж місці канви прибирає раніше намальоване зображення і відновлює кольори пікселів, які були до першого зображення фігури.

Цю особливість режиму pmNotXorможна використовувати для створення простенької анімації. Достатньо намалювати щось, потім стерти намальоване, перемалювати трохи зміненим - і малюнок буде ожилим.

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

X,Y: integer;

Тим самим ви введете глобальні змінні Xі Y- поточні координати зображення.

У подію форми OnPaintвставте оператори

Brush. Color: = clWhite;: = clWhite;. Pen. Mode: = pmNotXor;

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

Третій оператор встановлює режим пера pmNotXor, який дозволить вам прати колишнє зображення, перш ніж намалювати нове.

Навіть найпростіша мультиплікація потребує синхронізації. Інакше швидкість руху визначатиметься швидкодією комп'ютера. Тому перенесіть на форму компонент Timer- Таймер зі сторінки System. Цей компонент описаний у розділі 5.7 .

Можете подивитись там його докладний опис. А поки задайте його властивість Intervalрівним, наприклад, 30 (це час витримки в мілісекундах, але реальний часвитримки буде більше - див. розділ 5.7) та встановіть властивість Enabledрівним false(це означає, що таймер не запускатиметься автоматично в момент запуску програми).

В обробник події цього компонента OnTimerвставте оператори

// Стирання попереднього зображення. Ellipse (Х-5, Y, X+5, Y-1Q); (X);

// Малювання нового зображення. Ellipse (Х-5, Y, X+5, Y-10);

// Зупин при досягненні кінця форми

if(X >= ClientWidth-20) then. Enabled: = false;

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

Останній оператор зупиняє зображення біля краю форми.

Тепер перенесіть на форму кнопку Buttonі в обробник клацання на ній помістіть оператори

Х: = 10;: = 100;. Ellipse (X-5, Y, X+5, Y-10); Enabled: = true;

Перші два оператори задають початкові координати кола. Третій оператор малює коло у його початковому положенні, а четвертий - запускає таймер.

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

На канві можна відображати не лише програмно створювані зображення, а й зображення, що зберігаються у графічних файлах. Тільки сама канва немає методу завантаження зображення з файла. Тому завантажувати файл треба в якийсь інший графічний об'єкт, здатний приймати інформацію графічних файлів. А потім переписувати зображення з цього об'єкта на канву за допомогою методу канви Draw. Його опис:

Draw (X, Y: Integer; Graphic: TGraphic);

Тут параметри Хі Yвизначають координати лівого верхнього кута розміщення зображення на канві, a Graphic- Об'єкт, що зберігає інформацію. Як такий об'єкт може виступати, наприклад, об'єкт типу TBitMapпризначений для зберігання бітових матриць. Давайте подивимося, як це виглядає практично.

Відкрийте нову програму, перенесіть на форму компонент OpenPictureDialogзі сторінки Dialogs (це компонент діалогу відкриття графічних файлів - див. розділ 8.2 ) та кнопку Button. Розмістіть OpenPictureDialogу будь-якому місці форми, оскільки цей компонент невізуальний, а кнопку розмістіть унизу форми. В обробник клацання на кнопці занесіть код:

procedure TForm1. Button1Click (Sender: TObject);

var: TBitMap;

// Вибір користувачем графічного файлу

if OpenPictureDialog1. Execute then

// Створення об'єкта BitMap типу TBitMap: =TBitMap. Create;

// Перенесення зображення на канву форми. Draw (10, 10, BitMap);

// Знищення об'єкта BitMap. Free;

end;

Цей код створює тимчасовий об'єкт типу TBitMapз ім'ям BitMap. Потім викликається діалог відкриття графічного файлу OpenPictureDialog1і, якщо користувач вибрав файл, він завантажується в BitMapметодом LoadFromFile. Потім методом Drawзавантажене зображення копіюється на канву в область, з координатами верхнього лівого кута (10,10). Після цього тимчасовий об'єкт BitMapзнищується.

Запустіть вашу програму і клацніть на її кнопці. Ви побачите, що ви можете завантажити будь-який графічний файл типу. bmpі він відобразиться на канві форми (див. рис.4.2 а). Графічні файли можна знайти в каталозі Images. У Delphi 5 та 4 він зазвичай розташований у каталозі. \program files\Common Files\Borland Shared. У Delphi 3 він розташований у каталозі. \program files\Borland\Delphi 3, а в Delphi 1 - у каталозі Delphi 16. У каталозі Images є, зокрема, підкаталог \Images\Splash\16Color\, в якому зберігається файл, завантажений у прикладі рис.4.2

Ви створили непогану програму для перегляду графічних файлів. Але тепер спробуємо побачити його великий недолік. Не закриваючи своєї програми, перейдіть в якусь іншу програму, наприклад, поверніться до Delphi. Потім, нічого там не роблячи, знову перейдіть у свій додаток, що виконується. Якщо вікно програми, в яку ви йшли, повністю перекрило вікно вашої програми, то повернувшись до нього ви побачите, що картинка у вікні зникла. Якщо ж вікно вашої програми перекривалося лише частково, то повернувшись у свою програму ви, можливо, побачите результат, подібний до представленого на рис.4.2 б.

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

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

Перемальовка може проводитись різними способамизалежно від програми. У нашому прикладі можна було б винести оголошення змінної BitMap(оператор var BitMap: TBitMap) межі наведеної вище процедури, тобто. зробити цю змінну глобальною, розмістивши безпосередньо у розділі implementation. Оператор BitMap. Freeможна було б перенести в обробник події форми OnDestroy, що відбувається в момент закриття програми. Тоді протягом усього часу виконання вашої програми ви матимете копію картинки в компоненті BitMapі вам достатньо ввести в обробник події OnPaintформи всього один оператор:

Draw (10, 10, BitMap);

Зробіть це і побачите, що зображення на формі не псується при будь-яких перекриттях вікон.

Крім розглянутого методу Drawканва має ще метод копіювання CopyRect:

CopyRect (Dest: TRect; Canvas: TCanvas; Source: TRect);

Метод копіює вказану параметром Sourceобласть зображення у канві джерела зображення Canvasу вказану параметром Destобласть даної канви. Тип TRect, Що характеризує прямокутні області Sourceі Dest, вже описувався у розділі 3.2 .

Наприклад, оператор

CopyRect (MyRect2, Bitmap. Canvas, MyRect1);

копіює на канву форми в область MyRect2зображення з області MyRect1канви компонента Bitmap.

Копіювання методом CopyRectпроводиться у режимі, встановленому властивістю CopyMode. За умовчанням ця властивість має значення cmSrcCopyщо означає просто заміну зображення, що міститься раніше в області Destна копіюване зображення. Інші можливі значення CopyModeдозволяють комбінувати зображення, але їх розгляд виходить за рамки цієї книги.

Цими основними відомостями про виведення графічної інформації на канву ми обмежимося. У розділі 3.2 повідомлено відомості про виведення на канву тексту. У цілому ж канва - складний об'єкт, що має ще багато властивостей і методів. Але це вимагає розгорнутого обговорення, що виходить за рамки цієї книги. У наступній книзі серії "Все про Delphi" ці питання будуть розглянуті докладніше.

Віконного компонента, що має властивість Canvas- Канва.

Компоненти Image та PaintBox

Компоненти Imageі PaintBoxє деякою обмеженою поверхнею з канвою, на яку можна заносити зображення, як це описано в розділі 4.2 . При цьому компонент PaintBox, власне, не дає нічого нового в порівнянні з малюванням на канві форми. Малювання на PaintBoxзамість форми немає ніяких переваг, крім, можливо, деякого полегшення розташування одного чи кількох малюнків у площі вікна.

Але крім цих можливостей у компонента Imageє властивості, що дозволяють працювати з різними типамиграфічних файлів. Підтримує три типи файлів - бітові матриці, піктограми та метафайли. Усі три типи файлів зберігають зображення; Відмінність полягає лише у способі їх зберігання всередині файлів та у засобах доступу до них. Бітова матриця (файл із розширенням. bmp) відображає колір кожного пікселя у зображенні. При цьому інформація зберігається таким чином, що будь-який комп'ютер може відобразити зображення з роздільною здатністю та кількістю кольорів, що відповідають його конфігурації.

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

Метафайли (Metafiles) зберігають не послідовність бітів, у тому числі складається зображення, а інформацію про спосіб створення картинки. Вони зберігають послідовності команд малювання, які можуть бути повторені при відтворенні зображення. Це робить такі файли, як правило, компактнішими, ніж бітові матриці.

Компонент Imageдозволяє відображати інформацію, що міститься у графічних файлах всіх зазначених типів. Для цього слугує його властивість Picture- об'єкт типу TPicture.

Щоб познайомитися з цією властивістю, відкрийте нову програму і перенесіть на форму компонент Image. Розтягніть його або задайте його властивість Alignрівним alClientщоб він зайняв всю клієнтську область форми. Натисніть на кнопку з трьома крапками біля властивості Pictureу вікні Інспектора Об'єктів або просто зробіть подвійне клацання на Image. Перед вами відкриється вікно Picture Editor (рис.4.3), що дозволяє завантажити якість Pictureякийсь графічний файл (кнопка Load), а також зберегти відкритий файл під новим ім'ям або в новому каталозі. Натисніть Load, щоб завантажити графічний файл. Перед вами відкриється вікно відкриття графічного файлу, представлене на рис.4.4 У міру переміщення курсору в списку по графічних файлах у правому вікні відображаються картинки, що містяться в них, а над ними - цифри, що характеризують розмір картинки. Ви можете вибрати потрібний графічний файл будь-якого типу. Нагадаємо, що графічні файли, що поставляються з Delphi, ви можете знайти в каталозі Images. У Delphi 5 та 4 він зазвичай розташований у каталозі. \program files\Common Files\Borland Shared. У Delphi 3 він розташований у каталозі. \program files\Borland\Delphi 3, а в Delphi 1 - у каталозі Delphi 16. Після завантаження файлу клацніть на OK у вікні Picture Editor і у вашому компоненті Imageз'явиться вибране зображення. Можете запустити вашу програму і помилуватися нею. Втім, ви бачите картинку, навіть не виконуючи додаток.

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

Повернемося до розгляду властивостей компонента Image.

Якщо встановити властивість AutoSizeв true, то розмір компонента Imageбуде автоматично підганятися під розмір картинки, що вміщена в нього. Якщо ж властивість AutoSizeвстановлено в false, то зображення може не поміститися в компонент або, навпаки, площа компонента може виявитися набагато більшою за площу зображення.

Інша властивість - Stretchдозволяє підганяти компонент під розмір малюнка, а малюнок під розмір компонента. Встановіть AutoSizeв false, розтягніть або стисніть розмір компонента Imageта встановіть Stretchв true. Ви побачите, що малюнок займе всю площу компонента, але оскільки навряд чи реально встановити розміри Imageяк пропорційними розміру малюнка, то зображення спотвориться. Встановлювати Stretchв trueможе мати сенс лише для якихось візерунків, але не для картинок. Властивість Stretchне діє зображення піктограм, які можуть змінювати своїх розмірів.

Властивість Center, встановлене в trueцентрує зображення на площі Image, якщо розмір компонента більший за розмір малюнка.

Розглянемо ще одну властивість - Transparent(Прозорість). Якщо Transparentодно true, то зображення в Imageстає прозорим. Це можна використовувати для накладання зображень один на одного. Покладіть на форму другий компонент Imageі завантажте в нього інше зображення. Тільки постарайтеся взяти якусь мало заповнену, контурну картинку. Можете, наприклад, взяти картинку з числа поміщаються зазвичай на кнопки, наприклад, стрілку (файл. \program files\common files\borland shared\images\buttons\arrow1l. bmp). Пересуньте ваші Imageтак, щоб вони перекривали один одного, і у верхньому компоненті встановіть Transparentрівним true. Ви побачите, що верхня картинка перестала затуляти нижню. Одне з можливих застосування цієї властивості - накладення на картинку написів, виконаних у вигляді бітової матриці. Ці написи можна зробити за допомогою вбудованої у Delphi програми Image Editor.

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

Ми розглянули завантаження зображення з файлу у процесі проектування. Але властивість Pictureдозволяє також легко організувати обмін із графічними файлами будь-яких типів у процесі виконання програми. Щоб пояснити техніку такого обміну, треба спочатку детальніше розглянути якість Picture.

Ця властивість є об'єктом, який має у свою чергу підсвойства, що вказують на графічний об'єкт, що зберігається. Якщо в Pictureзберігається бітова матриця, на неї вказує властивість Picture. Bitmap. Якщо піктограма зберігається, на неї вказує властивість Picture. Icon. На метафайл, що зберігається, вказує властивість Picture. Metafile. Зрештою, на графічний об'єкт довільного типу вказує властивість Picture. Graphic.

Об'єкт Pictureта його властивості Bitmap, Icon, Metafileі Graphicмають методи файлового читання та запису LoadFromFileі SaveToFile:

procedure LoadFromFile ( const FileName: string);

procedure SaveToFile ( const FileName: string);

Для властивостей Picture. Bitmap, Picture. Iconі Picture. Metafileформат файлу має відповідати класу об'єкта: бітовій матриці, піктограмі, метафайлу. При читанні файлу якість Picture. Graphiсфайл повинен мати формат метафайлу. А для самого об'єкту Pictureметоди читання та запису автоматично підлаштовуються під тип файлу. Пояснимо це з прикладу.

Давайте побудуємо додаток, аналогічний до розглянутого в розділі 4.2 прикладу перегляду графічних файлів. Для різноманітності можна організувати керування ним не кнопкою Button, а меню. Помістіть на форму компонент Image. Розтягніть його або задайте його властивість Alignрівним alClientщоб він зайняв всю клієнтську область форми. Перенесіть на форму компонент діалогу відкриття графічного файлу OpenPictureDialog(Див. розділ 8.2 ). Помістіть також форму компонент головного меню MainMenu(Див. розділ 6.1 ) і задайте в ньому один розділ - Файл. В обробнику цього розділу напишіть оператор

(OpenPictureDialog1. Execute) then. Picture. LoadFromFile (. FileName);

Цей оператор викличе діалог відкриття графічного файлу (див. рис.4.4) та завантажить у компонент Image1зображення із вибраного користувачем файлу (див. рис.4.5). Файл може бути будь-якого типу: бітова матриця, піктограма або метафайл.

У цьому додатку метод LoadFromFileзастосований до Image1. Picture. Якщо будуть відкриватися лише файли бітових матриць, то оператор завантаження файлу можна замінити на

Picture. Bitmap. LoadFromFile (. FileName);

Для піктограм можна було використовувати оператор. Picture. Значок. LoadFromFile (. FileName);

а для метафайлів – оператор. Picture. Metafile. LoadFromFile (. FileName);

або. Picture. Graphic. LoadFromFile (. FileName);

Але у всіх цих випадках, якщо формат файлу не збігатиметься з передбачуваним, виникне помилка. Аналогічно працює і метод SaveToFileз тією відмінністю, що застосований до Pictureабо до Picture. Graphicвін зберігає у файлі зображення будь-якого формату. Наприклад, якщо ви доповните свою програму діалогом SavePictureDialog(Див. розділ 8.2 ), введіть в меню розділ Зберегти як і його обробник помістіть оператор

SavePictureDialog1. Execute then. Picture. SaveToFile (SavePictureDialog1. FileName);

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

Абсолютно ідентично для зображень будь-якого формату працюватиме програма, якщо оператор збереження ви заміните на

Picture. Graphic. SaveToFile (. FileName);

використовує властивість Picture. Graphic. А якщо вам відомий формат, що зберігається в компоненті Imageзображення, то ви можете застосувати метод SaveToFileдо властивостей Picture. Bitmap, Picture. Iconі Picture. Metafile.

Для всіх розглянутих об'єктів Picture, Picture. Bitmap, Picture. Iconі Picture. Metafileвизначено методи присвоєння значень об'єктів:

Assign (Source: TPersistent);

Однак, для BitMap, Iconі Metafileнадавати можна лише значення однорідних об'єктів: відповідно бітових матриць, піктограм, метафайлів. При спробі присвоїти значення різнорідних об'єктів генерується виняток ЕConvertError. Об'єкт Picture- Універсальний, йому можна надавати значення об'єктів будь-яких з інших трьох класів. А значення Pictureможна надавати тільки тому об'єкту, тип якого збігається з типом об'єкта, що зберігається в ньому.

Метод Assignможна використовувати для обміну зображеннями з буфером Clipboard. Наприклад, оператор

Assign (Image1. Picture);

занесе в буфер обміну зображення, що зберігається в Image1. Аналогічно оператор

графіка delphi зображення додаток

Image1. Picture. Assign (Clipboard);

прочитає в Image1зображення, що знаходиться у буфері обміну. Причому, це може бути будь-яке зображення і навіть текст.

Треба тільки не забути під час роботи з буфером обміну вставити в оператор usesвашого модуля посилання на модуль Clipbrd. Автоматично Delphi це посилання не вставляє.

Повертаючись до властивостей компонента Image, можна відзначити один недолік, властивий нашому тестовому додатку, наведеному на рис.4.5 При завантаженні різних зображень розмір вікна програми може виявитися або занадто маленьким, і тоді ви побачите тільки частину зображення, або занадто великим, і тоді зображення буде негарно розміщено у лівому верхньому куту форми, залишаючи багато порожнього простору. Цей недолік можна усунути, якщо скористатися властивостями Height(висота) та Width(ширина) компонента Image. За властивості AutoSizeвстановленому в trueрозміри Imageавтоматично встановлюються рівними розмірами завантаженого зображення. І цими розмірами можна скористатися для зміни розмірів форми. Наприклад, наведений раніше код завантаження зображення з файлу можна замінити наступним:

OpenPictureDialog1. Execute then

begin. Picture. LoadFromFile (. FileName);. ClientHeight: = Image1. Height+10; Top: = Form1. ClientRect. Top

+ (Form1. ClientHeight - Image1. Height) div 2;. ClientWidth: = Image1. Width+10; Left: = Form1. ClientRect. Left

+ (Form1. ClientWidth - Image1. Width) div 2;

end;

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

Компонент Shape

Компонент Shapeлише умовно може бути віднесений до засобів відображення графічної інформації, оскільки просто є різноманітними геометричними фігурами, відповідним чином заштриховані. Основна властивість цього компонента - Shape(форма), яке може набувати значень:

Приклади цих форм показано на рис.4.7

Інша істотна властивість компонента - Brush(пензлик). Ця властивість є об'єктом типу TBrush, що має ряд під властивостей, зокрема: колір ( Brush. Color) та стиль ( Brush. Style) заливання фігури. Заливка при деяких значеннях Styleви можете бачити на рис.4.7 Третє зі специфічних властивостей компонента Shape - Pen(Перо), що визначає стиль ліній. Ця властивість, як і властивість Brush, вже розглядалися у розділі 4.2 . Довідкові дані про ці властивості можна знайти в розділі 10 * .

Компонент Chart

Тепер розглянемо компонент Chart. Цей компонент дозволяє будувати різні діаграми та графіки, які виглядають дуже ефектно (рис.4.8). Компонент Chartмає безліч властивостей, методів, подій, тому якщо всі їх розглядати, то цьому довелося б присвятити цілу главу. Тому обмежимося розглядом лише основних характеристик Chart. А з рештою ви можете ознайомитись у вбудованій довідці Delphi або просто випробувати їх, експериментуючи з діаграмами.

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

Розмістіть один або два (якщо захочете відтворити рис.4.8) компонента Chartна формі і подивіться властивості, що відкрилися в Інспекторі Об'єктів. Наведемо пояснення деяких із них.

Поряд з багатьма з перерахованих властивостей в Інспекторі Об'єктів розташовані кнопки з трьома крапками, які дозволяють викликати ту чи іншу сторінку Редактора Діаграм - багатосторінкового вікна, що дозволяє встановити всі властивості діаграм. Виклик Редактора Діаграм можливий також подвійним клацанням на компоненті Chartабо клацанням на ньому правою кнопкою миші та вибором команди Edit Chart у спливаючому меню.

Якщо ви хочете спробувати відтворити програму, показану на рис.4.8, зробіть подвійне клацання на верхньому компоненті Chart. Ви потрапите у вікно редактора діаграм (рис.4.9) на сторінку Chart, яка має кілька закладок. Насамперед вас буде цікавити на ній закладка Series. Клацніть на кнопці Add – додати серію. Ви потрапите у вікно (рис.4.10), у якому ви можете вибрати тип діаграми чи графіка. В даному випадку виберіть Pie – кругову діаграму. Скориставшись закладкою Titles, ви можете задати заголовок діаграми, закладка Legend дозволяє задати параметри відображення легенди діаграми (списку позначень) або взагалі прибрати її з екрана, закладка Panel визначає вид панелі, на якій відображається діаграма, закладка 3D дає вам можливість змінити зовнішній виглядвашої діаграми: нахил, зсув, товщину і т.д.

Коли ви працюєте з Редактором Діаграм та вибрали тип діаграми, у компонентах Chartна вашій формі відображається її вигляд із занесеними до неї умовними даними (див. рис.4.11).

Тому ви відразу можете спостерігати результат застосування різних опцій до вашої програми, що дуже зручно.

Сторінка Series, також має ряд закладок, дає можливість вибрати додаткові характеристикивідображення серії. Зокрема, для кругової діаграми на закладці Format корисно включити опцію Circled Pie, яка забезпечить за будь-якого розміру компонента Chartвідображення діаграми у вигляді кола. На закладці Marks кнопки групи Style визначають, що буде написано на ярликах, що належать до окремих сегментів діаграми: Value – значення, Percent – ​​відсотки, Label – назви даних тощо. У прикладі рис.4.8 включено кнопку Percent, a на закладці General встановлений шаблон відсотків, що забезпечує відображення тільки цілих значень.

Ви можете, якщо хочете, додати цей компонент Chartще одну тотожну серію, натиснувши на закладці Series сторінки Chart кнопку Clone, а потім для цієї нової серіїнатиснути кнопку Change (змінити) та вибрати інший тип діаграми, наприклад Bar. Звичайно, два різних типівдіаграми на одному малюнку виглядатимуть погано. Але ви можете вимкнути індикатор цієї нової серії на закладці Series, а потім надати користувачеві вибрати той чи інший вид відображення діаграми (нижче буде показано, як це робиться).

Вийдіть із Редактора Діаграм, виділіть у вашому додатку нижній компонент Chartі повторіть завдання властивостей за допомогою Редактора Діаграм. В даному випадку вам потрібно буде задати дві серії, якщо хочете відображати на графіку дві криві та вибрати тип діаграми Line. Оскільки мова йдепро графіки, ви можете скористатися закладками Axis та Walls для завдання координатних характеристик осей та тривимірних граней графіка.

На цьому проектування зовнішнього вигляду програми завершується. Залишилось написати код, який задає дані, які ви хочете відображати. Для тестової програми давайте поставимо в круговій діаграміпросто деякі константні дані, а графіках - функції синус і косинус.

Для завдання значень, що відображаються, треба використовувати методи серій Series. Зупинимося лише з трьох основних методах.

Метод Clearочищає серію від занесених раніше даних.

Метод Add:

(Const AValue: Double; Const ALabel: String;: TColor)

дозволяє додати до діаграми нову точку. Параметр AValueвідповідає значення, що додається, параметр ALabel- назва, яка відображатиметься на діаграмі та в легенді, AColor- Колір. Параметр ALabel- не обов'язковий, його можна поставити порожнім: "".

Метод AddXY:(Const AXValue, AYValue: Double;ALabel: String; AColor: TColor)

дозволяє додати нову точку до графіка функції. Параметри AXValueі AYValueвідповідають аргументу та функції. Параметри ALabelі AColorті ж, що й у методі Add.

Таким чином, процедура, що забезпечує завантаження даних у нашому прикладі, може мати вигляд:

155;=251;=203;=404;

var: Word;

begin Series1 do

begin;(A1, "Цех 1", clYellow);(A2, "Цех 2", clBlue);(A3, "Цех 3", clRed);(A4, "Цех 4", clPurple);

end;. Clear;. Clear;

for i: =0 to 100 do

begin. AddXY (0.02 * Pi * i, sin (0.02 * Pi * i), "", clRed);. AddXY (0.02 * Pi * i, cos (0.02 * Pi * i), "", clBlue);

Якщо ви передбачили, наприклад, для даних, що відображаються у діаграмі, дві серії Series1і Series4різних видів - Pieі Bar, то можете ввести процедуру, яка змінює на вимогу користувача тип діаграми. Цю процедуру можна ввести в подію OnClickбудь-якої кнопки, в команду меню або, наприклад, просто в обробку клацання на компоненті Chart. Для того, щоб завантажити дані в Series4і зробити цю діаграму в перший момент невидимою, можна вставити наприкінці наведеної раніше процедури оператори

Assign (Series1);. Active: = false;

Перший із цих операторів переписує дані, поміщені в Series1, у серію Series4. А другий оператор робить невидимою серію Series4. Зміна типу діаграми здійснює процедура

Active: = not Series1. Active;. Active: = not Series4. Active;

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

Бібліотека візуальних компонентів (англ. Visual Component Library, VCL) Delphi для відображення графічної інформації надає нам такі візуальні компоненти: Image (зображення), PaintBox (вікно для малювання), DrawGrid (таблиця малюнків), Chart (діаграми та графіки), Animate ( виведення відеокліпів), а також форма Form. Ці компоненти мають властивість Canvas (про нього розказано вище), який дає доступ до кожного пікселя. Звичайно, малювати попіксельно для роботи з графікою Delphi не доводиться, система Delphi надає потужні засоби роботи з графікою.

Розглянемо наведені вище компоненти докладніше:

Компонент Image (зображення)

Є об'єктом класу TImage. Використовується для виведення на екран зображень, які зчитуються з графічних файлів. За умовчанням виводить на поверхню форми зображення представлених у форматі *.bmp. Для виведення зображень у форматі jpg необхідно в дерективі uses підключити модуль JPEG. Знаходиться у вкладці Additional Палітри компонентів.

Після розміщення на формі компонента Image, він набуває вигляду виділеної прямокутної області.

Малюнок 9 - Компонент Image на формі

Для відкриття діалогу для вибору потрібного зображення необхідно виконати наступне за допомогою Object Inspector. Для цього знаходимо властивість Picture та ліворуч від нього натискаємо на три точки. Відкривається вікно Picture Editor і в ньому вибираємо завантажити (Load), у вікні вибираємо файл зображення.

Також це можна здійснити програмно шляхом виклику методу LoadFromFile властивості Picture:

Image1.Picture.LoadFromFile("name_pic.jpeg") ;

де name_pic.jpeg – ім'я файлу.

Таблиця 8 – Основні властивості компонента Image

Приклад 1: Написати програму для перегляду зображень за допомогою компонента Image. Програма повинна мати такі можливості:

• · Переглядати зображення, що знаходяться в папці;
• · Переглядати зображення в повному розміріабо у форматі, що найбільше підходить для розмірів вікна;
• · керувати файлами зображень, а також друкувати, зберігати, видаляти та змінювати зображення;
• · При необхідності відкривати зображення у програмі редагування;

Рисунок 10 – Вікно програми до її запуску

Створення проекту:

• 1. Створити папку для файлів програми та запустити інтегроване середовище розробки Delphi.
• 2. Додати на форму компоненти:

Спочатку на формі розмістимо компонент Image, основний компонент з яким нам доведеться працювати. Крім нього, нам знадобляться такі компоненти:

• · ScrollBox Він необхідний у разі, коли у повнорозмірному режимі зображення вийде за межі Image. Його властивості Aling присвоюємо значення alClient щоб його розміри змінювалися пропорційно з розмірами вікна. І на ньому розміщуємо компонент Image;
• · Також додамо компоненти-діалоги SavePictureDialog та OpenPictureDialog, призначені для збереження та відкриття зображень. Перший нам необхідний для копіювання зображення до вибраної директорії, друга - для виклику діалогу відкриття графічного файлу. Розташовані вони на сторінці Dialogs Палітри компонентів. Ще з цієї сторінки нам знадобиться компонент PrintDialog, необхідний для виклику діалогу вибору принтера для друку.
• · Додамо MainMenu для додавання до програми головного меню та XPManifest для більш барвистого оформлення
• · Також нам необхідно десь зберігати імена зображень, що лежать у робочій директорії. Для цього зручний компонент ListBox, який при обробці події Create форми Form1 можна приховати.
• · Для розміщення кнопок навігації та зручної роботиз ними додамо панель Veil, на якій і розмістимо ці кнопки (Попереднє зображення, Наступне зображення, Справжній розмір, Підігнати розмір, Видалити, Копіювати, Друк, Редагувати). Як компонент для них вибраний SpeedButton.
• · Додаємо таймер для вилову натискань клавіш «Вліво» (попереднє зображення), «Вправо» (наступне зображення) та клавіші «Del» (видалення зображення).
• · І ще один компонент - ProgressBar, що відображає процес завантаження великих файлів.
• 3. Написати код обробки події натискання на кнопки (Попереднє зображення, Наступне зображення, Справжній розмір, Підігнати розмір, Видалити, Копіювати, Друк, Редагувати). Написати код обробки події натискання на пункти меню MainMenu (Вихід, Відкрити, Закрити, Створити).
• 4. Встановити початкові установки створення форми. Двічі клацнути мишею на вільне місце форми і написати код процедури procedure TForm1.FormCreate(Sender:TObject), див. код модуля в Додатку 1.
• 5. Написати процедури такого виду:

procedure FindFileInFolder(path, ext: string);

Ця процедура сканує папку path на наявність файлів за маскою ext.

Повний листинг коду модуля програми міститься у Додатку 1 (Лістинг програми 3).

• 1. Перерахуйте можливості компонента Image.
• 2. Об'єктом якого класу є компонент Image?
• 3. 3. Який тип файлів підтримує компонент Image?
• 4. 4. Перелічіть основні властивості компонента Image.
• 5. 5. Яка властивість зберігає зображення компонента Image?

«Відображення графічної інформації в Delphi» План теми: 1.С З пппп оооо сссс оооо бббб ыыыы в вв ыыыы вввввоооо дддд аааа г г гррррааа фффф ииии чччйй фф оооо рррр мммм аааа ццц ииии ииии в в в D D D D eeee llll pppp hhhh iiii О О тттт оооо бббб рррр аааа жжжж їїїї нннн ииииеее до к к аааа рррр тттт иио ннн ааа жжжж їїїї нннн ііііїїї г г г г їїеооо мммм ееее тттт рррр ииии чччч ееее сссс кккк ииии хххх фффф ииии гггг уууу рррр в і і і і д д д д ІІІІ аааа рррррррр аааа мммм мммм.

1. Методи виведення графічної інформації. У Delphi існує кілька способів виведення графічної інформації: Висновок заздалегідь приготовлених зображень (компоненти Image, Shape); П Побудова графіків та діаграм (компонент Chart та ін.); Ф Формування зображень програмним способом(Об'єкт Canvas).

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

3. Відображення 3. Відображення геометричних фігур. І з кількох компонентів Shape можна створювати нескладні малюнки. П Програмно змінюючи положення (. Left,. Top) розмір (. Width,. Height) і колір (Brush. Color) компонентів Shape в малюнку можна здійснити елементи найпростішої анімації. Р Р Р Р аааа сссс сссс мммм оооо тттт рррр їїїї ттттьььп п п пррррііііі мммм їїїї рррр.

4.Побудова 4.Побудова графіків та діаграм. Діаграми призначені для наочнішого представлення масивів чисельних даних, їх візуального відображення та аналізу. ПППП рррр ииии мммм ееее рррр.... Для побудови діаграм у Delphi є кілька компонентів, одне із них компонент Chart (розділ TeeChart Std).

Графіків та діаграм. Дані для відображення зазвичай передаються Chart програмно, приклад: Series1.Clear; (очистити серію) for i:=1 to N do Series1.addxy(i, A[i], clGreen); Значення по осі X Значення по осі Y Підпис по осі X Колір даних на діаграмі РР аааа сссс сссс мммм оооо тттт рррр їїїї тттт ььь п п п прррріііі мммм їїєї рррр п п оооо сссс тттрр рррр аааа фффф ииии кккк аааа фф ф ф фуууу ннннн кккк цццц ииііііііі y y y y y = = = = S S S S iiiii nnnn (((((xxxx))))

Далі: Лабораторна робота ««« ТОВО тттт оооо бббб рррр аааа жжжж ееее нннн ииии ееее к к к аааа рррр тттт ииии нннн оооо кккк і до ІІІ хххх фффф ииии гггг уууу рррр, и и и и хххх а а а ннннииииии мммм аааа ццц ииии яяяяя»»»»....Завдання: 1) Розробити додаток для здійснення найпростішої анімації шляхом періодичної зміни відображуваної картини. (Кількість картинок не менше трьох, картинки підібрати самостійно).

Далее: Лабораторная работа «««« ПППП оооо сссс тттт рррр оооо ееее нннн ииии ееее г г г г рррр аааа фффф ииии кккк оооо вввв и и и и д д д д ииии аааа гггг рррр аааа мммм мммм »»»».. ..Завдання: 1)М одіфікувати додаток з лабораторної роботи 9 (Відображення даних у таблиці). Додати можливість відображення деяких даних із таблиці на гістограмі або круговій діаграмі. 2) Побудувати графік заданої функції.

Опис презентації з окремих слайдів:

1 слайд

Опис слайду:

2 слайд

Опис слайду:

Середа візуального програмування Delphi, як і Windows, підтримує графічний інтерфейс користувача (GDI – Graphic Delphi Interface). У Delphi існує два способи виведення графічної інформації: виведення заздалегідь підготовлених зображень; малювання із програми.

3 слайд

Опис слайду:

Перший спосіб заснований на використанні компонентів Image та Shape. Можна скористатися готовою картинкою (піктограмою) або створити їх самостійно, використовуючи Редактор Image Editor. Другий спосіб це формування зображень програмним способом, використовуючи об'єкт Canvas.

4 слайд

Опис слайду:

Delphi має у своєму розпорядженні спеціальний об'єкт, який оформлений у якості Canvas. Воно доступне лише під час роботи програми, так що керувати ним можна лише з програми, написавши потрібний кодмовою Object Pascal. Якщо об'єкт має властивість Canvas, на його поверхні можна малювати. Найбільш підходящими кандидатами на цю роль є сама форма і спеціальний компонент PaintBox.

5 слайд

Опис слайду:

Об'єкт Canvas Властивості: Pen (Перо) – властивість для малювання ліній та меж геометричних фігур. Перо слідує командам графічного курсору і, своєю чергою, має свої вкладені властивості: Color – визначає колір лінії (за умовчанням чорний); Mode – стиль малювання (має безліч значень, які тут не наводяться); Style – стиль лінії, який може набувати значень: рsSolid – суцільна (за замовчуванням); рsDosh - штрихова; рsDot – пунктирна; рsDoshDot - штрих пунктирна (та ін. властивості); Widh – товщина лінії (за замовчуванням 1 піксель);

6 слайд

Опис слайду:

Brush (Пензель) – властивість для заповнення фігур, що мають такі вкладені властивості: Color – колір пензля (за замовчуванням – білий); Style – орнамент пензля, який може набувати значень: bsClear – суцільна розмальовка; bsHorizontal - горизонтальні лінії; bsVertical – вертикальні лінії; bsFDiagonal – ліві діагональні лінії; bsBDiagonal – праві діагональні лінії; bsCross – клітина; bsDiagCross - коса клітина;

7 слайд

Опис слайду:

Font (Шрифт) – властивість виведення тексту, має такі вкладені властивості: Color – колір символів; Height – висота шрифту в пікселях; Name – ім'я шрифту; Size – розмір шрифту; Style – стиль шрифту, який може набувати таких значень: fsBold – напівжирний; fsItalic - курсив; fsUnderline – підкреслений; fsStrikeOut – перекреслений;

8 слайд

Опис слайду:

PenPos (Позиція пера) – властивість для зберігання поточної позиції малювання (визначає положення пера в області малювання на даний момент); Pixels – властивість-масив для запису та зчитування координат окремих точок області малювання («полотна»).

9 слайд

Опис слайду:

Методи об'єкта Canvas MoveTo(x,y: integer) –переміщає перо з поточної позиції в точку із заданими координатами х, без малювання лінії; LineTo(х.у: integer) -переміщає перо з поточної позиції в точку із заданими координатами х, з прочерчиванием лінії; Arc (х1, у1, х2, у2, х3, у3, х4, у4: integer) - Малює дугу еліпса, вписаного в прямокутник з координатами (х1, у1) і (х2, у2). Дуга визначається радіусами еліпса, що проходять через точки (х3, у3) та (х4, у4);

10 слайд

Опис слайду:

Chord (х1, у1, х2, у2, х3, у3, х4, у4: integer) - малює хорду еліпса за описом, наведеним для методу Arc; Ellipse (х1, у1, х2, у2: integer) - малює еліпс, вписаний у прямокутник з лівим верхнім кутому точці (х1, у1) та нижнім правим кутом у точці (х2, у2); FillRect(Rect (х1, у1, х2, у2: integer)) – заповнює прямокутник кольором, заданим у поточному пензлі (Brush). Використовує функцію Rect, яка представляє прямокутник із заданими координатами;

11 слайд

Опис слайду:

FloodFill(х,у: integer; Color: TColor; FillStyle: TFillStyle) – заповнення поточним кольором, заданим у властивості Brush: при FillStyle=fsBorder – замкнутій області від точки з координатами х, у до межі, визначеної кольором Color; при FillStyle=fsSurface – та ділянка поверхні, яка має колір Color; Pie (х1, у1, х2, у2, х3, у3, х4, у4: integer) - малює сектор еліпса, вписаного в прямокутник з координатами (х1, у1) і (х2, у2). Сектор визначається двома радіусами еліпса, що проходять через точки (х3, у3) та (х4, у4);

12 слайд

Опис слайду:

Polyline (Points: array of TPoint) - малює ламану лінію, послідовно з'єднуючи точки масиву Points; Polygon (Points: array of TPoint) – викреслює багатокутники, послідовно з'єднуючи точки масиву Roints. Відрізняється від методу Polyline тим, що автоматично з'єднує кінець ламаної з її початком; Rectangle (х1, у1, х2, у2: integer) – малює прямокутник з лівим верхнім кутом у точці (х1, у1) та нижнім правим кутом у точці (х2, y2);

13 слайд

Опис слайду:

Retresh – метод викликається за необхідності перемальовування зображення; RoundRect (х1, у1, х2, у2, х3, у3: integer) - малює прямокутник із закругленими кутами. Кути малюються як чверті еліпса із шириною х3 та висотою у3; TextOut (х, у:integer, Text:String) – виведення тексту, вказаного у параметрі Text. Текст вписується у прямокутник, верхній лівий кут якого має координати х, у.

Тема :
Ціль лабораторної роботи Delphi.

Студенти повинні навчитися:

• Створювати графіки

Теоретична частина

Shape Brush

Image:

Chart:

Метод Clear

Метод Add

Метод AddXY

PaintBox:

Завдання 1

Завдання 2

Завдання 3

with PaintBox1, canvas do

Brush.Color: = clRed;

Pen.Color:= clGreen;

Pen.Style: = psDash;

Pen.Color: = clRed;

Пояснення:

Завдання 4

Var i:integer;

Series1.Clear;

for i:=0 to 22 do

Series1.AddXY(i*0.29,10*sin(i*0.29),”,clGreen);,де i*0.29 (AXValue)це аргумент, а 10* sin(i*0.29) (AYValue)

1. y=3.2*(14*x)
2. y=sin(x)
3. y=cos(x)
4. y=x 2 +cos(x)
5. y=x 2 -4.5*4

Завдання 5

with ComboBox1 do begin

Items:=Screen.Fonts;

1. Збережіть та запустіть проект.

1. Завдання на роботу.
2. Вставити код, написаний вами
3. Висновок про виконану роботу. Тема : Використання графічних можливостей.

   Ціль лабораторної роботи- Познайомитись з графічними можливостями Delphi.

   Студенти повинні навчитися:

   • Створювати будь-які графічні штуки J
   • Використовувати графічні можливості
   • Застосовувати графічні можливості
   • Створювати графіки

   Теоретична частина

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

   Піктограма	Назва	Сторінка	Призначення
   	Image (зображення)	Additional	Використовується для відображення графіки: піктограм, бітових зображень та метафайлів
   	Shape (форма)	Additional	Використовується для побудови геометричних примітивів
   	DrawGrid (Таблиця малюнків)	Additional	Використовується для створення таблиці, яка може містити графічні зображення.
   	Chart (діаграми та графіки)	Additional	Використовується для створення діаграм та графіків
   	PaintBox (Вікно для малювання)	System	Використовується для створення на формі деякої галузі, в якій можна малювати

   Крім того, відображати та вводити графічну інформацію можна на поверхні будь-якого віконного компонента, що має властивість Canvas. Малюнки, створювані під час виконання програми, може бути як нерухомими, і анімованими.

   Shape : тільки умовно може бути віднесений до засобів відображення графічної інформації, оскільки просто є різні геометричні фігури, відповідним чином заштриховані. Основна властивість цього компонента - Shape (форма), яка може набувати значення, Brush(Пензель) – це властивість є об'єктом типу TBrush, що має ряд підвластивостей, зокрема: колір (Brush.Color) і стиль (Brush.Style) заливки фігури. Третя зі специфічних властивостей компонента Shape - Pen (перо), що визначає стиль ліній.

   Image: основні властивості: Picture – відповідає за завантаження зображення, Stretch – відповідає за розмір зображення у компоненті Image, AutoSize – відповідає за розмір компонента, у якому було завантажено зображення з урахуванням розміру зображення.

   Chart: Для завдання значень необхідно використовувати методи серій Series. Розглянемо три з них.

   Метод Clearочищає серію від занесених раніше даних.

   Метод Add: – Add(Const AValue: Double; Const ALabel: String; AColor: TColor)

   дозволяє додати до діаграми нову точку. Параметр AValue відповідає значенням функції, що додається, а значення аргументу функції заповнюється автоматично, тому його задавати не потрібно, параметр ALabel - назва, яка буде відображатися на діаграмі і в легенді, AColor - колір. Параметр ALabel не є обов'язковим, його можна задати порожнім: ”.

   Метод AddXY- AddXY (Const AXValue, AYValue: Double; Const ALabel: String; AColor: TColor)

   дозволяє додати нову точку до графіка функції. Параметри AXValue та AYValue відповідають аргументу та функції. Параметри ALabel і AColor самі, що у методі Add.

   PaintBox: перебувати на сторінці System. Він представляє собою просте вікно з канвою, де можна малювати довільні зображення. Графічні інструменти містяться у властивостях Font, Brush та Pen. Канва (полотно) міститься у властивості Canvas компонента. Саме малювання програмується в обробнику події onPaint.

   Завдання 1

   1. Створити програму, яка знайомить вас із компонентом Image. Необхідно розмістити компоненти: Label, Image, BitBtn, Button. Підписати як на зображенні та завантажити будь-яке зображення. Налаштуйте компоненти, щоб у Image1 зображення входило у рамки, а Image2 зображення відповідало своєму розміру. Зробіть спливаючі підказки, при наведенні на кожне зображення властивість Hint відповідає за підказки, для відображення потрібно ввести текст і включити підказки у властивості ShowHint.

   Завдання 2

   1. Збільшити розмір форми і додати компоненти: Shape, Label. Підписати.
   2. Кожному компоненту Shape застосувати свої стилі відповідно до зображення:

   Завдання 3

   1. Наприклад, розташуємо компонент PaintBox на форму. Обробник onPaint:

   with PaintBox1, canvas do

   Brush.Color: = clRed;

   Pie(12,100,140,280,12,100,140,280);

   Pen.Color:= clGreen;

   Pen.Style: = psDash;

   Rectangle(120,60,Width,Height);

   Pen.Color: = clRed;

   Polyline();

   TextOut(75,20,'Тут може бути Ваш текст!');

   Пояснення:Перший рядок задає колір заповнення: Brush.Color: = clRed; Друга малює частину еліпса: Pie(12,100,140,280,12,100,140,280); Наступні рядки задають параметри пера (яка буде окантовка у фігур), ширину, колір та стиль лінії: Pen.Width: = 4; Pen.Color:= clGreen; Pen.Style: = psDash; Але в даному випадку ми будемо бачити одну суцільну лінію, тому що при товщині більше одного пікселя стиль ліній буде psSolid (суцільний). За промальовування квадрата відповідає наступний рядок: Rectangle (120, 60, Width, Height); Червону зірочку малює наступна команда: Polyline(); За виведення тексту відповідає останній рядок: TextOut(75,20, Тут може бути Ваш текст!);

   Завдання 4

   1. Зробити програму, яка будує заданий графік функції y = 10 * sin (x)

   1. Збільшити у розмірах форму та помістити на неї компонент TСhart із вкладки Additional, та розмістити компонент Button, Label. Розтягнути новий TСhart до зручного для розробки розміру.
   2. Заходимо до редактора графіків подвійним натисканням на компонент. Редагуємо та налаштовуємо зовнішній вид Series. Для цього натискаємо Add та вибираємо тип графіка Line та тиснемо ОК. Для зміни заголовка натиснути Title і ввести формулу y=10*sin(x).
   3. Прописати код для викреслення графіка у події OnClick компонента Button:

   Var i:integer;

   Series1.Clear;

   for i:=0 to 22 do

   Series1.AddXY(i*0.29,10*sin(i*0.29),”, clGreen);

   Пояснення: метод Series1.Clear; очищає серію від занесених раніше даних, щоб за оновлення був старих значень. Для малювання графіка необхідні значення, у нашому випадку 22 значення, при яких відбувається промальовування графіка функцією Series1.AddXY(i*0.29,10*sin(i*0.29),”,clGreen);,де i*0.29 (AXValue)це аргумент, а 10* sin(i*0.29) (AYValue)значення обчислення функції, ” (ALabel) назву, що відображатиметься на діаграмі та в легенді, можна залишити порожнім, і clGreen (AColor) – колір ліній.

   1. Самостійно виконати таке завдання: намалювати графік функцій
   2. y=3.2*(14*x)
   3. y=sin(x)
   4. y=cos(x)
   5. y=x 2 +cos(x)
   6. y=x 2 -4.5*4

   Завдання 5

   1. Створіть програму, яка дозволяє переглядати символи системних шрифтів.
   2. Збільшити у розмірах форму, розмістити DrawGrid1, ComboBox1, Label. Налаштуйте компонент DrawGrid1 наступні властивості: RowCount=7, ColCount=32, FixedCols=0, FixedRows=0, DafaultColWidth=20, DefaultRowHeight=20.
   3. Для того, щоб вміст кожної комірки перемальовувався, створіть обробник події OnDrawCell для DrawGrid1. Для зображення символів шрифту скористаємось властивістю Canvas компонента DrawGrid1. Саме нам знадобиться спосіб TextRect якості Canvas. Цей метод використовується для виведення текстової інформаціїу певному осередку. Обробник події виглядатиме так:

   DrawGrid1.Canvas.textrect(rect, Rect.Left, Rect.Top, char ((ARow+1)*32+acol));

   1. Збережіть проект. Переконайтеся, що в осередках таблиці відображаються символи системного шрифтуза промовчанням.
   2. Для вибору шрифту скористаємося компонентом ComboBox1. Для того, щоб цей компонент містив усі екранні шрифти, треба при створенні форми занести їх до списку. Назви всіх екранних шрифтів можна дізнатися за допомогою глобальної змінної Screen типу TScreen. Ця змінна автоматично додається до всіх програм Delphi. Змінна Screen містить інформацію про поточний стан екрана програми: назви форм та модулів даних, що використовуються програмою; дані про активну форму та компоненти, що використовуються цією формою; розмір і роздільна здатність використовуваного екрана; інформацію про доступних додаткукурсори та шрифти. Інформація про доступні додатку шрифти міститься у властивості Font, що належить змінній Screen.
   3. Створіть для форми обробник події onCreate та внесіть до нього оператори:

   with ComboBox1 do begin

   Items:=Screen.Fonts;

   ItemIndex:=Items.IndexOf(Font.Name);

   1. Збережіть та запустіть проект. Компонент DrawGrid1 містить символи шрифту, встановленого ComboBox1.
   2. Щоб зв'язати значення імені шрифту у DrawGrid1 і ComboBox1, створимо ще один обробник події:

   DrawGrid1.Font.Name:=ComboBox1.Text;

   1. Збережіть та запустіть проект.
   1. Номер, тема, ціль лабораторної роботи.
   2. Завдання на роботу.
   3. Опис вхідних, проміжних та результуючих даних із зазначенням їх типу.
   4. Програма мовою програмування.
   5. Результат виконання програми (Введені дані та отримані дані)
   6. Вставити код, написаний вами
   7. Висновок про виконану роботу.