Componente per la visualizzazione di informazioni grafiche in Delphi. Presentazione sull'argomento "Visualizzazione di informazioni grafiche in Delphi". Elenco dei componenti per la visualizzazione delle informazioni grafiche

LAVORO DI LABORATORIO

SOGGETTO: « Grafica inseritaDelfi– costruzione del più semplice
forme geometriche"

Brevi informazioni dalla teoria

Delphi fornisce allo sviluppatore tre modi per visualizzare la grafica:

tracciare mentre il programma è in esecuzione

utilizzo di grafica pre-creata

creazione di immagini utilizzando componenti grafici

Per costruire i grafici sono state create apposite classi che forniscono strumenti e metodi per il disegno: gli strumenti sono descritti in tre classi - Tfont, Tpen, Tbrush; L'area di disegno e i metodi sono forniti dalla classe Tcanvas.

ClasseTfont– specifica le caratteristiche del carattere utilizzato per visualizzare il testo sull'area di disegno. Le proprietà della classe sono descritte nella sezione “Proprietà di base disponibili per la maggior parte dei componenti”.

ClassePenna– specifica le caratteristiche della penna (matita) con cui si disegnano le linee.

Proprietà classe Penna:

Colore:Tcolor – colore della linea (predefinito – nero)

Larghezza:intero – spessore della linea in pixel;

Stile = (psSolid, psDash, psDot, psdashDot, psClear) – definisce lo stile della linea (solida, tratteggiata, punteggiata, tratteggiata, invisibile)

ClasseTbrush– imposta le caratteristiche del pennello che dipinge la superficie dell'immagine.

Proprietà classe Tbrush:

Colore:Tcolor – colore del pennello (predefinito – bianco)

Stile– disegno del pennello, può assumere i seguenti valori:

BsSolid – colorazione solida

BsClear – mancanza di ombreggiatura

BsVertical – linee verticali

BsBdiagonal – linee diagonali destre

BsDiagCross – cella obliqua

BsHorizontal – linee orizzontali

BsFdiagonal – linee diagonali a sinistra

BsCross – gabbia

ClasseTtela– determina la superficie su cui viene posizionata l'immagine creata e gli strumenti con cui viene creata l'immagine: font, matita, pennello.

Per impostazione predefinita, l'intera area client del modulo viene utilizzata come area di lavoro (tela) (senza intestazione, menu principale e linee di scorrimento del modulo), ma è possibile allocare aree di lavoro più piccole all'interno del modulo utilizzando i componenti PaintBox O Immagine. L'origine delle coordinate della tela è l'angolo superiore sinistro dell'area di lavoro, la larghezza dell'area di lavoro è determinata dalla proprietà Larghezza cliente, altezza – proprietà Altezza cliente.

Proprietà classe Ttela:

Tela:Tcanvas – definisce l'area di disegno

Spazzola:Tbrush – pennello per riempire forme chiuse

Font:Tfont – carattere per la visualizzazione del testo sulla tela

Penna:Tpen – matita (penna) per disegnare

PenPos:Tpoint – posizione corrente del cursore invisibile sull'area di disegno

Commento : Tipo Tpoint – definito come segue:

Tipo Punto = record

Pixel: Tcolor: imposta i colori dei pixel della tela, X, Y - coordinate dei pixel. La proprietà Pixel è comoda da utilizzare per tracciare grafici utilizzando punti del colore selezionato.

Principali metodi della classe TCanvas

procedura Sposta in(x,y:intero); - sposta la penna senza tracciare una linea verso un punto con coordinate (x, y).

Procedura LineaA(x,y:intero); - disegna una linea dal punto corrente al punto con coordinate (x, y).

Esempio : traccia una linea blu diagonale sulla forma dall'angolo in alto a sinistra all'angolo in basso a destra.

Colore penna:= clblu;

Sposta in(0,0); LineTo(Larghezza Cliente, Altezza Cliente);

procedura Rettangolo(x1,y1,x2,y2:intero); - disegna un rettangolo: x1,y1 – coordinate dell'angolo in alto a sinistra; x2, y2 sono le coordinate dell'angolo in basso a destra.

Esempio : traccia un quadrato ombreggiato di giallo con un lato di 60 pixel al centro della forma.

var Xc,Yc: intero; //

Xc:=ClientWidth div 2;

Xy:=AltezzaCliente div 2;

Canvas.Brush.color:=clgiallo;

Tela.rettangolo(xc-30,Yc-30,xc+30,Yc+30);

procedura Ellisse(x1,y1,x2,y2:intero); - disegna un'ellisse inscritta in un rettangolo con le coordinate specificate.

Esempio : disegna un'ellisse inscritta nel componente PaintBox.

PaintBox1.Canvas.Pen.Width:=4; //larghezza della linea = 4 pixel

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

procedura Poligono(); - disegna un poligono chiuso specificato da un array di coordinate.

Esempio : disegna un diamante pieno che collega i punti medi dei lati della forma

Var Xc,Yc:intero; // coordinate del centro dell'area client del modulo

Xc:=ClientWidth div 2;

Xy:=AltezzaCliente div 2;

Colore.Pennello.Canvas:=Rgb(275,140,70); // arancia colore ombreggiatura

Canvas.Poligono();

FINE;

Procedura Arco(x1,y1,x2,y2,x3,y3,x4,y4:intero); - visualizza l'arco di un'ellisse delimitato da un rettangolo (x1, y1, x2, y2). L'arco viene visualizzato da un punto con coordinate (x3,y3) a un punto con coordinate (x4,y4) contro senso orario.

Esempio : disegna un arco di ellisse che collega il centro del lato superiore del componente
PaintBox con il centro del lato destro.

Procedura Tform1.Button1Click(Sender:Tobject);

Var X3,y3,x4,y4: intero;

Con PaintBox1 fallo

Canvas.Pen.Color:= clWhite;

Larghezza.Penna.Tela:= 3;

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

X3:= ClientWidth div 2;

X4:= Larghezza cliente;

Y4:= Altezza cliente div 2;

Canvas.Pen.Color:= clMaroon;

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

FINE;

procedura Accordo(x1,y1,x2,y2,x3,y3,x4,y4:intero); - disegna una corda - una linea retta che collega 2 punti dell'ellisse: un punto di coordinate (x3, y3) con un punto (x4, y4).

Esempio : Sostituisci il metodo Chord nell'esempio fornito con il metodo ARC e ottieni il seguente risultato.

procedura Torta(x1,y1,x2,y2,x3,y3,x4,y4:intero); - disegna un segmento di ellisse che collega il centro dell'ellisse con le coordinate (x3,y3) e (x4,y4).

Esempio : Nell'esempio fornito per il metodo ARC, immagina il metodo PIE e ottieni questo risultato.

procedura TextOut(x,y:intero;Testo:stringa); - restituisce la stringa passata nel parametro Text a un rettangolo di cui è specificato l'angolo superiore sinistro coordinate x,y. Le caratteristiche del carattere vengono impostate dallo strumento Carattere.

Esempio : scrivere il nome del grafico tracciato in fondo al modulo.

Altezza.Carattere.Canvas:=20 ; //altezza del carattere 20 pixel

Canvas.Font.Color:=clblue;

Canvas.TextOut(10, ClientHeight-24, 'grafico della funzione SIN(X)');

Componenti grafici

Delphi offre una serie di componenti già pronti che ti consentono di migliorare interfaccia utente. Questi componenti si trovano nella pagina Ulteriori E Sistema tavolozze dei componenti.

ComponenteImmagine(ClasseImmagine) – creato per visualizzare immagini grafiche archiviate in file esterni con estensioni:

Ico(icona, pittogramma);

Bmp (bitmap, bitmap);

Wmf, .emf (metafile);

Jpg, .jpeg (immagine compressa JPEG).

Di base proprietà :

Dimensione dell'auto:boolean – se impostato su true, il componente adatta le sue dimensioni alla dimensione dell'immagine caricata; l'impostazione predefinita è falsa.

Stirata:boolean – se vero, il valore caricato occupa l'intera area del componente; l'impostazione predefinita è falsa.

Tela:Tcanvas – utilizzato per disegnare all'interno del componente durante l'esecuzione del programma.

Immagine:Tpicture - Definisce l'immagine inserita nel componente.

Di base metodi classe Timmagine:

Procedura Carica da file(Nome file:stringa); - carica un'immagine da un file denominato Filename nel componente.

Procedura Salva su file(Nome file:stringa); -salva l'immagine dal componente in un file denominato Nome file.

ComponentePaintBox - definisce un'area di disegno rettangolare. La proprietà principale è Tela, sono disponibili tutti i metodi della classe Tcanvas, non ha proprietà indipendenti.

Esempio : disegna un'ellisse gialla inscritta nel componente PaintBox1.

Procedura Tform1Button1Click(mittente:Tobject);

Con PaintBox1.Canvas fai

Pennello.Colore:=clgiallo;

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

FINE;

ComponenteBitBtn – pulsante raster

Il pulsante BitBtn, a differenza di quello standard, può contenere, oltre al titolo (Caption), un'immagine specificata dalla proprietà Glifo. Esiste una serie di pulsanti BitBtn standard, con proprietà predefinite (con un'immagine, un'iscrizione e uno scopo specifici): il tipo di pulsante standard viene selezionato tramite la proprietà Tipo. Tipo=(bkPersonalizzato, bkInterrompi,bkAnnulla, bkChiudi …)

Compito n. 1

Crea un'applicazione che contiene due componenti Immagine e 4 pulsanti sulla videata principale ("Carica immagine", "Costruisci una figura geometrica", "Cambia colore", "Esci"), e ti permette di:

a) caricare l'immagine grafica selezionata dall'utente nel componente Immagine1 in modo che l'immagine occupi l'intera area del componente Immagine.

b) sotto il componente Immagine1 viene visualizzata la scritta “Questa è un'immagine da un file.

(per l'eventuale misurazione delle dimensioni e della posizione del componenteImmagine1 iscrizione dovrebbe
situato rigorosamente sotto il componente).

c) disegna una figura geometrica all'interno del componente Immagine2: un segmento di ellisse pieno che collega il centro del componente Immagine con il centro dei lati inferiore e destro del componente Immagine.

(per qualsiasi modifica delle dimensioni e della posizione del componenteImmagine2 la figura deve essere costruita correttamente, cioè secondo le specifiche del componenteImmagine2)

d) cambiare il colore della linea di una figura disegnata in Immagine2 su richiesta dell'utente utilizzando il componente ColorDialog.

Compito n. 2

Crea un'applicazione che ti consenta di posizionare diverse etichette in modo casuale (ad esempio, la parola "Evviva!") in un componente Immagine. Per implementare ciò, utilizzare il generatore di numeri casuali Randomize e la funzione Random.

Le dimensioni del componente Immagine, la parola visualizzata nell'Immagine e il numero di parole devono essere inserite dall'utente.

Compito n.3

Crea un'applicazione che ti permetta di selezionare il nome di una forma geometrica da un ListBox e disegnare la forma selezionata nel componente Immagine. Il colore della forma viene selezionato dal componente RadioGroup.

Compito n. 4

Dividi il componente PaintBox1 in 4 parti uguali, dipingi ciascuna parte di un colore diverso, ad esempio: blu, giallo, verde, rosso.

Accanto a ciascun angolo di PaintBox1, scrivi le coordinate di quell'angolo (relative all'origine del modulo su cui si trova il componente PaintBox1).

Compito n.5

CON

seleziona il tipo di forma da disegnare dal componente Radiogroup1, il colore di riempimento dal componente Radiogroup2 e disegna la forma selezionata nel componente Immagine.

Compito n. 6

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Dividi il componente PaintBox1 in 2 parti uguali, all'interno di ciascuna parte disegna un'ellisse, riempita con il colore selezionato dall'utente nel ColorDialog.

Compito n.7

CON Crea un'applicazione che ti permetta di:

seleziona il nome di una forma geometrica dalla ListBox e disegna la forma selezionata nel componente Immagine. La forma deve essere riempita con il colore selezionato dall'utente nel componente ColorDialog se Sì è selezionato nel componente RadioGroup.

Compito n. 8

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Dividi il componente PaintBox1 in 4 parti uguali, all'interno di ciascuna parte disegna una forma geometrica diversa (ellisse, rombo, triangolo e rettangolo). Il colore di ciascuna forma viene selezionato dall'utente nel ColorGrid.

Compito n. 9

seleziona il nome della forma geometrica dalla ListBox
forme (ellisse, rombo, rettangolo) e disegnare
la forma selezionata nel componente Immagine. Posizione
forme nel componente Immagine (I quarto, II quarto,

III o IV quarto) e viene selezionato il colore della figura
dai componenti di RadioGroup.

Compito n. 10

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Fornire che la dimensione laterale non possa essere testo, non possa essere un numero negativo e non possa superare la dimensione del modulo più piccola.

Dividi il componente PaintBox1 in 4 parti uguali, all'interno di ciascuna parte disegna una forma geometrica selezionata dall'utente nel Combobox (ellisse, rombo, triangolo e rettangolo). Il colore della figura è selezionato dall'utente nel ColorBox.

Compito n. 11

Crea un'applicazione che ti permetta di:

selezionare dal componente Radiogroup la posizione del disegno

nel componente Immagine del triangolo rettangolo, imposta
il colore dell'ombreggiatura o del contorno della figura, a seconda
abilitare i pulsanti Casella di controllo. Seleziona il colore tramite
Componente ColorGrid.

Compito n. 12

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Fornire che la dimensione laterale non possa essere testo, non possa essere un numero negativo e non possa superare la dimensione del modulo più piccola.

Dividi il componente PaintBox1 in 2 parti uguali, all'interno di una delle parti disegna una forma geometrica selezionata dall'utente nel Combobox (ellisse, rombo, triangolo e rettangolo). Il colore della figura è selezionato dall'utente nel ColorBox.

Ad esempio, puoi modificare il colore del modulo come segue:

form1.Color:= ColorBox1.Colors;

Compito n. 13

Crea un'applicazione che ti permetta di:

a) disegnare un quadrato al centro della forma (la dimensione del lato del quadrato viene inserita dall'utente). Fornire che la dimensione laterale non possa essere testo, non possa essere un numero negativo e non possa superare la dimensione del modulo più piccola.

b) dividere il quadrato in una o due diagonali, a seconda dell'inclusione dei pulsanti Casella di controllo, e dipingere ciascun triangolo risultante con un colore diverso. La scelta del colore è fatta dall'utente.

Compito n. 14

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Fornire che la dimensione laterale non possa essere testo, non possa essere un numero negativo e non possa superare la dimensione del modulo più piccola.

Dividi il componente PaintBox1 in 2 parti uguali, all'interno di una parte disegna un rombo e all'interno dell'altra parte disegna un triangolo qualsiasi. Il colore della figura è selezionato dall'utente nel ColorBox.

Ad esempio, puoi modificare il colore del modulo come segue:

form1.Color:= ColorBox1.Colors;

Compito n. 15

Crea un'applicazione che ti permetta di:

a) impostare le dimensioni del componente Immagine in senso orizzontale e verticale affinché siano uguali e uguali al numero inserito dall'utente da tastiera;

(a condizione che la dimensione del lato non possa essere testo, non possa essere un numero negativo e non possa superare la dimensione del modulo più piccola)

b) dividere la componente Immagine in 4 quadrati uguali con due linee blu;

c) all'interno di ciascun quadrato risultante, disegnare un cerchio inscritto in esso (permettere all'utente di scegliere il colore dei cerchi attraverso la finestra di dialogo di selezione del colore).

Compito n. 16

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Fornire che la dimensione laterale non possa essere testo, non possa essere un numero negativo e non possa superare la dimensione del modulo più piccola.

Dividi il componente PaintBox1 in 9 parti uguali e dipingi ciascun rettangolo della scacchiera risultante. Il colore di riempimento viene selezionato dall'utente nel ColorBox.

Ad esempio, puoi modificare il colore del modulo come segue:

form1.Color:= ColorBox1.Colors;

Compito n. 17

Nel modulo, posiziona due componenti Immagine e quattro pulsanti: Colore linea, Colore riempimento, Ok ed Esci; e il componente Modifica.

Quando si fa clic sul pulsante OK, nell'Immagine1 viene disegnato un quadrato con il lato X e nell'Immagine2 viene disegnato un triangolo rettangolo con i cateti uguali, ciascuno dei quali ha lunghezza X.

Il vertice del triangolo coincide con l'origine di Immagine2. Uno dei vertici del quadrato coincide con l'origine di Immagine1.

Il pulsante OK diventa disponibile solo dopo aver selezionato un colore di linea e un colore di riempimento per disegnare la forma.

X – seleziona in modo casuale, utilizzando Funzioni casuali e il componente Modifica dovrebbe visualizzare il valore di X.

Compito n. 18

Creare un'applicazione che consenta all'utente di impostare le dimensioni del componente PaintBox1 (in pixel).

Dividere il componente PaintBox1 in 4 parti uguali; all'interno della parte selezionata dall'utente dovrà essere costruito un cerchio pieno, la cui dimensione è impostata dall'utente. L'utente seleziona il colore di riempimento nel ColorBox.

Ad esempio, puoi modificare il colore del modulo come segue:

form1.Color:= ColorBox1.Colors;

Per visualizzare le informazioni grafiche, la libreria Delphi fornisce componenti, il cui elenco è riportato nella tabella. 6.

Tabella 6

Componenti per la visualizzazione di informazioni grafiche

Componente	Pagina	Descrizione
Immagine	Ulteriori	Utilizzato per visualizzare la grafica
PaintBox (finestra per disegnare)	Sistema	Utilizzato per creare un'area nel modulo in cui è possibile disegnare
DrawGrid (tabella dei disegni)	Ulteriori	Utilizzato per visualizzare dati non di testo in righe e colonne
Grafico (diagrammi e grafici)	Ulteriori	Il componente appartiene alla famiglia di componenti TeeChart, utilizzata per creare diagrammi e grafici
Chartfx (grafici e grafici)	ActiveX	Editor di grafici e grafici
FIBook (pagine Excel)	ActiveX	Componente di input ed elaborazione di informazioni numeriche
VtChart (grafici)	ActiveX	Finestra di diagramma

Inoltre, è possibile visualizzare e inserire informazioni grafiche sulla superficie di qualsiasi componente della finestra che abbia questa proprietà Tela- tela.

Tabelle immagine: componenti DrawGrid e StringGrid

Componente DrawGrid utilizzato per creare una tabella nell'applicazione che può contenere immagini grafiche. Questo componente è simile al componente StringGrid poiché quest'ultimo deriva da DrawGrid. Pertanto dentro DrawGrid tutte le proprietà, metodi, eventi del componente sono presenti StringGrid tranne quelli relativi al testo, cioè tranne le proprietà Celle, Colonne, righe, oggetti. Da questo punto di vista il componente StringGrid ha capacità significativamente maggiori rispetto a DrawGrid poiché può memorizzare sia immagini che testi nelle celle. E se vuoi inserire del testo in alcune celle DrawGrid quindi dovrai utilizzare metodi per visualizzare il testo su uno schema per questo, il che non è molto conveniente.

Componenti DrawGrid e StringGrid avere uno schema Tela, su cui è possibile pubblicare immagini.

C'è un metodo Cell-Rect, che restituisce l'area di tela allocata per una determinata cella. Questo metodo è definito come

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

Dove ACol e ARow- indici di colonna e di riga a partire da 0, all'intersezione del quale si trova la cella. L'area restituita da questa funzione è l'area della tela in cui è possibile disegnare l'immagine desiderata. Ad esempio, l'operatore

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

BitMap.Canvas,Rect(0,0,BitMap.Altezza,BitMap.Larghezza));

metodo delle copie CopiaRect alla cella (1,1) della tabella DrawGridl immagine dal componente BitMap. Questa cella è la seconda da sinistra e la seconda dall'alto nella tabella, poiché gli indici iniziano da 0. Tieni presente che se la cella è più piccola della dimensione dell'immagine copiata, apparirà solo la parte superiore sinistra dell'immagine la cellula.

Immagine sull'area di disegno del componente DrawGrid e StringGrid, come nel canvas di qualsiasi componente, è soggetto a cancellazione quando la finestra dell'applicazione viene sovrapposta ad altre finestre o, ad esempio, quando l'applicazione viene ridotta a icona.

Un modo conveniente per inserire immagini nelle celle DrawGrid consiste nell'utilizzare un gestore di eventi Su DrawCell. Questi eventi si verificano per ciascuna cella della tabella nel momento in cui viene ridisegnata. L'intestazione del gestore è simile a:

procedura TForml.DrawGridlDrawCell(Mittente: TObject;

ACol, ARow: intero; Retto: TRetto; Stato: TGridDrawState)

Parametro Stato indica lo stato della cella. È un insieme che può contenere i seguenti elementi: gdselezionato- cella selezionata, gdFocused- la cella messa a fuoco, gdFixed- una cella in un'area fissa della tabella. Parametro Stato può essere utilizzato per visualizzare le celle in modo diverso in stati diversi.

Componente di forma

Componente di forma può essere classificato solo condizionatamente come mezzo di visualizzazione di informazioni grafiche, poiché rappresenta semplicemente varie forme geometriche, opportunamente ombreggiate. La proprietà principale di questo componente è Forma(form), che può assumere i seguenti valori:

StRectangle – rettangolo;

StSquare – quadrato;

StRoundRect - rettangolo con angoli arrotondati;

StRouhdSquare - quadrato con angoli arrotondati;

StEllipse – ellisse;

StCircle - cerchio.

Un'altra proprietà essenziale del componente è Spazzola(spazzola). Questa proprietà è un oggetto di tipo TBrush, avere una serie di sottoproprietà, in particolare il colore (Pennello.Colore) e stile (Stile.Pennello) riempiendo la figura. Puoi vedere il riempimento per alcuni valori di Stile in Fig. 3.2. La terza proprietà specifica del componente Forma- Penna(penna) che definisce lo stile della linea.

Componente grafico

Ora diamo un'occhiata al componente Grafico. Questo componente ti consente di creare vari diagrammi e grafici dall'aspetto davvero impressionante. Componente Grafico ha tantissime proprietà, metodi, eventi, tanto che se li considerassimo tutti dovremmo dedicare a questo un intero capitolo. Ci limiteremo quindi a considerare solo le caratteristiche principali Grafico. Puoi trovare il resto nella guida integrata di Delphi o semplicemente provarli sperimentando con i diagrammi.

Componente Graficoè un contenitore di oggetti Serie- eredi della classe TCharSeries. Ciascuno di questi oggetti rappresenta una serie di dati caratterizzati da un certo stile di visualizzazione: un particolare grafico o diagramma. Ogni componente Grafico può includere diversi episodi. Se si desidera visualizzare un grafico, ciascuna serie corrisponderà a una curva sul grafico. Se vuoi visualizzare i grafici, per alcuni tipi di grafici puoi sovrapporre diverse serie diverse una sopra l'altra, per altri (come i grafici a torta) probabilmente sembrerà brutto. Tuttavia, anche in questo caso, è possibile impostare un solo componente Grafico diverse serie di dati identici con tipi diversi diagrammi. Poi, rendendone attivo di volta in volta uno, è possibile fornire all'utente la possibilità di scegliere il tipo di grafico in cui visualizzare i dati di suo interesse.

Posizionare uno o due componenti Grafico sul modulo e osserva le proprietà che si aprono nell'Ispettore oggetto. Ecco alcune spiegazioni di alcuni di essi.

PermettiPanning: determina la capacità dell'utente di scorrere la parte osservata del grafico durante l'esecuzione premendo il tasto destro del mouse. Valori possibili: pmNone - lo scorrimento è vietato, pmHori/ontal, pm Verticale o pmEntrambi - lo scorrimento è consentito, rispettivamente, solo in direzione orizzontale, solo in direzione verticale o in entrambe le direzioni.

AhowZoom: consente all'utente di modificare lo zoom di un'immagine in fase di esecuzione ritagliando porzioni di un diagramma o grafico con il cursore del mouse. Se la cornice di un frammento viene disegnata verso destra e verso il basso, questo frammento viene allungato per coprire l'intero campo del grafico. E se la cornice viene disegnata verso sinistra, viene ripristinata la scala originale.

Titolo: definisce il titolo del diagramma.

Piede: definisce la didascalia sotto il diagramma. Nessuno per impostazione predefinita. Il testo della firma è determinato dalla proprietà secondaria Text.

Cornice: definisce la cornice attorno al diagramma.

Accanto a molte delle proprietà elencate nell'Ispettore oggetto ci sono pulsanti con ellissi che ti consentono di richiamare l'una o l'altra pagina dell'editor dei grafici, una finestra a più pagine che ti consente di impostare tutte le proprietà dei grafici. L'editor di diagrammi può essere richiamato anche facendo doppio clic sul componente Grafico oppure facendo clic con il tasto destro su di esso e selezionando il comando Modifica grafico dal menu a comparsa.

Fare doppio clic sul componente superiore Grafico. Verrai indirizzato alla finestra Editor grafico nella pagina Grafico, che ha diverse schede. Prima di tutto, ti interesserà la scheda Serie su di esso. Fare clic sul pulsante Aggiungi: aggiungi una serie. Verrai indirizzato a una finestra in cui potrai selezionare il tipo di grafico o grafico. In questo caso, seleziona Torta: un grafico a torta. Utilizzando la scheda Titoli è possibile impostare il titolo del grafico, la scheda Legenda consente di impostare i parametri per visualizzare la legenda del grafico (elenco di simboli) o rimuoverla del tutto dallo schermo, la scheda Pannello determina l'aspetto del pannello su in cui viene visualizzato il grafico, la scheda 3D ti dà l'opportunità di modificare l'aspetto del tuo grafico: inclinazione, spostamento, spessore, ecc.

Quando lavori nell'editor dei grafici e hai selezionato un tipo di grafico, i componenti Grafico Il tuo modulo mostra il suo aspetto con i dati condizionali immessi al suo interno. Pertanto, puoi vedere immediatamente il risultato dell'applicazione di varie opzioni alla tua applicazione, il che è molto conveniente.

La pagina Serie, che presenta anch'essa una serie di schede, ti dà la possibilità di selezionare opzioni di visualizzazione aggiuntive per la serie. In particolare, per un grafico a torta, nella scheda Formato, è utile abilitare l'opzione Torta cerchiata, che garantirà che il grafico venga visualizzato come un cerchio a qualsiasi dimensione del componente Grafico. Nella scheda Segni, i pulsanti del gruppo Stile determinano cosa verrà scritto sulle etichette relative ai singoli segmenti del grafico: Valore - valore, Percentuale - percentuali, Etichetta - nomi dei dati, ecc.

Puoi, se lo desideri, aggiungere un'altra serie identica a questo componente Grafico facendo clic sul pulsante Clona nella scheda Serie della pagina Grafico, quindi per questo nuova serie Fare clic sul pulsante Cambia e selezionare un tipo di grafico diverso, ad esempio A barre.

Uscire dall'editor dei grafici, selezionare il componente grafico inferiore nell'applicazione e ripetere l'impostazione delle sue proprietà utilizzando l'editor dei grafici. In questo caso, dovrai specificare due serie se desideri visualizzare due curve sul grafico e selezionare il tipo di grafico a linee. Perché il stiamo parlando riguardo ai grafici, è possibile utilizzare le schede Asse e Muri per specificare le caratteristiche delle coordinate degli assi e dei bordi tridimensionali del grafico.

Questo è tutto per il design aspetto l'applicazione termina. Non resta che scrivere il codice che specifica i dati che desideri visualizzare. Per l'applicazione di test, impostiamo solo alcuni dati costanti nel grafico a torta e alcune funzioni nei grafici.

Per impostare i valori visualizzati è necessario utilizzare i metodi Serie. Concentriamoci solo su tre metodi principali.

Metodo Chiaro cancella una serie di dati precedentemente inseriti.

Metodo Aggiungere:

Aggiungi(Cost AValore:Doppio; Cost ALabel:Stringa; AColor:TColor) ,

consente di aggiungere un nuovo punto al diagramma. Parametro Un valore corrisponde al valore aggiunto, parametro Un'etichetta- un'etichetta che verrà visualizzata sullo schema e nella legenda, Un colore- colore. Parametro Un'etichetta- facoltativo, può essere lasciato vuoto: ‘ ’. Metodo AggiungiXY:

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

consente di aggiungere un nuovo punto al grafico della funzione. Opzioni ValoreAX E AYValore corrispondono ad argomento e funzione. Opzioni ALabel e AColor lo stesso del metodo Aggiungere.

Pertanto, la procedura per caricare i dati nel nostro esempio potrebbe essere simile a:

cost Al=155; A2=251; A3=203; A4=404; var i:parola; inizio

Con Series cominciamo

Add(Al,"Workshop l",clGiallo);

Aggiungi(A2,"Workshop 2",clBlu);

Aggiungi(A3,"Workshop 3",clRosso);

Aggiungi(A4,"Workshop 4",clViola); FINE;

Serie2.Cancella; SerieS.Clear; per i:=da 0 a 100 iniziano

Serie2.AddXY(0,02*Pi*i,sen(0,02*Pi*i)

SerieS.AddXY(0,02*Pi*i,cos(0,02*Pi*i) end;

ClRosso); ,clBlu);

Operatori Chiaro sono necessari se si aggiornano i dati mentre l'applicazione è in esecuzione.

Questo conclude la nostra introduzione al componente Grafico.È vero, abbiamo considerato solo una piccola parte delle sue capacità.

"Visualizzazione delle informazioni grafiche in Delphi" Descrizione dell'argomento: 1.C S pppp ooooo ssss ooooo bbbb yyyy in in in yyyy vvvv ooooo dddd aaaa yy g rrrrr aaaa ffff iii hhhh eee ssss kkkk ooooo yyyy nnnn ffff ooooo rrrrr mmmm ahhh tskst iiiiii iiiiii in iv in D D D D eeee llll pppp hhhh iiii O O tttt ooo bbbb rrrrr aaaa zhzhzh eee nnnn iiii eee k k k aaaa rrrrr tttt iiii nnnnn ooooo kkkk O O tttt ooooo bbbb rrrrr aaa zhzhzh eee nnnnn iiiiii eee g g y g eee ooooo mmmm eee ttt rr rr iiii hhchh eee ssss kkkk iiii xxxxx ffff iiii yyyy uuuu rrrrr P Pooooo ssss ttt rrrrr ooooo eee nnnn iiii eee yy g g rrrrr aaaa ffff iiii kkkk ooooo vvvv i i i and d d d d iiiiii aaaa yyyy rrrrr aaaa mmmm mmmm....

1. Metodi per visualizzare le informazioni grafiche. In Delphi, ci sono diversi modi per visualizzare le informazioni grafiche: Output di immagini pre-preparate (componenti Immagine, Forma); P Costruzione di grafici e diagrammi (Componente grafico, ecc.); F Formazione di immagini a livello di codice (oggetto Canvas).

2.Visualizza 2.Visualizza immagini. La visualizzazione di immagini utilizzando il componente Immagine che abbiamo esaminato in LLC DDDDD DDDD LLC Yiyy e e e ZZZZ P P P P PRRRDDDDDDDDDDDDDD IIII XXXX T T T T T T T T T T TOTEMMM .... Qui considereremo un esempio di implementazione animazione più semplice modificando periodicamente l'immagine visualizzata nei componenti Immagine. PPPP eee rrrrr eee yyyyeee nnnna

3.Visualizzazione 3.Visualizzazione di forme geometriche. E Da diversi componenti Shape è possibile creare semplici disegni. P Modificando a livello di codice la posizione (.Left,.Top), la dimensione (.Width,.Height) e il colore (Brush.Color) dei componenti Shape in un disegno, è possibile implementare elementi dell'animazione più semplice. R R R R aaaa ssssssss mmmm ooooh tttt rrrrr eee tttt sì p p p p rrrrr iii mmmm eee rrrrr....

4.Costruzione 4.Costruzione di grafici e diagrammi. I diagrammi sono progettati per una rappresentazione più visiva degli array di dati numerici, la loro visualizzazione e analisi. PPPP rrrrr iiii mmmm eee rrrrr.... Per creare grafici in Delphi ci sono diversi componenti, uno di questi è il componente Chart (sezione TeeChart Std).

Grafici e diagrammi. I dati da visualizzare vengono solitamente passati al Grafico a livello di codice, ad esempio: Series1.Clear; (serie cancellata) per i:=1 a N do Series1.addxy(i, A[i], clGreen); Valore dell'asse X Valore dell'asse Y Etichetta dell'asse X Colore dei dati sul grafico PP aaaa sssssssssss mmmm ooooo tttt rrrrr eee tttt yee p p p p prrrr iiii mmmm eee rrrrr p p p poooo ssss ttt rrrrr ooooo eee nnnn iiiiii yayyy yyyy rrrrr aaaa ffff iii kkkk aa aa f f f f uuuu nnnn kkkk tsstst iiiiii y y y y = = = = S S S S iiii nnnn ((((xxxx))))

Successivo: Lavoro di laboratorio ““““ OOOO tttt ooooo bbbb rrrrr aaaa zhzhzh eee nnnn iiii eee k k k k aaaa rrrrr tttt iiii nnnn ooooo kkkk i i i i yyyy eee ooooo mmmm eee tttt rrrrr iiii hchchh eee ssss kkkk iiii xxxx ffff iiii yyyy uuuu rrrrr, e e e xxxx a a a a a nnnn iiii mmmm aaaa tsstst iiii yayayaya """"...Compito: 1) Sviluppare un'applicazione per eseguire semplici animazioni modificando periodicamente l'immagine visualizzata nei componenti Immagine. (Il numero di immagini è almeno tre, scegli tu stesso le immagini).

Altro: Lavoro di laboratorio ““ ““ “PPP OOOO SSSS TTTTTT RRRR LLODNNNNNNNNNEIIEE IIEE Grrrr AAAAA FFF III KKKK OOO VVVV e IIIA AAAAA GGG RRRR AAAAA MMMMMM” ”” ”” "" "" "" "" " ..Compito: 1) M modificare l'applicazione da lavoro di laboratorio 9 (Visualizzare i dati in una tabella). Aggiungi la possibilità di visualizzare alcuni dati da una tabella in un istogramma o in un grafico a torta. 2) Costruire un grafico della funzione data.

Visual Component Library (VCL) Delphi ci fornisce i seguenti componenti visivi per la visualizzazione di informazioni grafiche: Image (immagine), PaintBox (finestra per disegnare), DrawGrid (tabella di immagini), Chart (diagrammi e grafici), Animate (output di clip video ), nonché il modulo. Questi componenti hanno una proprietà Canvas (discussa sopra) che dà accesso a ciascun pixel. Naturalmente, non è necessario disegnare pixel per pixel per lavorare con la grafica in Delphi; il sistema Delphi fornisce potenti strumenti per lavorare con la grafica.

Diamo uno sguardo più da vicino ai componenti di cui sopra:

Componente immagine

È un oggetto della classe TImage. Utilizzato per visualizzare le immagini lette da file grafici. Per impostazione predefinita, visualizza le immagini presentate in formato *.bmp sulla superficie del modulo. Per produrre immagini in formato jpg, è necessario includere il modulo JPEG nella direttiva uses. Situato nella scheda Avanzate della tavolozza dei componenti.

Dopo aver posizionato il componente Immagine sul modulo, assume la forma di un'area rettangolare selezionata.

Figura 9 - Componente immagine sul modulo

Per aprire una finestra di dialogo per la selezione dell'immagine desiderata, è necessario effettuare le seguenti operazioni utilizzando l'Ispettore oggetto. Per fare ciò, trova la proprietà Immagine e fai clic sui tre punti a sinistra di essa. Si apre la finestra Editor di immagini e in essa seleziona Carica; nella finestra che si apre, seleziona il file immagine.

Questa operazione può essere eseguita anche a livello di codice chiamando il metodo LoadFromFile della proprietà Picture:

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

dove name_pic.jpeg è il nome del file.

Tabella 8 - Proprietà di base del componente Immagine

Proprietà		Descrizione
		Immagine visualizzata nel campo del componente
	Dimensioni dei componenti. Se queste dimensioni sono inferiori a quelle dell'illustrazione e le proprietà Stretch, AutoSize e Proportional sono impostate su False, viene visualizzata parte dell'immagine
	Consente di ridimensionare automaticamente le immagini senza distorsioni. Per eseguire il ridimensionamento, la proprietà AutoSize deve essere impostata su False
	Consente di ridimensionare (ridurre o allungare) automaticamente un'immagine per adattarla alle dimensioni del componente Immagine. Se la dimensione del componente non è proporzionale alla dimensione dell'immagine, l'immagine risulterà distorta
	Consente di ridimensionare automaticamente un componente per adattarlo alle dimensioni dell'immagine
	Consente di determinare la posizione orizzontale dell'immagine nel campo del componente Immagine se la larghezza dell'immagine è inferiore alla larghezza del componente.
	Superficie per la visualizzazione della grafica
	Specifica un colore di sfondo trasparente per l'immagine

Esempio 1: scrivere un programma per visualizzare le immagini utilizzando il componente Image. Il programma deve avere le seguenti funzionalità:

• · visualizzare le immagini nella cartella;
• · visualizzare l'immagine a schermo intero o nel formato più adatto alla dimensione della finestra;
• · gestire file di immagini, nonché stampare, salvare, eliminare e modificare immagini;
• · se necessario, aprire l'immagine in un programma di editing;

Figura 10 – Finestra del programma prima dell'avvio

Creazione di un progetto:

• 1. Creare una cartella per i file del programma e avviare l'ambiente di sviluppo integrato Delphi.
• 2. Aggiungi componenti al modulo:

Per prima cosa posizioneremo sul modulo il componente Immagine, il componente principale con cui dovremo lavorare. Oltre a questo, avremo bisogno dei seguenti componenti:

• · ScrollBox È necessario quando in modalità a grandezza naturale l'immagine andrà oltre l'immagine. Assegniamo il valore alClient alla sua proprietà Aling in modo che le sue dimensioni cambino proporzionalmente alla dimensione della finestra. E posiziona il componente Immagine su di esso;
• · Aggiungeremo anche i componenti di dialogo SavePictureDialog e OpenPictureDialog, progettati per salvare e aprire le immagini. Il primo ci serve per copiare l'immagine nella directory selezionata, il secondo per richiamare la finestra di dialogo di apertura file grafico. Si trovano nella pagina Dialoghi della Component Palette. Da questa pagina abbiamo bisogno anche del componente PrintDialog, che dobbiamo richiamare la finestra di dialogo per selezionare una stampante per la stampa.
• · Aggiungi MainMenu per aggiungere un menu principale al programma e XPManifest per un design più colorato
• · Dobbiamo anche memorizzare da qualche parte i nomi delle immagini che si trovano nella directory di lavoro. Il componente ListBox è comodo per questi scopi; può essere nascosto durante l'elaborazione dell'evento Create del Form1.
• · Per posizionare i pulsanti di navigazione e lavorare comodamente con essi, aggiungeremo un pannello Velo, sul quale posizioneremo questi pulsanti (Immagine precedente, Immagine successiva, Dimensioni reali, Adatta alle dimensioni, Elimina, Copia in, Stampa, Modifica). SpeedButton è selezionato come componente per loro.
• · Aggiungere un timer per catturare le sequenze di tasti "Sinistra" (immagine precedente), "Destra" (immagine successiva) e il tasto "Canc" (eliminazione dell'immagine).
• · E un altro componente: ProgressBar, che mostra il processo di caricamento di file *.Jpg di grandi dimensioni.
• 3. Scrivere il codice per l'elaborazione dell'evento clic sul pulsante (Immagine precedente, Immagine successiva, Dimensioni reali, Adatta alle dimensioni, Elimina, Copia in, Stampa, Modifica). Scrivi il codice per elaborare l'evento di clic sulle voci del menu MainMenu (Esci, Apri, Chiudi, Crea).
• 4. Definire le impostazioni iniziali per la creazione del modulo. Fare doppio clic su spazio libero form e scrivere il codice della procedura procedure TForm1.FormCreate(Sender:TObject), vedere il codice del modulo nell'Appendice 1.
• 5. Scrivere procedure del seguente tipo:

procedura TrovaFileInCartella(percorso, ext: stringa);

Questa procedura esegue la scansione del percorso della cartella per i file utilizzando la maschera ext.

L'elenco completo del codice del modulo di programma si trova nell'Appendice 1 (Elenco programmi 3).

• 1. Elencare le funzionalità del componente Immagine.
• 2. Di quale classe è oggetto il componente Immagine?
• 3. 3. Quale tipo di file supporta il componente Immagine per impostazione predefinita?
• 4. 4. Elencare le proprietà principali del componente Immagine.
• 5. 5. Quale proprietà memorizza l'immagine del componente Immagine?

Descrizione della presentazione per singole diapositive:

1 diapositiva

Descrizione diapositiva:

2 diapositive

Descrizione diapositiva:

Mezzo visivo Programmazione Delphi, come Windows, supporta GUI utente (GDI – Interfaccia Grafica Delphi). In Delphi, ci sono due modi per visualizzare le informazioni grafiche: visualizzare immagini pre-preparate; attingendo dal programma.

3 diapositive

Descrizione diapositiva:

Il primo metodo si basa sull'utilizzo dei componenti Immagine e Forma. Puoi utilizzare un'immagine già pronta (icona) o crearla tu stesso utilizzando l'editor di immagini. Il secondo modo è generare immagini a livello di codice utilizzando l'oggetto Canvas.

4 diapositive

Descrizione diapositiva:

Delphi ha a sua disposizione oggetto speciale, a cui viene assegnato lo stile di una proprietà Canvas. È disponibile solo mentre l'applicazione è in esecuzione, quindi può essere controllata solo dal programma tramite scrittura codice richiesto nel linguaggio Object Pascal. Se un oggetto ha la proprietà Canvas, puoi disegnare sulla sua superficie. I candidati più adatti per questo ruolo sono il modulo stesso e il componente speciale PaintBox.

5 diapositive

Descrizione diapositiva:

Proprietà oggetto tela: Penna – proprietà per disegnare linee e bordi di forme geometriche. La penna segue i comandi del cursore grafico e, a sua volta, ha le proprie proprietà nidificate: Colore – determina il colore della linea (nera per impostazione predefinita); Modalità – stile di disegno (ha molti significati che qui non vengono indicati); Stile – stile della linea, che può assumere i seguenti valori: рsSolid – solido (predefinito); рsDosh – tratteggiato; psDot – punteggiato; рsDoshDot – linea tratteggiata (e altre proprietà); Widh – spessore della linea (predefinito 1 pixel);

6 diapositive

Descrizione diapositiva:

Pennello – una proprietà per riempire le forme con le seguenti proprietà nidificate: Colore – colore del pennello (bianco per impostazione predefinita); Style – pattern pennello, che può assumere i seguenti valori: bsClear – colorazione solida; bsHorizontal – linee orizzontali; bsVertical – linee verticali; bsFDiagonal – linee diagonali a sinistra; bsBDiagonale – linee diagonali destre; bsCroce – cella; bsDiagCross – cella obliqua;

7 diapositive

Descrizione diapositiva:

Carattere – una proprietà per la visualizzazione del testo che ha le seguenti proprietà nidificate: Colore – colore del carattere; Altezza – altezza del carattere in pixel; Nome: nome del carattere; Dimensione – dimensione del carattere; Style – stile del carattere, che può assumere i seguenti valori: fsBold – grassetto; fsItalic – corsivo; fsUnderline – sottolineato; fsStrikeOut – barrato;

8 diapositive

Descrizione diapositiva:

PenPos (Posizione Penna) – una proprietà per memorizzare la posizione corrente del disegno (definisce la posizione della penna nell'area di disegno in questo momento tempo); Pixel – una proprietà dell'array per scrivere e leggere le coordinate dei singoli punti dell'area di disegno (“tela”).

Diapositiva 9

Descrizione diapositiva:

Metodi dell'oggetto Canvas MoveTo(x,y: integer) – sposta la penna dalla posizione corrente a un punto con le coordinate x, y specificate senza tracciare una linea; LineTo(x.y: intero) - sposta la penna dalla posizione corrente a un punto con le coordinate x, y specificate, disegnando una linea; Arco(x1, y1, x2, y2, x3, y3, x4, y4: intero) – disegna l'arco di un'ellisse inscritta in un rettangolo di coordinate (x1, y1) e (x2, y2). L'arco è determinato dai raggi dell'ellisse passanti per i punti (x3,y3) e (x4,y4);

10 diapositive

Descrizione diapositiva:

Corda(x1, y1, x2, y2, x3, y3, x4, y4: intero) – disegna una corda di un'ellisse secondo la descrizione data per il metodo Arco; Ellisse(x1, y1, x2, y2: intero) – disegna un'ellisse inscritta in un rettangolo con l'angolo superiore sinistro nel punto (x1, y1) e l'angolo inferiore destro nel punto (x2, y2); FillRect(Rect (x1, y1, x2, y2: integer)) – riempie il rettangolo con il colore specificato nel Brush corrente. Utilizza la funzione Rect, che rappresenta un rettangolo alle coordinate specificate;

11 diapositive

Descrizione diapositiva:

FloodFill(x,y: integer; Color: TColor; FillStyle: TFillStyle) – riempimento con il colore corrente specificato nella proprietà Brush: con FillStyle=fsBorder – un'area chiusa dal punto con coordinate x, y al bordo definito dal Colore; con FillStyle=fsSurface – quella porzione di superficie che ha il colore Color; Pie(x1, y1, x2, y2, x3, y3, x4, y4: intero) – disegna un settore di un'ellisse inscritto in un rettangolo con coordinate (x1, y1) e (x2, y2). Il settore è definito da due raggi di ellisse passanti per i punti (x3, y3) e (x4, y4);

12 diapositive

Descrizione diapositiva:

Polilinea (Punti: array di TPoint) – disegna una polilinea, collegando in sequenza i punti dell'array Points; Poligono (Punti: array di TPoint) – disegna poligoni collegando in sequenza i punti nell'array Points. Si differenzia dal metodo Polilinea in quanto collega automaticamente la fine della polilinea al suo inizio; Rettangolo (x1, y1, x2, y2: intero) – disegna un rettangolo con l'angolo superiore sinistro nel punto (x1, y1) e l'angolo inferiore destro nel punto (x2, y2);

Diapositiva 13

Descrizione diapositiva:

Retresh – il metodo viene chiamato quando è necessario ridisegnare l'immagine; RoundRect (x1, y1, x2, y2, x3, y3: intero) – disegna un rettangolo con angoli arrotondati. Gli angoli sono disegnati come quarti di un'ellisse con larghezza x3 e altezza y3; TextOut (x, y:intero, Text:String) – restituisce il testo specificato nel parametro Text. Il testo si inserisce in un rettangolo il cui angolo superiore sinistro ha le coordinate x, y.