Sposoby wyświetlania informacji graficznych w delphi. Prezentacja na temat „Wyświetlanie informacji graficznych w Delphi”

slajd 2

"Wyświetlanie informacji graficznych w Delphi" Plan tematyczny: Sposoby wyświetlania informacji graficznych w Delphi. Wyświetlanie zdjęć. Wyświetlanie kształtów geometrycznych. Budowa wykresów i diagramów.

slajd 3

1. Metody wyświetlania informacji graficznych. Istnieje kilka sposobów wyświetlania informacji graficznych w Delphi: Wyjście wstępnie przygotowanych obrazów (obraz, komponenty kształtu); Budowa wykresów i diagramów (komponent wykresu itp.); Programowe tworzenie obrazów (obiekt Canvas).

slajd 4

Wyświetlanie zdjęć. Wyświetlanie obrazów za pomocą komponentu Image zostało omówione w jednym z poprzednich tematów. Tutaj rozważymy przykład realizacji najprostszej animacji poprzez okresową zmianę wyświetlanego obrazu w komponentach Image. Przejdź do przykładu.

zjeżdżalnia 5

Wyświetlanie kształtów geometrycznych. Wyświetlanie najprostszych kształtów geometrycznych na formularzu zapewnia składnik Shape.

zjeżdżalnia 6

Wyświetlanie kształtów geometrycznych. Główne właściwości komponentu Shape:

Slajd 7

Wyświetlanie kształtów geometrycznych. Możesz tworzyć proste rysunki z kilku komponentów Shape. Zmieniając programowo położenie (.Left, .Top), rozmiar (.Width, .Height) i kolor (Brush.Color) składników Shape na rysunku, można zaimplementować elementy najprostszej animacji. Rozważ przykład.

Slajd 8

Budowa wykresów i diagramów. Diagramy są przeznaczone do bardziej wizualnej reprezentacji tablic danych liczbowych, ich wizualnego wyświetlania i analizy. Przykład. Do budowy wykresów w Delphi jest kilka komponentów, jednym z nich jest komponent Chart (rozdział TeeChart Std).

Slajd 9

Budowa wykresów i diagramów. Widok komponentu Wykres po jego zainstalowaniu na formularzu:

Slajd 10

Budowa wykresów i diagramów. Oprócz „Inspektora obiektów” dostęp do właściwości komponentu Wykres można uzyskać poprzez otwarcie specjalnego okna dialogowego (prawy przycisk na komponencie \ Edytuj wykres…) Dodaj serię danych Zmień typ wykresu

slajd 11

Budowa wykresów i diagramów. Wybór typu wykresu:

zjeżdżalnia 12

Budowa wykresów i diagramów. Ustawianie właściwości dla osi współrzędnych (oś):

slajd 13

Budowa wykresów i diagramów. Dane do wyświetlenia są zwykle przekazywane do wykresu programowo, na przykład: Series1.Clear; (wyczyść szereg) dla i:=1 do N do Series1.addxy(i, A[i], '', clGreen); Wartość na osi X Wartość na osi Y Etykieta na osi X Kolor danych na wykresie Rozważmy przykład wykreślania funkcji y = Sin(x)

Slajd 14

Dalej: Laboratorium #13.1. „Wyświetlanie obrazów i kształtów geometrycznych, ich animacja”. Zadanie: 1) Opracować aplikację do realizacji najprostszej animacji poprzez okresową zmianę wyświetlanego obrazu w komponentach Image. (Liczba zdjęć to co najmniej trzy, wybierz zdjęcia samodzielnie).

zjeżdżalnia 15

Zadanie: 2) Wymyśl i narysuj obrazek z elementów Shape. Programistycznie zmieniając położenie, rozmiar lub kolor składników Shape na rysunku, zaimplementuj elementy najprostszej animacji.

zjeżdżalnia 16

Dalej: Laboratorium #12.2. „Wykresy i schematy budowlane”. Zadanie: Modyfikacja aplikacji z laboratorium 9 (Wyświetlanie danych w tabeli). Dodaj możliwość wyświetlania niektórych danych z tabeli na wykresie słupkowym lub kołowym. 2) Skonstruuj wykres danej funkcji.

Zobacz wszystkie slajdy

Opis prezentacji na poszczególnych slajdach:

1 slajd

Opis slajdu:

2 slajdy

Opis slajdu:

Wizualne środowisko programistyczne Delphi, podobnie jak Windows, obsługuje graficzny interfejs użytkownika (GDI - Graphic Delphi Interface). Istnieją dwa sposoby wyświetlania informacji graficznych w Delphi: wyjście wstępnie przygotowanych obrazów; rysunek z programu.

3 slajdy

Opis slajdu:

Pierwsza metoda opiera się na wykorzystaniu komponentów Image i Shape. Możesz użyć gotowego obrazka (piktogramu) lub stworzyć je samodzielnie za pomocą Edytora Obrazów. Drugim sposobem jest programowe generowanie obrazów przy użyciu obiektu Canvas.

4 slajdy

Opis slajdu:

Delphi ma do swojej dyspozycji specjalny obiekt, który jest sformatowany jako właściwość Canvas. Jest on dostępny tylko wtedy, gdy aplikacja jest uruchomiona, więc można nim sterować tylko z programu, pisząc niezbędny kod w języku Object Pascal. Jeśli obiekt ma właściwość Canvas, możesz rysować na jego powierzchni. Najbardziej odpowiednimi kandydatami do tej roli są sam formularz i specjalny komponent PaintBox.

5 slajdów

Opis slajdu:

Właściwości obiektu na płótnie: Pióro (Pióro) - właściwość do rysowania linii i granic geometrycznych kształtów. Pióro podąża za poleceniami kursora graficznego iz kolei posiada własne zagnieżdżone właściwości: Kolor - określa kolor linii (domyślnie czarny); Tryb - styl rysowania (posiada wiele wartości, których tutaj nie podano); Style – styl linii, który może przyjmować następujące wartości: psSolid – solid (domyślnie); psDosh - linia przerywana; psDot - linia przerywana; psDoshDot - przerywana kreska (i inne właściwości); Szerokość - grubość linii (domyślnie 1 piksel);

6 slajdów

Opis slajdu:

Brush (Brush) - właściwość do wypełniania kształtów, które mają następujące zagnieżdżone właściwości: Color - kolor pędzla (domyślnie - biały); Style – ozdoba pędzla, która może przyjmować następujące wartości: bsClear – kolorowanie jednolite; bsHorizontal - linie poziome; bsVertical - linie pionowe; bsFDiagonal - lewe linie ukośne; bsBDiagonal - prawe linie ukośne; bsCross - komórka; bsDiagCross - ukośna komórka;

7 slajdów

Opis slajdu:

Font (Font) - właściwość wyświetlania tekstu, która posiada następujące zagnieżdżone właściwości: Color - kolor znaków; Wysokość - wysokość czcionki w pikselach; Nazwa – nazwa czcionki; Rozmiar - rozmiar czcionki; Style — styl czcionki, który może przyjmować następujące wartości: fsBold — pogrubienie; fskursywa - kursywa fsUnderline - podkreślone fsStrikeOut - przekreślone;

8 slajdów

Opis slajdu:

PenPos (Pen position) - właściwość do przechowywania aktualnej pozycji rysowania (określa pozycję rysika w obszarze rysowania w danym momencie); Pixels - właściwość tablicy do zapisywania i odczytywania współrzędnych poszczególnych punktów obszaru rysowania ("canvas").

9 slajdów

Opis slajdu:

Metody obiektu Canvas MoveTo(x,y: integer) – przenosi pisak z aktualnej pozycji do punktu o podanych współrzędnych x,y bez rysowania linii; LineTo(х.у: integer) - przesuwa pisak z aktualnej pozycji do punktu o podanych współrzędnych x, y, rysując linię; Arc(x1, y1, x2, y2, x3, y3, x4, y4: integer) - rysuje łuk elipsy wpisanej w prostokąt o współrzędnych (x1, y1) i (x2, y2). Łuk wyznaczają promienie elipsy przechodzące przez punkty (x3, y3) i (x4, y4);

10 slajdów

Opis slajdu:

Chord(x1, y1, x2, y2, x3, y3, x4, y4: integer) – rysuje cięciwę elipsy zgodnie z opisem dla metody Arc; Ellipse(x1, y1, x2, y2: integer) - rysuje elipsę wpisaną w prostokąt z lewym górnym rogiem w punkcie (x1, y1) i prawym dolnym rogiem w punkcie (x2, y2); FillRect (Rect (x1, y1, x2, y2: integer)) - wypełnia prostokąt kolorem określonym w bieżącym pędzlu (Pędzel). Używa funkcji Rect, która reprezentuje prostokąt o podanych współrzędnych;

11 slajdów

Opis slajdu:

FloodFill(x,y: integer; Color: TColor; FillStyle: TFillStyle) — wypełnienie bieżącym kolorem określonym we właściwości Brush: with FillStyle=fsBorder — obszar zamknięty od punktu o współrzędnych x, y do granicy zdefiniowanej przez kolor kolor; z FillStyle=fsSurface – ten obszar powierzchni, który ma kolor Color; Pie(x1, y1, x2, y2, x3, y3, x4, y4: integer) - rysuje sektor elipsy wpisanej w prostokąt o współrzędnych (x1, y1) i (x2, y2). Sektor jest zdefiniowany przez dwa promienie elipsy przechodzące przez punkty (x3, y3) i (x4, y4);

12 slajdów

Opis slajdu:

Polyline (Points: array of TPoint) – rysuje polilinię łącząc kolejno punkty tablicy Points; Polygon (Points: array of TPoint) — rysuje wielokąty przez sekwencyjne łączenie punktów tablicy Points. Różni się od metody Polyline tym, że automatycznie łączy koniec polilinii z jej początkiem; Prostokąt (x1, y1, x2, y2: liczba całkowita) - rysuje prostokąt z lewym górnym rogiem w punkcie (x1, y1) i prawym dolnym rogiem w punkcie (x2, y2);

13 slajdów

Opis slajdu:

Retresh – metoda jest wywoływana, gdy obraz wymaga przerysowania; RoundRect (x1, y1, x2, y2, x3, y3: integer) — rysuje prostokąt z zaokrąglonymi rogami. Rogi są rysowane jako ćwiartki elipsy o szerokości x3 i wysokości y3; TextOut (x, y:integer, Text:String) - wyprowadza tekst określony w parametrze Text. Tekst mieści się w prostokącie, którego lewy górny róg ma współrzędne x, y.

PRACA LABORATORYJNA

TEMAT: « Grafika wDelfy- budowa najprostszej
figury geometryczne"

Krótka informacja z teorii

Delphi udostępnia programiście trzy sposoby wyświetlania grafiki:

    kreślenie podczas działania programu

    wykorzystanie gotowych grafik

    tworzenie obrazów z wykorzystaniem komponentów graficznych

Do kreślenia stworzono specjalne klasy, które udostępniają narzędzia i metody rysowania: narzędzia są opisane w trzech klasach - Tfont, Tpen, Tbrush; obszar rysowania i metody są dostarczane przez klasę Tcanvas.

KlasaCzcionka- ustala charakterystykę czcionki używanej do wyświetlania tekstu na płótnie. Właściwości klasy są opisane w sekcji „Właściwości podstawowe dostępne dla większości składników”.

Klasatpen– określa charakterystykę pisaka (ołówka), za pomocą którego rysowane są linie.

Nieruchomości klasa tpen:

kolor:Tcolor - kolor linii (domyślnie czarny)

Szerokość:integer – grubość linii w pikselach;

styl = (psSolid, psDash, psDot, psdashDot, psClear) - określa styl linii (ciągła, kreskowana, kropkowana, kreska-kropka, niewidoczna)

KlasaSzczotka– określa charakterystykę pędzla używanego do malowania powierzchni obrazu.

Nieruchomości klasa Szczotka:

kolor:Tcolor - kolor pędzla (domyślnie biały)

styl- ozdoba pędzla, może przyjąć następujące wartości:

BsSolid - solidna kolorystyka

BsClear - bez wypełnienia

BsVertical - linie pionowe

BsBdiagonal - prawe linie ukośne

BsDiagCross - ukośna komórka

BsHorisontal - linie poziome

BsFdiagonal - lewe linie ukośne

BsCross - komórka

Klasatekstylia- określa powierzchnię, na której umieszczany jest tworzony obraz oraz narzędzia, za pomocą których obraz jest tworzony: czcionka, ołówek, pędzel.

Domyślnie jako obszar roboczy używany jest cały obszar roboczy formularza (kanwa, „kanwa”) (bez tytułu, menu głównego i linii przewijania formularza), ale można przydzielić mniejsze obszary robocze wewnątrz formularza przy użyciu komponentów pudełko z farbą lub Obraz. Początkiem płótna jest lewy górny róg obszaru roboczego, szerokość obszaru roboczego określa właściwość Szerokość klienta, wzrost - własność Wysokość klienta.

Nieruchomości klasa tekstylia:

Płótno:Tcanvas - określa obszar rysowania

Szczotka:Tbrush - pędzel do malowania zamkniętych kształtów

Czcionka:Tfont - czcionka do wyświetlania tekstu na płótnie

Długopis:Tpen - ołówek (długopis) do rysowania

PenPos:Tpoint - aktualna pozycja niewidzialnego kursora na płótnie

Komentarz : Typ punktu - zdefiniowany w następujący sposób:

Wpisz Tpoint = zapis

Piksele: Tcolor - ustawia kolory pikseli kanwy, X, Y - współrzędne pikseli. Właściwość Piksele jest przydatna do kreślenia wykresów z wykorzystaniem punktów o wybranym kolorze.

Główne metody klasy TCanvas

    procedura Przenieś do(x,y:liczba całkowita); - przesuwa pisak bez rysowania linii do punktu o współrzędnych (x, y).

    procedura Linia do(x,y:liczba całkowita); - rysuje linię od aktualnego punktu do punktu o współrzędnych (x, y).

Przykład : Narysuj niebieską ukośną linię na kształcie od lewego górnego rogu kształtu do prawego dolnego rogu.

Pióro.kolor:= clniebieski;

PrzenieśDo(0,0); LineTo (szerokość klienta, wysokość klienta);

    procedura Prostokąt(x1,y1,x2,y2:liczba całkowita); - rysuje prostokąt: x1, y1 - współrzędne lewego górnego rogu; x2, y2 - współrzędne prawego dolnego rogu.

Przykład : Narysuj kwadrat o wymiarach 60 pikseli z żółtym wypełnieniem na środku kształtu.

var Xc,Yc: liczba całkowita; //

Xc:=Szerokość Klienta, dział 2;

Xy:=WysokośćKlienta, dział 2;

Płótno.Pędzel.kolor:=clyellow;

Płótno.prostokąt(xc-30,Yc-30,xc+30,Yc+30);

    procedura Elipsa(x1,y1,x2,y2:liczba całkowita); - rysuje elipsę wpisaną w prostokąt o określonych współrzędnych.

Przykład : narysuj elipsę wpisaną w składnik PaintBox.

PaintBox1.Canvas.Pen.Szerokość:=4; //szerokość linii = 4 piksele

PaintBox1.Canvas.Ellipse(0,0, PaintBox1.ClientWidth, PaintBox1.ClientHeight);

    procedura Wielokąt(); - rysuje zamknięty wielokąt, podany przez tablicę współrzędnych.

Przykład : narysuj wypełniony romb łączący środki boków figury

Var Xc,Yc:liczba całkowita; // uformować współrzędne centrum obszaru klienta

Xc:=Szerokość Klienta, dział 2;

Xy:=WysokośćKlienta, dział 2;

Płótno.Pędzel.Kolor:=Rgb(275,140,70); // Pomarańczowy kolor zacienienie

Płótno.Wielokąt();

koniec;

    procedura Łuk(x1,y1,x2,y2,x3,y3,x4,y4:liczba całkowita); - wyświetla łuk elipsy ograniczony prostokątem (x1, y1, x2, y2). Łuk jest wyświetlany od punktu o współrzędnych (x3,y3) do punktu o współrzędnych (x4,y4) przeciwko wskazówka godzinowa.

Przykład : narysuj łuk elipsy łączący środek górnej części komponentu
PaintBox środkiem po jego prawej stronie.

Procedura Tform1.Button1Click(Sender:Tobject);

Var X3,y3,x4,y4: liczba całkowita;

Z PaintBox1 do

Płótno.Pióro.Kolor:= clBiały;

Płótno.Pióra.Szerokość:= 3;

Canvas.rectangle(0, 0, PaintBox1.ClientWidth, PaintBox1.ClientHeight);

X3:= Szerokość klienta dział 2;

X4:=Szerokość Klienta;

Y4:= Wysokość klienta dział 2;

Płótno.Pióro.Kolor:= clMaroon;

Canvas.ARC(0, 0, PaintBox1.ClientWidth, PaintBox1.ClientHeight, x3, y3, x4, y4);

koniec;

    procedura Akord(x1,y1,x2,y2,x3,y3,x4,y4:liczba całkowita); - rysuje cięciwę - linię prostą łączącą 2 punkty elipsy: punkt o współrzędnych (x3, y3) z punktem (x4, y4).

Przykład : zastąp w podanym przykładzie metodę ARC, metodę Chord i uzyskaj ten wynik.

    procedura Ciasto(x1,y1,x2,y2,x3,y3,x4,y4:liczba całkowita); - rysuje odcinek elipsy łączący środek elipsy o współrzędnych (x3,y3) i (x4,y4).

Przykład : obecny w przykładzie podanym dla metody ARC, metody PIE i uzyskaj ten wynik.

    procedura tekst(x,y:liczba całkowita;tekst:ciąg); - wyświetla ciąg przekazany w parametrze Tekst do prostokąta, którego lewy górny róg jest określony przez współrzędne x,y. Charakterystykę czcionki ustawia narzędzie Czcionka.

Przykład : wpisz nazwę skonstruowanego wykresu na dole formularza.

Płótno.Czcionka.Wysokość:=20 ; // wysokość znaku 20 pikseli

Płótno.Czcionka.Kolor:=clblue;

Canvas.TextOut(10, ClientHeight-24, 'Wykres funkcji SIN(X)');

Komponenty graficzne

Delphi oferuje szereg gotowych komponentów, które ulepszają interfejs użytkownika. Te elementy są umieszczane na stronie Dodatkowy oraz System paleta komponentów.

SkładnikObraz(KlasaCzas) – przeznaczone do wyświetlania obrazów graficznych zapisanych w plikach zewnętrznych o rozszerzeniach:

    Ico(ikona, piktogram);

    bmp (mapa bitowa, mapa bitowa);

    Wmf, .emf (metaplik);

    Jpg, .jpeg (skompresowany obraz JPEG).

Główny nieruchomości :

rozmiar auta:boolean - jeśli true, komponent dopasowuje swój rozmiar do rozmiaru wczytanego obrazu; domyślnie fałszywe.

Rozciągać się:boolean - jeśli true, ładowana wartość zajmuje cały obszar komponentu; wartość domyślna to fałsz.

Płótno:Tcanvas — służy do rysowania wewnątrz komponentu w czasie wykonywania.

obrazek:Tpicture — określa obraz umieszczony w komponencie.

Główny metody klasa obrazek:

procedura Wczytaj z pliku(nazwa pliku:ciąg); - ładuje obraz do komponentu z pliku o nazwie Nazwa pliku.

procedura Zapisz do pliku(nazwa pliku:ciąg); -zapisuje obraz z komponentu do pliku o nazwie Nazwa pliku.

Składnikpudełko z farbą - definiuje prostokątny obszar do rysowania. Główna właściwość to Płótno, dostępne są wszystkie metody klasy Tcanvas, nie ma ona niezależnych właściwości.

Przykład : narysuj żółtą elipsę wpisaną w składnik PaintBox1.

Procedura Tform1Button1Click(nadawca:obiekt);

Z PaintBox1.Canvas zrób

Pędzel.Kolor:=clyellow;

Elipsa(0,0,PaintBox1.ClientWidth, PaintBox1.ClientHeight);

koniec;

SkładnikBitBtn przycisk mapy bitowej

Przycisk BitBtn, w przeciwieństwie do standardowego, może zawierać oprócz nazwy (Caption) obrazek określony przez właściwość Glif. Istnieje zestaw standardowych przycisków BitBtn, z predefiniowanymi właściwościami (z określonym obrazkiem, podpisem i przeznaczeniem) - typ standardowego przycisku wybierany jest poprzez właściwość uprzejmy. Rodzaj=(bkNiestandardowy, bkPrzerwij, bkAnuluj, bkZamknij...)

Zadanie numer 1

Utwórz aplikację, która zawiera dwa komponenty obrazu i 4 przyciski w głównym formularzu („Prześlij obraz”, „Zbuduj kształt geometryczny”, „Zmień kolor”, „Zakończ”) i umożliwia:

a) wczytać do komponentu Image1 wybrany przez użytkownika obraz graficzny w taki sposób, aby obraz zajmował cały obszar komponentu Image.

b) pod komponentem Image1 wyświetlić napis „To jest obraz z pliku.

(dla dowolnego pomiaru wymiarów i położenia elementu)Obraz1 napis musi
być ściśle poniżej komponentu).

c) narysuj kształt geometryczny wewnątrz komponentu Image2: wypełniony segment elipsy łączącej środek komponentu Image z punktami środkowymi dolnej i prawej strony komponentu Image.

(przy każdej zmianie rozmiaru i położenia elementu)Obraz2, figura musi być poprawnie zbudowana, tj. zgodnie z przypisaniem dotyczącym komponentuObraz2)

d) zmienić kolor linii rysunku narysowanego w Image2 na żądanie użytkownika za pomocą komponentu ColorDialog.

Zadanie numer 2

Utwórz aplikację, która pozwala losowo umieszczać wiele etykiet w komponencie obrazu (na przykład słowo „Hurra!”). Aby zaimplementować, użyj generatora liczb losowych Randomize i funkcji Random.

Wymiary komponentu Image, słowo wyświetlane w obrazie oraz liczba słów muszą być wprowadzone przez użytkownika.

Zadanie numer 3

Utwórz aplikację, która umożliwia wybranie nazwy kształtu geometrycznego z ListBox i narysowanie wybranego kształtu w składniku Image. Kolor kształtu jest wybierany z komponentu RadioGroup.

Zadanie numer 4

Podziel składnik PaintBox1 na 4 równe części, pomaluj każdą część innym kolorem, na przykład: niebieskim, żółtym, zielonym, czerwonym.

Obok każdego rogu PaintBox1 napisz współrzędne tego rogu (względem początku kształtu, na którym znajduje się składnik PaintBox1).

Zadanie numer 5

Z

wybierz typ rysowanej figury ze składnika Radiogroup1, kolor wypełnienia ze składnika Radiogroup2 i narysuj wybraną figurę w komponencie Image.

Zadanie numer 6

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Podziel składnik PaintBox1 na 2 równe części, wewnątrz każdej części narysuj elipsę wypełnioną kolorem wybranym przez użytkownika w ColorDialog.

Zadanie numer 7

Z stworzyć aplikację umożliwiającą:

wybierz nazwę figury geometrycznej z listy ListBox i narysuj wybraną figurę w komponencie Image. Kształt powinien być wypełniony kolorem wybranym przez użytkownika w komponencie ColorDialog, jeśli wybrano Yes w komponencie RadioGroup.

Zadanie numer 8

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Podziel składnik PaintBox1 na 4 równe części, wewnątrz każdej części narysuj inny kształt geometryczny (elipsę, romb, trójkąt i prostokąt). Kolor każdego kształtu jest wybierany przez użytkownika w ColorGrid.

Zadanie numer 9

wybierz nazwę geometrii z ListBox
kształty (elipsa, romb, prostokąt) i rysowanie
wybrany kształt w komponencie Image. Lokalizacja
kształty w komponencie Obraz (I ćwiartka, II ćwiartka,

III lub IV kwartał) i wybrany jest kolor wypełnienia figury
z komponentów RadioGroup.

Zadanie numer 10

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Pod warunkiem, że rozmiar boku nie może być tekstem, liczbą ujemną i nie może przekraczać mniejszego rozmiaru formularza.

Podziel składnik PaintBox1 na 4 równe części, wewnątrz każdej części narysuj kształt geometryczny wybrany przez użytkownika w Combobox (elipsa, romb, trójkąt i prostokąt). Kolor kształtu jest wybierany przez użytkownika w ColorBox.

Zadanie numer 11

Stwórz aplikację, która pozwoli Ci:

wybierz pozycję rysowania z komponentu Radiogroup

w składniku obrazu prawego trójkąta ustaw
kolor wypełnienia kształtu lub kolor konturu, w zależności od
włączenie przycisków pola wyboru. Wybór koloru przez
Składnik ColorGrid.

Zadanie numer 12

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Pod warunkiem, że rozmiar boku nie może być tekstem, liczbą ujemną i nie może przekraczać mniejszego rozmiaru formularza.

Podziel składnik PaintBox1 na 2 równe części, wewnątrz jednej z części narysuj figurę geometryczną wybraną przez użytkownika w Combobox (elipsę, romb, trójkąt i prostokąt). Kolor kształtu jest wybierany przez użytkownika w ColorBox.

Na przykład możesz zmienić kolor formularza w ten sposób:

form1.Color:= ColorBox1.Colors;

Zadanie numer 13

Stwórz aplikację, która pozwoli Ci:

a) narysuj kwadrat na środku kształtu (wymiar boku kwadratu wpisuje użytkownik). Pod warunkiem, że rozmiar boku nie może być tekstem, liczbą ujemną i nie może przekraczać mniejszego rozmiaru formularza.

b) podziel kwadrat jedną lub dwiema przekątnymi, w zależności od włączenia przycisków Checkbox, i pomaluj każdy powstały trójkąt na inny kolor. Wyboru koloru dokonuje użytkownik.

Zadanie numer 14

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Pod warunkiem, że rozmiar boku nie może być tekstem, liczbą ujemną i nie może przekraczać mniejszego rozmiaru formularza.

Podziel składnik PaintBox1 na 2 równe części, narysuj romb wewnątrz jednej części i narysuj dowolny trójkąt wewnątrz drugiej części. Kolor kształtu jest wybierany przez użytkownika w ColorBox.

Na przykład możesz zmienić kolor formularza w ten sposób:

form1.Color:= ColorBox1.Colors;

Zadanie numer 15

Stwórz aplikację, która pozwoli Ci:

a) ustawić wymiary komponentu obrazu w poziomie i pionie, aby były takie same i równe liczbie wprowadzonej przez użytkownika z klawiatury;

(pod warunkiem, że rozmiar boku nie może być tekstem, nie może być liczbą ujemną i nie może przekraczać mniejszego rozmiaru formularza)

b) podziel składnik obrazu na 4 równe kwadraty z dwiema niebieskimi liniami;

c) wewnątrz każdego wynikowego kwadratu narysuj wpisany w niego okrąg (kolor kół może wybrać użytkownik poprzez okno dialogowe wyboru koloru).

Zadanie numer 16

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Pod warunkiem, że rozmiar boku nie może być tekstem, liczbą ujemną i nie może przekraczać mniejszego rozmiaru formularza.

Podziel składnik PaintBox1 na 9 równych części i pomaluj każdy wynikowy prostokąt szachownicy. Kolor wypełnienia jest wybierany przez użytkownika w ColorBox.

Na przykład możesz zmienić kolor formularza w ten sposób:

form1.Color:= ColorBox1.Colors;

Zadanie numer 17

Umieść dwa komponenty obrazu i cztery przyciski na formularzu: Kolor linii, Kolor wypełnienia, Ok i Zakończ; i składnik Edycja.

Po kliknięciu przycisku OK Obraz1 rysuje kwadrat o boku X, a Obraz2 rysuje trójkąt prostokątny z równymi nogami, z których każda ma długość X.

Wierzchołek trójkąta pokrywa się z początkiem Image2. Jeden z wierzchołków kwadratu pokrywa się z początkiem Image1.

Przycisk OK staje się dostępny tylko wtedy, gdy wybrany jest kolor linii i kolor wypełnienia do rysowania kształtu.

X - wybiera losowo, korzystając z funkcji Random i wartość wartości X powinna zostać wyświetlona w komponencie Edit.

Zadanie numer 18

Utwórz aplikację, która pozwala użytkownikowi ustawić wymiary składnika PaintBox1 (w pikselach).

Podziel składnik PaintBox1 na 4 równe części, wewnątrz części wybranej przez użytkownika należy zbudować wypełnione kółko, którego rozmiar jest ustalany przez użytkownika. Użytkownik wybiera kolor wypełnienia w ColorBox.

Na przykład możesz zmienić kolor formularza w ten sposób:

form1.Color:= ColorBox1.Colors;

Lista komponentów do wyświetlania informacji graficznych

W celu wyświetlenia informacji graficznych biblioteka Delphi udostępnia komponenty, których wykaz znajduje się w Tabeli 4.1.

Tabela 4.1 Piktogram elementów wyświetlacza graficznego

Składnik

Strona

Opis

Obraz (obraz)

Służy do wyświetlania grafiki: ikon, bitmap i metaplików.


PaintBox (okno do rysowania)

Służy do tworzenia obszaru na formularzu, w którym możesz rysować.


DrawGrid (tabela rysunkowa)

Służy do wyświetlania danych nietekstowych w wierszach i kolumnach.


Wykres (wykresy i wykresy)

Komponent należy do rodziny komponentów TChart, które służą do tworzenia wykresów i wykresów.


Możesz także wyświetlać i wprowadzać informacje graficzne na powierzchni dowolnego płótna.

Płótno Płótno nie jest składnikiem, więc ściśle rzecz biorąc, nie należy jej rozpatrywać w ramach tej książki. Ponieważ jednak wiele elementów, w szczególności formularze, posiada płótno, a płótno zapewnia możliwość wyświetlania różnych informacji graficznych, nadal wskazane jest podanie wstępnych informacji o płótnie.

Płótno to obszar komponentu, w którym można rysować lub wyświetlać gotowe obrazy. Zawiera właściwości i metody, które znacznie upraszczają grafikę Delphi. Wszystkie złożone interakcje z systemem są ukryte przed użytkownikiem, dzięki czemu osoba, która nie ma nic wspólnego z grafiką komputerową, może rysować w Delphi.

Każdy punkt płótna ma współrzędne X oraz Tak. Układ współrzędnych kanwy, jak wszędzie w Delphi, zaczyna się w lewym górnym rogu kanwy. Koordynować X wzrasta przy przechodzeniu od lewej do prawej, a współrzędna Tak- przy przechodzeniu od góry do dołu. Współrzędne są mierzone w pikselach. Piksel to najmniejszy element na powierzchni rysunku, którym można manipulować. Najważniejszą właściwością piksela jest jego kolor.

Płótno ma właściwość Piksele. Ta właściwość jest tablicą 2D, która kontroluje kolory płótna. Na przykład, Płótno. Piksele odpowiada kolorowi piksela dziesiątego od lewej i dwudziestego od góry. Tablicę pikseli można traktować jak każdą właściwość: zmienić kolor, nadając pikselowi nową wartość lub określić jego kolor na podstawie wartości w nim zapisanej. Na przykład, Płótno. Piksele:=0 lub Płótno. Piksele :=clBlack- to zadanie dla czarnego piksela.

Nieruchomość Piksele może służyć do rysowania na płótnie. Spróbujmy narysować piksel po pikselu wykres sinusoidalny na kanwie kształtu. Aby to zrobić, w formularzu obsługi zdarzeń OnPaint(rysunek) możesz wstawić następujący kod:

Tform1. FormPaint(Nadawca: TObject);

var,Y: prawdziwe; // współrzędne funkcji,PY: longint; // współrzędne pikseli

zaczynać:=clBiały;

dla PX:=0 do Szerokość klienta robić

(X - argument fabularny,

:=PX*4*Pi/Szerokość Klienta;:=Sin(X);

(PY - współrzędna piksela,

:=trunc(WysokośćKlienta - (Y+1) *WysokośćKlienta/2);

(Ustawia kolor wybranego

piksel (o jasności) ). Piksele:=0;

koniec;

Uruchom tę aplikację testową, a zobaczysz wynik pokazany na rysunku 4.1a. Wykres sinusoidalny okazał się, choć niezbyt dobry, ponieważ. w rozbiciu na pojedyncze kropki - piksele.

Canvas - obiekt klasy Tpłótno posiada wiele metod pozwalających na rysowanie wykresów, linii, kształtów za pomocą właściwości Długopis- pióro. Ta właściwość to obiekt, który z kolei posiada szereg właściwości. Jednym z nich jest nieruchomość, którą już znasz kolor- kolor, w jakim zastosowano rysunek. Druga właściwość to Szerokość(szerokość linii). Szerokość określa się w pikselach. Domyślna szerokość to 1.

Nieruchomość styl definiuje rodzaj linii. Ta właściwość może przyjmować następujące wartości:

Płótno ma właściwość PenPos rodzaj TPunkt(cm .). Ta właściwość określa bieżącą pozycję pióra we współrzędnych kanwy. Przesuwanie pióra bez rysowania linii, czyli zmiana PenPos, wyprodukowany metodą canvas PrzenieśDo(X,Y). Tutaj ( X, Y) - współrzędne punktu, w którym pióro się porusza. Ten aktualny punkt staje się punktem wyjścia, z którego metoda LiniaDo(X,Y) możesz narysować linię do punktu o współrzędnych ( X,Y). Powoduje to przeniesienie bieżącego punktu do punktu końcowego linii i nowego połączenia Linia do narysuje punkt z tego nowego aktualnego punktu.

Spróbujmy narysować wykres sinusoidalny z poprzedniego przykładu za pomocą długopisu. W tym przypadku procedura obsługi zdarzeń formularza OnPaint może wyglądać tak:

procedura Tform1. FormPaint(Nadawca: TObject);

var,Y: prawdziwe; // współrzędne funkcji,PY: longint; // współrzędne pikseli

zaczynać:=clBiały;. MoveTo(0,ClientHeight, dział 2);

dla PX:=0 do Szerokość klienta robić

(X - argument fabularny,

odpowiadający pikselowi o współrzędnej px):=PX*4*Pi/Szerokość Klienta;:=Sin(X);

(PY - współrzędna piksela,

odpowiadające współrzędnej Y):=trunc(WysokośćKlienta - (Y+1) *WysokośćKlienta/2);

(Na wykresie rysowana jest linia). LiniaDo(PX,PY);

Możesz zobaczyć wynik działania aplikacji w tej wersji na rysunku 4.1b. Jak widać, jakość wykresu znacznie się poprawiła.

Piórem można rysować nie tylko proste linie, ale także kształty. Pełną listę metod kanwy opartych na pisaku można znaleźć we wbudowanej pomocy Delphi. Tymczasem jako przykład podamy tylko jeden z nich - Elipsa A, który rysuje elipsę lub okrąg. Jest deklarowany jako

procedura Elipsa(X1, Y1, X2, Y2: liczba całkowita);

gdzie parametry X1, X2, Y1, Y2 zdefiniuj współrzędne prostokąta opisującego elipsę lub okrąg. Na przykład operator

Elipsa(10, 40, 20, 50);

narysuje okrąg o średnicy 10 i współrzędnych środka (15, 45).

Kształty są zazwyczaj rysowane nie puste, ale wypełniane za pomocą właściwości canvas Szczotka- szczotka. Nieruchomość Szczotka to obiekt, który ma z kolei szereg właściwości. Nieruchomość kolor definiuje kolor wypełnienia. Nieruchomość styl definiuje wzór wypełnienia (kreskowanie). Domyślna wartość styl równa się bsSolid, co oznacza solidne zabarwienie kolor.

W zagrodzie Długopis Jest jeszcze jedna właściwość, której jeszcze nie braliśmy pod uwagę. Ta właściwość jest tryb(tryb). Domyślna wartość Tryb = pmKopiuj. Oznacza to, że linie są rysowane w kolorze określonym we właściwości kolor. Ale możliwe są również inne tryby, w których nie tylko kolor jest brany pod uwagę kolor, ale także kolor odpowiednich pikseli tła. Najciekawszym z tych trybów jest tryb pmNotXor- dodatek z tłem przez odwrotną wyłączność OR. Jeśli ten tryb jest ustawiony, ponowne rysowanie tego samego kształtu w tym samym miejscu na kanwie usuwa poprzednio narysowany obraz i przywraca kolory pikseli, które były przed pierwszym rysowaniem kształtu.

Ta cecha reżimu pmNotXor może służyć do tworzenia prostych animacji. Wystarczy coś narysować, a następnie wymazać rysunek, przerysować go nieco zmieniony - i rysunek ożyje.

Spróbuj zrobić sobie prostą animację - ruchome koło. Uruchom nową aplikację i przejdź do sekcji realizacja wstaw reklamę

X,Y: liczba całkowita;

Wprowadzi to zmienne globalne X oraz Tak- aktualne współrzędne obrazu.

W formie wydarzenia OnPaint wstaw oświadczenia

Szczotka. Kolor:=clBiały;:=clBiały;. Długopis. Tryb:=pmNotXor;

Pierwszy z tych operatorów ustawia kolor pędzla na biały. Szczotka. Więc twoje koło zostanie pomalowane na biało. Druga instrukcja ustawia kolor tła powierzchni formularza na biały.

Trzecie stwierdzenie ustawia tryb pióra pmNotXor, co pozwoli wymazać stary obraz przed narysowaniem nowego.

Nawet najprostsza animacja wymaga synchronizacji. W przeciwnym razie prędkość ruchu będzie określana przez prędkość komputera. Dlatego przenieś komponent do formularza regulator czasowy- timer z Systemu. Ten komponent jest opisany w sekcji 5.7 .

Możesz tam zobaczyć jego szczegółowy opis. Na razie ustaw jego właściwość Interwał równy np. 30 (jest to czas przebywania w milisekundach, ale rzeczywisty czas przebywania będzie dłuższy - patrz rozdział 5.7) i ustawić właściwość Włączony równy fałszywy(oznacza to, że timer nie uruchomi się automatycznie po uruchomieniu aplikacji).

W obsłudze zdarzeń tego komponentu OnTimer wstaw oświadczenia

// Usuń stary obraz. Elipsa(X-5, Y, X+5, Y-1Q);(X);

// Narysuj nowy obraz. Elipsa (X-5, Y, X+5, Y-10);

// Zatrzymaj się po osiągnięciu końca formularza

jeśli(X >= Szerokość klienta-20) następnie. włączone:=fałsz;

Pierwszy z tych operatorów rysuje okrąg w miejscu, w którym został narysowany wcześniej, tj. usuwa poprzedni obraz.

Ostatnia instrukcja zatrzymuje obraz na krawędzi formularza.

Teraz dodaj przycisk do formularza. przycisk i w obsłudze kliknięcia na niej umieść operatory

X:=10;:=100;. Elipsa(X-5, Y, X+5, Y-10); włączone:=prawda;

Dwaj pierwsi operatorzy ustalają początkowe współrzędne okręgu. Trzecie stwierdzenie rysuje okrąg w pozycji początkowej, a czwarta uruchamia stoper.

Przetłumacz aplikację, uruchom ją, kliknij przycisk. Zobaczysz okrągły obraz poruszający się po formularzu od lewej do prawej. A potem połącz swoją wyobraźnię i przekształć tę niezbyt interesującą aplikację w coś bardziej ekscytującego.

Na kanwie można wyświetlać nie tylko obrazy stworzone programowo, ale także obrazy przechowywane w plikach graficznych. Tylko samo płótno nie ma metody ładowania obrazu z pliku. Dlatego plik musi być załadowany do innego obiektu graficznego zdolnego do odbierania informacji z plików graficznych. A następnie przepisz obraz z tego obiektu na płótno za pomocą metody canvas Rysować. Jego opis:

Draw(X, Y: liczba całkowita; grafika: TGraphic);

Tutaj parametry X oraz Tak określić współrzędne lewego górnego rogu umieszczenia obrazu na płótnie, a Graficzny- obiekt przechowujący informacje. Takim obiektem może być np. obiekt typu TBitMap, przeznaczony do przechowywania matryc bitowych. Zobaczmy, jak to wszystko wygląda w praktyce.

Otwórz nową aplikację, przeciągnij komponent na formularz Okno dialogowe OpenPicture ze strony Dialogi (jest to składnik okna dialogowego do otwierania plików graficznych - patrz rozdział 8.2 ) i przycisk przycisk. Poczta Okno dialogowe OpenPicture w dowolnym miejscu formularza, ponieważ ten składnik nie jest wizualny, i umieść przycisk na dole formularza. Wprowadź następujący kod w module obsługi kliknięcia przycisku:

procedura Tform1. Button1Click (nadawca: TObject);

var:TBitMap;

// Wybór pliku graficznego przez użytkownika

jeśli OpenPictureDialog1. Wykonać następnie

// Utwórz obiekt BitMap typu TBitMap:=TBitMap. Stwórz;

// Przenieś obraz na płótno. Rysuj(10, 10, bitmapa);

// Zniszcz obiekt BitMap. darmowy;

koniec;

Ten kod tworzy tymczasowy obiekt typu TBitMap Z nazwą mapa bitowa. Następnie wywoływane jest okno dialogowe do otwarcia pliku graficznego. Okno dialogowe OpenPicture1 a jeśli użytkownik wybrał plik, to jest on ładowany do mapa bitowa metoda Wczytaj z pliku. Następnie metoda Rysować załadowany obraz jest kopiowany na płótno w obszarze ze współrzędnymi lewego górnego rogu (10,10). Po tym tymczasowy obiekt mapa bitowa jest zniszczony.

Uruchom aplikację i kliknij jej przycisk. Zobaczysz, że możesz wgrać dowolny typ pliku graficznego. bmp i zostanie wyświetlony na kanwie formularza (patrz rys. 4.2 a). Pliki graficzne można znaleźć w katalogu Images. W Delphi 5 i 4 zwykle znajduje się w katalogu. \program files\Common Files\Borland Shared. W Delphi 3 znajduje się w katalogu. \program files\Borland\Delphi 3, a w Delphi 1 - w katalogu Delphi 16. Katalog Images zawiera w szczególności podkatalog \Images\Splash\16Color\, w którym przechowywany jest plik załadowany w przykładzie z rys. 4.2

Stworzyłeś fajną aplikację do przeglądania plików graficznych. Ale teraz spróbujmy zobaczyć jego główną wadę. Bez zamykania aplikacji przejdź do innego programu, na przykład wróć do Delphi. Następnie, nie robiąc nic tam, wróć do uruchomionej aplikacji. Jeśli okno programu, który opuściłeś, całkowicie zakryło okno Twojej aplikacji, to po powrocie do niego zobaczysz, że obraz w oknie zniknął. Jeśli okno Twojej aplikacji nachodziło na siebie tylko częściowo, to po powrocie do aplikacji możesz zobaczyć wynik podobny do pokazanego na Rys. 4.2b.

Możesz zobaczyć, że jeśli okno innej aplikacji tymczasowo nakłada się na okno Twojej aplikacji, to obraz narysowany na kanwie formularza jest uszkodzony. Zobaczmy, jak możemy naprawić to niedociągnięcie.

Jeśli okno zostało zasłonięte, a obraz jest uszkodzony, system operacyjny informuje aplikację, że coś się zmieniło w środowisku i że aplikacja powinna podjąć odpowiednie działania. Gdy tylko wymagana jest aktualizacja okna, generowane jest dla niej zdarzenie OnPaint. W module obsługi tego zdarzenia (w naszym przypadku zdarzenia formularza) musimy przerysować obrazek.

Przerysowywanie można wykonać na różne sposoby, w zależności od aplikacji. W naszym przykładzie moglibyśmy złożyć deklarację zmiennej mapa bitowa(operator var BitMap: TBitMap) poza powyższą procedurą, tj. uczynić tę zmienną globalną, umieszczając ją bezpośrednio w sekcji realizacja. Operator mapa bitowa. Bezpłatny można przenieść do obsługi zdarzeń formularza OnDestroy to ma miejsce po zamknięciu aplikacji. Następnie przez cały czas wykonywania aplikacji będziesz mieć kopię obrazu w komponencie mapa bitowa i wystarczy wpisać w obsłudze zdarzeń OnPaint tworzy tylko jedno stwierdzenie:

Rysuj(10, 10, bitmapa);

Zrób to, a zobaczysz, że obraz na formularzu nie pogorszy się przy żadnych nakładach się okien.

Oprócz rozważanej metody Rysować płótno ma inną metodę kopiowania KopiujRect:

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

Metoda kopiuje określony parametr Źródło obszar obrazu na kanwie źródła obrazu Płótno do określonego Cel obszar tego płótna. Typ TRect charakteryzujące obszary prostokątne Źródło oraz Cel, już opisane w punkcie 3.2 .

Na przykład operator

CopyRect(MyRect2, Bitmap.Canvas, MyRect1);

kopie na płótno formularza w okolicy MójRect2 obraz z okolicy MójRect1 płótno składowe mapa bitowa.

Metoda kopiowania KopiujRect produkowane w trybie określonym przez właściwość Tryb kopiowania. Domyślnie ta właściwość jest ustawiona na cmSrcCopy, co oznacza po prostu zastąpienie obrazu wcześniej zawartego w zakresie Cel, na skopiowanym obrazie. Inne możliwe wartości Tryb kopiowania pozwalają łączyć obrazy, ale ich rozważenie wykracza poza zakres tej książki.

Ograniczymy się do tych podstawowych informacji o wyprowadzaniu informacji graficznych na płótno. Sekcja 3.2 zgłoszono informację o wyjściu na kanwę tekstu. Ogólnie rzecz biorąc, płótno to złożony obiekt, który ma znacznie więcej właściwości i metod. Wymaga to jednak szczegółowej dyskusji, która wykracza poza zakres tej książki. W następnej książce z serii All About Delphi omówimy te kwestie bardziej szczegółowo.

Komponent okna, który ma właściwość Płótno- płótno.

Komponenty obrazu i PaintBox

składniki Obraz oraz pudełko z farbą przedstawiają pewną ograniczoną powierzchnię za pomocą płótna, na którym można wprowadzać obrazy, jak opisano w sekcji 4.2 . W tym samym czasie komponent pudełko z farbą w rzeczywistości nie wnosi nic nowego w porównaniu z rysowaniem na kanwie formy. Rysować na pudełko z farbą zamiast formy nie ma żadnej przewagi, z wyjątkiem być może pewnej ulgi w rozmieszczeniu jednego lub więcej rysunków w obszarze okna.

Ale oprócz tych możliwości komponent Obraz posiada właściwości pozwalające na pracę z różnymi typami plików graficznych.Obsługuje trzy typy plików - bitmapy, ikony i metapliki. Wszystkie trzy typy plików przechowują obrazy; różnica polega tylko na sposobie ich przechowywania w plikach i sposobach dostępu do nich. Bitmapa (plik z rozszerzeniem . bmp) wyświetla kolor każdego piksela na obrazie. Jednocześnie informacje są przechowywane w taki sposób, aby każdy komputer mógł wyświetlić obraz o rozdzielczości i liczbie kolorów odpowiadającej jego konfiguracji.

Piktogramy (pliki z rozszerzeniem . i co) to małe macierze bitowe. Są szeroko stosowane do oznaczania ikon aplikacji, w szybkich przyciskach, w elementach menu, na różnych listach. Sposób przechowywania obrazów w ikonach jest podobny do przechowywania informacji w bitmapach, ale istnieją różnice. W szczególności ikona nie może być skalowana, zachowuje rozmiar w jakim została utworzona.

Metapliki nie przechowują sekwencji bitów tworzących obraz, ale informacje o tym, jak obraz został utworzony. Przechowują sekwencje poleceń rysowania, które można powtórzyć podczas odtwarzania obrazu. To sprawia, że ​​takie pliki są ogólnie bardziej zwarte niż mapy bitowe.

Składnik Obraz umożliwia wyświetlanie informacji zawartych w plikach graficznych wszystkich określonych typów. Do tego jego własność obrazek- obiekt typu TPobraz.

Rys.4.3 Okno edytora zdjęć


Aby zapoznać się z tą właściwością, otwórz nową aplikację i przenieś komponent do formularza Obraz. Rozciągnij go lub ustaw jego właściwość Wyrównywać równy alClient tak, aby zajmował cały obszar klienta formularza. Kliknij przycisk z wielokropkiem obok nieruchomości obrazek w oknie Inspektora obiektów lub po prostu kliknij dwukrotnie Obraz. Przed Tobą otworzy się okno Edytora zdjęć (rys. 4.3), umożliwiające załadowanie do właściwości obrazek jakiś plik graficzny (przycisk Wczytaj), a także zapisz otwarty plik pod nową nazwą lub w nowym katalogu. Kliknij Load, aby załadować plik graficzny. Pojawi się okno do otwierania pliku graficznego pokazane na rysunku 4.4 Podczas przesuwania kursora na liście plików graficznych w prawym oknie wyświetlane są zawarte w nich obrazki, a nad nimi liczby charakteryzujące wielkość pliku graficznego. obrazek. Możesz wybrać dowolny typ pliku graficznego, jaki potrzebujesz. Przypomnij sobie, że pliki graficzne dostarczone z Delphi można znaleźć w katalogu Images. W Delphi 5 i 4 zwykle znajduje się w katalogu. \program files\Common Files\Borland Shared. W Delphi 3 znajduje się w katalogu. \program files\Borland\Delphi 3, a w Delphi 1 w katalogu Delphi 16. Po załadowaniu pliku kliknij OK w oknie Picture Editor i w swoim komponencie Obraz wybrany obraz zostanie wyświetlony. Możesz uruchomić swoją aplikację i podziwiać ją. Jednak już widzisz obraz, nawet bez uruchamiania aplikacji.

Po załadowaniu obrazu z pliku do komponentu podczas projektowania Obraz, nie tylko go wyświetla, ale zapisuje w aplikacji. Daje to możliwość wysłania aplikacji bez osobnego pliku graficznego. Jednak, jak zobaczymy później, w Obraz możesz także ładować zewnętrzne pliki graficzne, gdy aplikacja jest uruchomiona.

Wróćmy do rozważenia właściwości składnika Obraz.

Jeśli ustawisz właściwość rozmiar auta w PRAWDA, a następnie rozmiar komponentu Obraz automatycznie dopasuje się do rozmiaru umieszczonego w nim obrazu. Jeśli nieruchomość rozmiar auta zainstalowany w fałszywy, wtedy obraz może nie pasować do komponentu lub odwrotnie, obszar komponentu może być znacznie większy niż obszar obrazu.

Inna nieruchomość - Rozciągać się pozwala dopasować nie komponent do rozmiaru obrazu, ale obraz do rozmiaru komponentu. zainstalować rozmiar auta w fałszywy, rozciągnij lub zmniejsz rozmiar komponentu Obraz i zainstaluj Rozciągać się w PRAWDA. Zobaczysz, że rysunek zajmie cały obszar komponentu, ale ponieważ jest mało prawdopodobne, aby realistycznie ustawić wymiary Obraz dokładnie proporcjonalna do wielkości obrazu, obraz będzie zniekształcony. zainstalować Rozciągać się w PRAWDA może mieć sens tylko w przypadku niektórych wzorów, ale nie w przypadku zdjęć. Nieruchomość Rozciągać się nie wpływa na miniatury, których nie można zmienić.

Nieruchomość - Środek ustalać się PRAWDA, centruje obraz na obszarze Obraz jeśli rozmiar komponentu jest większy niż rozmiar obrazu.

Rozważ inną właściwość - Przezroczysty(przezroczystość). Jeśli Przezroczysty równa się PRAWDA, to obraz w Obraz staje się przezroczysty. Można to wykorzystać do nakładania obrazów na siebie. Umieść drugi komponent na formularzu Obraz i prześlij do niego inny obraz. Po prostu spróbuj zrobić trochę wypełnionego, konturowego zdjęcia. Możesz na przykład zrobić zdjęcie spośród tych, które zwykle znajdują się na przyciskach, na przykład strzałka (plik.\program files\common files\borland shared\images\buttons\arrow1l.bmp). Przenieś swój Obraz tak, aby nakładały się na siebie i w górnym zestawie komponentów Przezroczysty równy PRAWDA. Zobaczysz, że górny obraz nie zasłania już dolnego. Jednym z możliwych zastosowań tej właściwości jest nakładanie na obraz napisów wykonanych w postaci matrycy bitowej. Napisy te można wykonać za pomocą wbudowanego programu Delphi Image Editor.

Należy pamiętać, że obiekt Przezroczysty dotyczy tylko macierzy bitowych. Jednocześnie kolor lewego dolnego piksela mapy bitowej jest domyślnie przeźroczysty (tzn. zastępowany przez kolor obrazu znajdującego się pod nim).

Przyjrzeliśmy się ładowaniu obrazu z pliku podczas procesu projektowania. Ale własność obrazek pozwala również na łatwe zorganizowanie wymiany z plikami graficznymi dowolnego typu podczas wykonywania aplikacji. Aby wyjaśnić technikę takiej wymiany, musimy najpierw bardziej szczegółowo rozważyć właściwość obrazek.

Ta właściwość jest obiektem, który z kolei posiada podwłaściwości wskazujące na przechowywany obiekt graficzny. Jeśli w obrazek macierz bitowa jest przechowywana, wskazuje na to właściwość obrazek. mapa bitowa. Jeśli ikona jest przechowywana, wskazuje na nią właściwość obrazek. Ikona. Przechowywany metaplik jest wskazywany przez właściwość obrazek. Metaplik. Wreszcie obiekt graficzny dowolnego typu jest wskazywany przez właściwość obrazek. Graficzny.

Obiekt obrazek i jego właściwości mapa bitowa, Ikona, Metaplik oraz Graficzny mieć metody odczytu i zapisu plików Wczytaj z pliku oraz Zapisz do pliku:

procedura Wczytaj z pliku ( stały Nazwa pliku: strunowy);

procedura Zapisz do pliku( stały Nazwa pliku: strunowy);

Dla nieruchomości obrazek. mapa bitowa, obrazek. Ikona oraz obrazek. Metaplik format pliku musi być zgodny z klasą obiektu: bitmapa, ikona, metaplik. Podczas wczytywania pliku do właściwości obrazek. Grafika plik musi być w formacie metapliku. A dla samego obiektu obrazek metody odczytu i zapisu są automatycznie dostosowywane do typu pliku. Wyjaśnijmy to na przykładzie.

Zbudujmy aplikację podobną do przykładu przeglądania plików graficznych omówionego w rozdziale 4.2. Dla odmiany możesz zorganizować jego kontrolę nie za pomocą przycisku przycisk, ale menu. Umieść komponent na formularzu Obraz. Rozciągnij go lub ustaw jego właściwość Wyrównywać równy alClient tak, aby zajmował cały obszar klienta formularza. Przeciągnij komponent okna dialogowego otwierania pliku graficznego do formularza Okno dialogowe OpenPicture(patrz punkt 8.2 ). Umieść również komponent menu głównego w formularzu menu główne(patrz rozdział 6.1 ) i ustaw w nim jedną sekcję - Plik. W przewodniku tej sekcji napisz oświadczenie

(OpenPictureDialog1.Execute) następnie. obrazek. LoadFromFile(.FileName);

Ten operator wywoła okno dialogowe do otwarcia pliku graficznego (patrz Rysunek 4.4) i załaduje go do komponentu Obraz1 obraz z pliku wybranego przez użytkownika (patrz rys. 4.5). Ponadto plik może być dowolnego typu: bitmapą, ikoną lub metaplikiem.

Rys.4.5 Obraz w komponencie Obraz matryca bitowa (a) i piktogram (6)



W tej aplikacji metoda Wczytaj z pliku stosowane do Obraz1. obrazek. Jeśli otwierane będą tylko pliki bitmapowe, wówczas instrukcję ładowania pliku można zastąpić

obrazek. mapa bitowa. LoadFromFile(.FileName);

W przypadku piktogramów można użyć operatora. obrazek. Ikona. LoadFromFile(.FileName);

aw przypadku metaplików operator. obrazek. metaplik. LoadFromFile(.FileName);

lub. obrazek. graficzny. LoadFromFile(.FileName);

Ale we wszystkich tych przypadkach, jeśli format pliku nie pasuje do zamierzonego, wystąpi błąd. Metoda działa w ten sam sposób. Zapisz do pliku z różnicą, która dotyczyła obrazek lub obrazek. Graficzny zapisuje obraz w dowolnym formacie w pliku. Na przykład, jeśli dodasz okno dialogowe do swojej aplikacji Okno dialogowe Zapisz obraz(patrz punkt 8.2 ), wejdź do sekcji Zapisz jako w menu i umieść operator w jego handler

Okno dialogowe zapisu obrazu1. Wykonać następnie. obrazek. SaveToFile(SavePictureDialog1.FileName);

wtedy użytkownik będzie mógł zapisać obraz w dowolnym formacie w pliku pod nową nazwą. Tylko w takim przypadku, aby uniknąć dalszych nieporozumień, rozszerzenie zapisanego pliku musi nadal odpowiadać formatowi zapisanego obrazu.

Program będzie działał całkowicie identycznie dla obrazów w dowolnym formacie, jeśli zastąpisz operator zapisu

obrazek. graficzny. SaveToFile(.FileName);

nieruchomość za pomocą obrazek. Graficzny. A jeśli znasz format przechowywany w komponencie Obraz obrazy, możesz zastosować tę metodę Zapisz do pliku do właściwości obrazek. mapa bitowa, obrazek. Ikona oraz obrazek. Metaplik.

Dla wszystkich rozważanych obiektów obrazek, obrazek. mapa bitowa, obrazek. Ikona oraz obrazek. Metaplik zdefiniowane są metody przypisywania wartości obiektów:

Przypisz (źródło: Tpersistent);

Jednak dla mapa bitowa, Ikona oraz Metaplik możliwe jest przypisanie tylko wartości jednorodnych obiektów: odpowiednio macierze bitowe, piktogramy, metapliki. Przy próbie przypisania wartości do obiektów heterogenicznych rzucany jest wyjątek ЕBłąd konwersji. Obiekt obrazek- uniwersalny, można mu przypisać wartości przedmiotów dowolnej z pozostałych trzech klas. A znaczenie obrazek można przypisać tylko do obiektu, którego typ jest zgodny z typem obiektu w nim przechowywanego.

metoda Przydzielać może być również używany do udostępniania obrazów za pomocą bufora schowka. Na przykład operator

Przypisz (Obraz1.Obraz);

umieści w schowku obraz zapisany w Obraz1. Podobnie operator

grafika delphi aplikacja obrazu

Obraz1. obrazek. Przypisz (schowek);

przeczytam w Obraz1 obraz w schowku. Co więcej, może to być dowolny obraz, a nawet tekst.

Musisz tylko pamiętać o włożeniu do operatora podczas pracy ze schowkiem używa twój moduł odniesienie do modułu clipbrd. Automatycznie Delphi nie wstawia tego linku.

Wracając do właściwości komponentu Obraz, możemy zauważyć jedną wadę związaną z naszą testową aplikacją pokazaną na rys. 4.5 Podczas ładowania różnych obrazów, rozmiar okna aplikacji może okazać się albo za mały, a wtedy zobaczysz tylko część obrazu, albo za duży i wtedy obrazek zostanie brzydko umieszczony w lewym górnym rogu formularza, pozostawiając dużo pustej przestrzeni. Wadę tę można wyeliminować, korzystając z właściwości Wzrost(wysokość) i Szerokość(szerokość) komponent Obraz. W obiekcie rozmiar auta Założony w PRAWDA wymiary Obraz automatycznie ustawiany na rozmiar przesłanego obrazu. Te wymiary można wykorzystać do odpowiedniej zmiany rozmiaru formularza. Na przykład powyższy kod do ładowania obrazu z pliku można zastąpić następującym:

OpenPictureDialog1. Wykonać następnie

zaczynać. obrazek. LoadFromFile(.FileName);. Wysokość klienta:= Obraz1. Wysokość+10;. Góra:=Formularz1. KlientRekt. Top

+ (Form1.ClientHeight - Image1.Height) dział 2;. Szerokość Klienta := Obraz1. Szerokość+10;. Po lewej:=Formularz1. KlientRekt. Lewy

+ (Formularz1.Szerokość Klienta - Obraz1.Szerokość) dział 2;

koniec;

Ten kod ustawia rozmiar obszaru klienta formularza nieco większy niż rozmiar komponentu. Obraz1, które z kolei dostosowują się do wielkości obrazu ze względu na właściwości rozmiar auta. Zastosuj te poprawki do swojej aplikacji, uruchom ją i zobacz, że formularz automatycznie dostosowuje się do rozmiaru przesłanego obrazu

Komponent kształtu

Składnik kształt można tylko warunkowo przypisać sposobom wyświetlania informacji graficznej, ponieważ przedstawia ona po prostu różne kształty geometryczne, odpowiednio zacienione. Główną właściwością tego składnika jest kształt(formularz), który może przyjmować następujące wartości:

Przykłady tych form pokazano na rysunku 4.7

Rys.4.7 Przykłady komponentów kształt


Inną istotną właściwością komponentu jest Szczotka(szczotka). Ta właściwość jest obiektem typu TBrush, który posiada szereg podwłaściwości, w szczególności: kolor ( Szczotka. kolor) i styl ( Szczotka. styl), aby wypełnić kształt. Wypełnij niektóre wartości styl widać na rys.4.7 trzecią z właściwości komponentu kształt - Długopis(długopis), który definiuje styl linii. Ta nieruchomość, podobnie jak nieruchomość Szczotka, zostały już omówione w punkcie 4.2 . Dane referencyjne dotyczące tych właściwości można znaleźć w rozdziale 10*.

Komponent wykresu

Teraz rozważ komponent wykres. Ten komponent pozwala budować różne wykresy i wykresy, które wyglądają bardzo imponująco (ryc. 4.8). Składnik wykres ma wiele właściwości, metod, zdarzeń, więc jeśli weźmiesz pod uwagę je wszystkie, to musiałbyś poświęcić temu cały rozdział. Dlatego ograniczamy się do rozważenia tylko głównych cech wykres. A resztę znajdziesz we wbudowanej pomocy Delphi lub po prostu wypróbuj je, eksperymentując z diagramami.

Składnik wykres jest pojemnikiem przedmiotów Seria rodzaj Seria TChart- serie danych charakteryzujące się różnymi stylami wyświetlania. Każdy komponent może zawierać kilka serii. Jeśli chcesz wyświetlić wykres, każda seria będzie odpowiadać jednej krzywej na wykresie. Jeśli chcesz wyświetlać wykresy, w przypadku niektórych typów wykresów możesz nałożyć kilka różnych serii na siebie, w przypadku innych (na przykład w przypadku wykresów kołowych) prawdopodobnie będzie to wyglądać brzydko. Jednak w tym przypadku można ustawić dla jednego komponentu wykres wiele serii tych samych danych z różnym typem wykresu. Następnie, czyniąc jeden z nich aktywnym w każdym momencie, możesz dać użytkownikowi wybór typu wykresu, który wyświetla interesujące go dane.

Umieść jeden lub dwa komponenty (jeśli chcesz odtworzyć rysunek 4.8) wykres w formularzu i spójrz na właściwości, które otwierają się w Inspektorze obiektów. Wyjaśnijmy niektóre z nich.

Określa, czy użytkownik może przewijać monitorowaną część wykresu w czasie wykonywania, klikając prawym przyciskiem myszy. Możliwe wartości: pmNone - przewijanie wyłączone, pmHorizontal, pmVertical lub pmBoth - odpowiednio przewijanie dozwolone tylko w kierunku poziomym, tylko w kierunku pionowym lub w obu kierunkach.

Umożliwia użytkownikowi zmianę skali obrazu podczas wykonywania poprzez wycinanie fragmentów diagramu lub wykresu za pomocą kursora myszy (rys. 4.8 b poniżej pokazuje moment przeglądania fragmentu wykresu, który w całości jest przedstawiony na rys. 4.8 a).

Określa tytuł wykresu.

Określa podpis wykresu. Domyślnie brak. Tekst etykiety jest zdefiniowany przez podwłaściwość Tekst.

Definiuje obramowanie wokół wykresu.

Legenda wykresu - lista symboli.

MarginLeft, MarginRight, MarginTop, MarginBottom

Wartości marginesów lewego, prawego, górnego i dolnego.

Oś dolna, oś lewa, oś prawa

Te właściwości określają odpowiednio charakterystykę dolnej, lewej i prawej osi. Ustawienie tych właściwości ma sens w przypadku wykresów i niektórych typów wykresów.

Ściana lewa, Ściana dolna, Ściana tylna

Właściwości te określają odpowiednio charakterystykę lewej, dolnej i tylnej krawędzi trójwymiarowego obszaru wyświetlania wykresu (patrz ryc. 4.8 a, dolny wykres).

Lista serii danych do wyświetlenia w komponencie.

Włącza lub wyłącza wyświetlanie wykresu 3D.

Charakterystyka trójwymiarowego wyświetlacza.

Skala trójwymiarowa (dla rys. 4.8 jest to grubość wykresu i szerokość wstęg wykresu).


Obok wielu wymienionych właściwości w Inspektorze obiektów znajdują się przyciski z wielokropkiem, które umożliwiają wywołanie jednej lub drugiej strony Edytora wykresów - wielostronicowego okna, które pozwala ustawić wszystkie właściwości wykresów. Wywołanie edytora diagramów jest również możliwe poprzez dwukrotne kliknięcie komponentu wykres lub klikając go prawym przyciskiem myszy i wybierając polecenie Edytuj wykres z wyskakującego menu.

Jeśli chcesz spróbować odtworzyć aplikację pokazaną na rysunku 4.8, kliknij dwukrotnie górny komponent wykres. Zostaniesz przeniesiony do okna edytora wykresów (rys.4.9) na stronę wykresu, która ma kilka zakładek. Przede wszystkim zainteresuje Cię zakładka Serie na nim. Kliknij przycisk Dodaj - dodaj serię. Zostaniesz przeniesiony do okna (rys. 4.10), w którym możesz wybrać rodzaj wykresu lub wykresu. W takim przypadku wybierz Pie - wykres kołowy. Za pomocą zakładki Tytuły można ustawić tytuł diagramu, zakładka Legenda pozwala ustawić opcje wyświetlania legendy diagramu (listy symboli) lub całkowicie ją usunąć z ekranu, zakładka Panel określa wygląd panelu na którym wyświetlany jest diagram, zakładka 3D umożliwia zmianę wyglądu diagramu: nachylenie, ścinanie, grubość itp.

Kiedy pracujesz z edytorem wykresów i wybierzesz typ wykresu, komponenty wykres Twój formularz wyświetla swój wygląd z wprowadzonymi do niego danymi warunkowymi (patrz rys. 4.11).

Rys.4.10 Wybór typu wykresu w edytorze wykresów


Dzięki temu możesz natychmiast zaobserwować efekt zastosowania różnych opcji do swojej aplikacji, co jest bardzo wygodne.

Strona Serie, która również posiada wiele zakładek, pozwala wybrać dodatkowe cechy wyświetlania dla serii. W szczególności w przypadku wykresu kołowego na karcie Format przydatne jest włączenie opcji Kołowy kołowy, która zapewni dowolny rozmiar komponentu wykres wyświetlanie wykresu jako koła. Na zakładce Znaki przyciski grupy Styl określają, co zostanie zapisane na etykietach związanych z poszczególnymi segmentami wykresu: Wartość - wartość, Procent - procenty, Etykieta - nazwy danych itp. W przykładzie z rys.4.8 przycisk Procent jest włączony, a szablon procentowy jest ustawiony na zakładce Ogólne, co zapewnia wyświetlanie tylko wartości całkowitych.

Możesz, jeśli chcesz, dodać do tego komponentu wykres inną identyczną serię, klikając przycisk Klonuj na karcie Serie na stronie Wykres, a następnie w przypadku tej nowej serii kliknij przycisk Zmień i wybierz inny typ wykresu, na przykład Słupkowy. Oczywiście dwa różne typy wykresów na tej samej figurze będą wyglądać źle. Ale możesz wyłączyć wskaźnik tej nowej serii na karcie Seria, a następnie pozwolić użytkownikowi wybrać jeden lub inny rodzaj wyświetlania wykresu (pokażemy, jak to zrobić poniżej).

Wyjdź z Edytora diagramów, wybierz dolny komponent w swojej aplikacji wykres i powtórz ustawienie właściwości dla niego za pomocą edytora diagramów. W takim przypadku, jeśli chcesz wyświetlić dwie krzywe na wykresie, musisz określić dwie serie i wybrać typ Wykres liniowy. Ponieważ mówimy o wykresach, możesz użyć zakładek Oś i Ściany, aby ustawić charakterystykę współrzędnych osi i trójwymiarowych ścian wykresu.

Na tym kończy się projektowanie wyglądu aplikacji. Pozostaje napisać kod określający dane, które chcesz wyświetlić. W przypadku aplikacji testowej ustawmy po prostu pewne stałe dane na wykresie kołowym, a funkcje sinus i cosinus na wykresach.

Aby ustawić wyświetlane wartości, użyj metod serii Seria. Skupmy się na trzech głównych metodach.

metoda Jasne usuwa serię z wcześniej wprowadzonych danych.

metoda Dodać:

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

umożliwia dodanie nowego punktu do wykresu. Parametr Wartość odpowiada wartości dodanej, parametr Etykieta- nazwa, która będzie wyświetlana na wykresie i w legendzie, Kolor- kolor. Parametr Etykieta- opcjonalnie, można ustawić puste: "".

metoda Dodaj XY:(Const AXValue, AYValue: Double; ALabel: String; AColor: TColor)

umożliwia dodanie nowego punktu do wykresu funkcji. Opcje AXValue oraz Wartość AY dopasuj argument i funkcję. Opcje Etykieta oraz Kolor tak samo jak w metodzie Dodać.

Zatem procedura ładowania danych w naszym przykładzie może wyglądać tak:

155;=251;=203;=404;

var:słowo;

zaczynać Seria1 robić

zaczynać;(A1, "Piętro 1", clŻółty);(A2, "Piętro 2", clNiebieski);(A3, "Piętro 3", clCzerwony);(A4, "Piętro 4", clFioletowy);

koniec;. jasne. jasne;

dla ja:=0 do 100 robić

zaczynać. AddXY(0,02*Pi*i, sin(0,02*Pi*i), "", clRed);. AddXY (0,02*Pi*i, cos (0,02*Pi*i), "", clBlue);

Jeśli podałeś np. dla danych wyświetlanych na wykresie dwie serie Seria1 oraz Seria4 różne rodzaje - Ciasto oraz bar, wtedy można wprowadzić procedurę zmieniającą typ diagramu na żądanie użytkownika. Ta procedura może być wprowadzona w przypadku na kliknięcie jakiś przycisk, w poleceniu menu lub, na przykład, po prostu w przetwarzaniu kliknięcia na komponencie wykres. Aby przesłać dane do Seria4 i aby ten diagram był niewidoczny w pierwszej chwili, można na końcu powyższej procedury wstawić stwierdzenia

Przypisz (seria1);. aktywny:=fałsz;

Pierwszy z tych operatorów nadpisuje dane umieszczone w Seria1, w serii Seria4. A drugi operator sprawia, że ​​seria jest niewidoczna Seria4. Zmiana typu diagramu odbywa się zgodnie z procedurą

aktywny:= nie Seria1. Aktywny;. aktywny:= nie Seria4. aktywny;

Na rys. 4.8b widać wynik przełączenia użytkownika na inny typ diagramu.

Aby wyświetlić informacje graficzne w bibliotece Delphi, dostarczane są komponenty, których lista znajduje się w tabeli. 6.

Tabela 6

Komponenty do wyświetlania informacji graficznych

Składnik Strona Opis
Obraz (obraz) Dodatkowy Służy do wyświetlania grafiki
PaintBox (okno do rysowania) System Służy do tworzenia obszaru na formularzu, w którym można rysować
DrawGrid (tabela rysunkowa) Dodatkowy Służy do wyświetlania danych nietekstowych w wierszach i kolumnach
Wykres (wykresy i wykresy) Dodatkowy Komponent należy do rodziny komponentów TeeChart, które służą do tworzenia wykresów i grafów
Chartfx (wykresy i grafy) ActiveX Edytor wykresów i wykresów
FIBook (strony Excela) ActiveX Komponent do wprowadzania i przetwarzania informacji liczbowych
Wykres Vt (Wykresy) ActiveX Okno diagramu

Ponadto możesz wyświetlać i wprowadzać informacje graficzne na powierzchni dowolnego elementu okna, który ma tę właściwość Płótno- płótno.

Tabele obrazów — komponenty DrawGrid i StringGrid

Składnik DrawSiatka służy do tworzenia tabeli w aplikacji, która może zawierać grafikę. Ten składnik jest podobny do składnika Siatka sznurkowa, ponieważ ten ostatni pochodzi od siatka do rysowania. Dlatego w DrawSiatka wszystkie właściwości, metody, zdarzenia komponentu są obecne Siatka sznurkowa, inne niż te związane z tekstem, tj. oprócz nieruchomości Komórki, Przełęcze, rzędy, obiekty. Z tego punktu widzenia komponent Siatka ciągów ma znacznie większy potencjał niż siatka do rysowania, ponieważ może przechowywać zarówno obrazy, jak i teksty w komórkach. A jeśli chcesz wpisać tekst do niektórych komórek siatka do rysowania, wtedy będziesz musiał użyć metod do wyprowadzania tekstu na kanwę, co nie jest zbyt wygodne.

składniki DrawGrid i StringGrid mieć płótno Płótno, gdzie można publikować obrazy.

Jest metoda komórka prosta, co zwraca obszar płótna przydzielony dla danej komórki. Ta metoda jest zdefiniowana jako

function CellRect(ACol, ARow: Longint): TRect;

gdzie ACol i ARow- indeksy kolumnowe i wierszowe, zaczynając od 0, na przecięciu których znajduje się komórka. Obszar zwracany przez tę funkcję to obszar płótna, na którym można narysować żądany obraz. Na przykład operator

DrawGridl.Canvas.CopyRect(DrawGridl.CellRect(1,1),

BitMap.Canvas,Rect(0,0,BitMap.Height,BitMap.Szerokość));

kopie według metody KopiujRect do komórki (1,1) tabeli DrawGridl obraz z komponentu mapa bitowa. Ta komórka jest drugą od lewej i drugą od góry w tabeli, ponieważ indeksy zaczynają się od 0. Zauważ, że jeśli wymiary komórki są mniejsze niż rozmiar kopiowanego obrazu, to tylko lewa górna część obrazu zostanie pojawiają się w komórce.

Obraz na płótnie komponentu DrawGrid i StringGrid podobnie jak na kanwie dowolnego komponentu, podlega ona wymazaniu, gdy okno aplikacji nachodzi na inne okna lub na przykład, gdy aplikacja jest zminimalizowana.

Wygodny sposób wprowadzania obrazów do komórek DrawSiatka jest użycie obsługi zdarzeń OnDrawCell. Zdarzenia te występują dla każdej komórki tabeli w momencie jej przerysowania. Nagłówek procedury obsługi wygląda tak:

procedura TForml.DrawGridlDrawCell(Sender: TObject;

ACol, ARow: liczba całkowita; Prost: TRect; Stan: TGridDrawState)

Parametr Państwo wskazuje stan komórki. Jest to zestaw, który może zawierać następujące elementy: gdWybrany- podświetlona komórka skoncentrowany na gd- komórka, która jest w centrum uwagi, gdNaprawiono- komórka w stałym obszarze stołu. Parametr Państwo może służyć do wyświetlania komórek w różny sposób w różnych stanach.

Komponent kształtu

Komponent kształtu można tylko warunkowo przypisać sposobom wyświetlania informacji graficznej, ponieważ przedstawia ona po prostu różne kształty geometryczne, odpowiednio zacienione. Główną właściwością tego składnika jest kształt(formularz), który może przyjmować następujące wartości:

StRectangle - prostokąt;

StKwadrat - kwadrat;

StRoundRect - prostokąt z zaokrąglonymi rogami;

StRouhdSquare - kwadrat z zaokrąglonymi rogami;

StEllipse - elipsa;

StCircle - okrąg.

Inną istotną właściwością komponentu jest Szczotka(szczotka). Ta właściwość jest obiektem typu szczotka, posiadające szereg podwłaściwości, w szczególności kolor (Pędzel.Kolor) i styl (Styl pędzla) wypełnienie kształtu. Możesz zobaczyć wypełnienie w niektórych wartościach stylu na ryc. 3.2. Trzecia ze specyficznych właściwości składnika kształt- Długopis(długopis), który definiuje styl linii.

Komponent wykresu

Teraz rozważ komponent Wykres. Ten komponent pozwala budować różne wykresy i wykresy, które wyglądają bardzo imponująco. Składnik wykres ma wiele właściwości, metod, zdarzeń, więc jeśli weźmiesz pod uwagę je wszystkie, to musiałbyś poświęcić temu cały rozdział. Dlatego ograniczamy się do rozważenia tylko głównych cech Wykres. A resztę znajdziesz we wbudowanej pomocy Delphi lub po prostu wypróbuj je, eksperymentując z diagramami.

Składnik wykres jest pojemnikiem przedmiotów Seria- potomkowie klasy Seria wykresów. Każdy taki obiekt reprezentuje serię danych charakteryzujących się określonym stylem wyświetlania: jeden lub drugi wykres lub wykres. Każdy składnik wykres może obejmować kilka serii. Jeśli chcesz wyświetlić wykres, każda seria będzie odpowiadać jednej krzywej na wykresie. Jeśli chcesz wyświetlać wykresy, w przypadku niektórych typów wykresów możesz nałożyć kilka różnych serii na siebie, w przypadku innych (na przykład w przypadku wykresów kołowych) prawdopodobnie będzie to wyglądać brzydko. Jednak w tym przypadku można ustawić dla jednego komponentu wykres wiele serii tych samych danych z różnym typem wykresu. Następnie, czyniąc jeden z nich aktywnym w każdym momencie, możesz dać użytkownikowi wybór typu wykresu, który wyświetla interesujące go dane.

Umieść jeden lub dwa komponenty wykres w formularzu i spójrz na właściwości, które otwierają się w Inspektorze obiektów. Wyjaśnijmy niektóre z nich.

AllowPanning - określa zdolność użytkownika do przewijania obserwowanej części wykresu podczas wykonywania przez naciśnięcie prawego przycisku myszy. Możliwe wartości: pmNone - przewijanie wyłączone, pmHori/ontal, pm Vertical lub pmBoth - odpowiednio przewijanie dozwolone tylko w kierunku poziomym, tylko w kierunku pionowym lub w obu kierunkach.

AhowZoom - umożliwia użytkownikowi zmianę powiększenia obrazu w czasie wykonywania poprzez wycinanie fragmentów wykresu lub wykresu za pomocą kursora myszy. Jeśli ramka fragmentu jest rysowana w prawo iw dół, to ten fragment jest rozciągany na całe pole wykresu. A jeśli rama zostanie narysowana i po lewej, przywrócona zostanie oryginalna skala.

Tytuł — określa tytuł wykresu.

Stopka — definiuje podpis pod wykresem. Domyślnie brak. Tekst etykiety jest zdefiniowany przez podwłaściwość Tekst.

Ramka — określa ramkę wokół wykresu.

Obok wielu wymienionych właściwości w Inspektorze obiektów znajdują się przyciski z wielokropkiem, które umożliwiają wywołanie jednej lub drugiej strony Edytora wykresów - wielostronicowego okna, które pozwala ustawić wszystkie właściwości wykresów. Wywołanie edytora diagramów jest również możliwe poprzez dwukrotne kliknięcie komponentu wykres lub klikając go prawym przyciskiem myszy i wybierając polecenie Edytuj wykres z wyskakującego menu.

Kliknij dwukrotnie górny komponent Wykres. Zostaniesz przeniesiony do okna Edytora wykresów na stronę Wykres, która ma kilka zakładek. Przede wszystkim zainteresuje Cię zakładka Serie na nim. Kliknij przycisk Dodaj - dodaj serię. Zostaniesz przeniesiony do okna, w którym możesz wybrać rodzaj wykresu lub wykresu. W takim przypadku wybierz Pie - wykres kołowy. Za pomocą zakładki Tytuły można ustawić tytuł diagramu, zakładka Legenda pozwala ustawić opcje wyświetlania legendy diagramu (listy symboli) lub całkowicie ją usunąć z ekranu, zakładka Panel określa wygląd panelu na którym wyświetlany jest diagram, zakładka 3D umożliwia zmianę wyglądu diagramu: nachylenie, ścinanie, grubość itp.

Kiedy pracujesz z edytorem wykresów i wybierzesz typ wykresu, komponenty wykres Twój formularz wyświetla swój wygląd z wprowadzonymi do niego danymi warunkowymi. Dzięki temu możesz natychmiast zaobserwować efekt zastosowania różnych opcji do swojej aplikacji, co jest bardzo wygodne.

Strona Serie, która również posiada wiele zakładek, pozwala wybrać dodatkowe cechy wyświetlania dla serii. W szczególności w przypadku wykresu kołowego na karcie Format warto włączyć opcję Kołowy kołowy, która zapewni wyświetlanie wykresu jako koła o dowolnym rozmiarze składnika Wykres. Na zakładce Znaki przyciski grupy Styl określają, co zostanie zapisane na etykietach związanych z poszczególnymi segmentami wykresu: Wartość - wartość, Procent - procenty, Etykieta - nazwy danych itp.

Jeśli chcesz, możesz dodać kolejną identyczną serię do tego składnika Wykres, klikając przycisk Klonuj na karcie Serie na stronie Wykres, a następnie w przypadku tej nowej serii kliknij przycisk Zmień i wybierz inny typ wykresu, np. Słupkowy .

Wyjdź z Edytora wykresów, wybierz dolny składnik Wykres w aplikacji i powtórz ustawianie dla niego właściwości za pomocą Edytora wykresów. W takim przypadku, jeśli chcesz wyświetlić dwie krzywe na wykresie, musisz określić dwie serie i wybrać typ Wykres liniowy. Ponieważ mówimy o wykresach, możesz użyć zakładek Oś i Ściany, aby ustawić charakterystykę współrzędnych osi i trójwymiarowych ścian wykresu.

Na tym kończy się projektowanie wyglądu aplikacji. Pozostaje napisać kod określający dane, które chcesz wyświetlić. W przypadku aplikacji testowej zdefiniujmy po prostu pewne stałe dane na wykresie kołowym i niektóre funkcje na wykresach.

Aby ustawić wyświetlane wartości, użyj metod serii. Skupmy się na trzech głównych metodach.

metoda Jasne usuwa serię z wcześniej wprowadzonych danych.

metoda Dodać:

Add(Const AValue:Double; Const ALabel:String; AColor:TColor) ,

umożliwia dodanie nowego punktu do wykresu. Parametr Wartość odpowiada wartości dodanej, parametr Etykieta- etykieta, która będzie wyświetlana na wykresie i w legendzie, Kolor- kolor. Parametr Etykieta- opcjonalnie, może być puste: ‘ ’. metoda Dodaj XY:

AddXY(Const AXValue, AYValue: Double; Const ALabel: String; AColor: TColor)

umożliwia dodanie nowego punktu do wykresu funkcji. Opcje AXValue oraz Wartość AY dopasuj argument i funkcję. Opcje Aetykieta i kolor tak samo jak w metodzie Dodać.

Zatem procedura ładowania danych w naszym przykładzie może wyglądać tak:

constAl=155; A2=251; A3=203; A4=404; zmienna i:słowo; zaczynać

Z Seriesl zaczynam

Dodaj(Al,"Sklep l",clŻółty);

Dodaj(A2,"Projekt 2",clBlue);

Dodaj(A3,"Piętro 3",clCzerwony);

Dodaj(A4,"Projekt 4",clFioletowy); koniec;

Seria2.Wyczyść; SeriaS.Clear; dla i:=0 do 100 zacznij

Seria2.AddXY(0,02*Pi*i,sin(0,02*Pi*i)

SeriaS.AddXY(0,02*Pi*i,cos(0,02*Pi*i) koniec;

ClCzerwony); ,clNiebieski);

Operatorzy Jasne są potrzebne, jeśli zamierzasz aktualizować dane podczas działania aplikacji.

To kończy nasze wprowadzenie do komponentu. Wykres. To prawda, że ​​rozważaliśmy tylko niewielką część jego możliwości.

mob_info