Come configurare smartphone e PC. Portale informativo
  • casa
  • Consigli
  • Componenti per la visualizzazione di informazioni grafiche. Presentazione sulla programmazione in ambiente Delphi sul tema: "Visualizzazione di informazioni grafiche in Delphi"

Componenti per la visualizzazione di informazioni grafiche. Presentazione sulla programmazione in ambiente Delphi sul tema: "Visualizzazione di informazioni grafiche in Delphi"

LAVORO DI LABORATORIO

ARGOMENTO: « Grafica inDelphi- costruzione del più semplice
forme geometriche "

Riassunto della teoria

Delphi fornisce allo sviluppatore tre modi per visualizzare la grafica:

    tracciare mentre il programma è in esecuzione

    utilizzo di immagini grafiche pre-create

    creazione di immagini utilizzando componenti grafici

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

ClasseTfont- imposta le caratteristiche del font utilizzato per visualizzare il testo sulla tela. Le proprietà della classe sono descritte nella sezione "Proprietà di base disponibili per la maggior parte dei componenti".

ClasseTpen- imposta le caratteristiche della penna (matita) con cui vengono tracciate le linee.

Proprietà classe Tpen:

Colore: Tcolor - colore della linea (il valore predefinito è nero)

Larghezza: intero - spessore della linea in pixel;

Stile = (psSolid, psDash, psDot, psdashDot, psClear) - definisce lo stile della linea (solido, trattino, trattino, trattino-punto, invisibile)

Classepennello- imposta le caratteristiche del pennello, che viene utilizzato per dipingere sulla superficie dell'immagine.

Proprietà classe pennello:

Colore: Tcolor - colore del pennello (il valore predefinito è bianco)

Stile- ornamento pennello, può assumere i valori:

BsSolid - colorazione solida

BsClear - mancanza di ombreggiatura

BsVertical - linee verticali

BsBdiagonal - linee diagonali destre

BsDiagCross - cella inclinata

BsHorisontal - linee orizzontali

BsFdiagonal - linee diagonali sinistra

BsCross - cella

ClasseTcanvas- definisce 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 (senza il titolo, il menu principale e le righe di scorrimento del modulo) viene utilizzata come area di lavoro (tela, "tela"), ma è possibile riservare aree di lavoro più piccole all'interno del modulo utilizzando componenti Paintbox o Immagine... L'origine della coordinata della tela è l'angolo in alto a sinistra dell'area di lavoro, la larghezza dell'area di lavoro è determinata dalla proprietà Larghezza cliente, altezza - dalla proprietà Altezza cliente.

Proprietà classe Tcanvas:

Tela: Tcanvas - definisce l'area di disegno

Spazzola: Tbrush - pennello per riempire forme chiuse

Font: Tfont - carattere per la visualizzazione del testo su tela

Penna: Tpen - matita (penna) per disegnare

PenPos: Tpoint - la posizione corrente del cursore invisibile sulla tela

Commento : tipo Tpoint - definito come segue:

Tipo Tpoint = record

Pixel: Tcolor - imposta i colori dei pixel della tela, X, Y - le coordinate dei pixel. La proprietà Pixel è utile per tracciare grafici utilizzando punti di un colore selezionato.

Metodi di base della classe TCanvas

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

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

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

Colore Penna: = clblue;

Sposta in (0,0); LineTo (ClientWidth, ClientHeight);

    procedura Rettangolo(x1, y1, x2, y2: intero); - disegna un rettangolo: x1, y1 - coordinate dell'angolo superiore sinistro; х2, у2- coordinate dell'angolo inferiore destro.

Esempio : Disegna un quadrato di 60 px pieno di giallo al centro della forma.

varia Xc, Yc: intero; //

Xc: = ClientWidth div 2;

Xy: = ClientHeight div 2;

Canvas.Brush.color: = clyellow;

Canvas.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 dato da un array di coordinate.

Esempio : disegna un rombo 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: = ClientHeight div 2;

Canvas.Brush.Color: = RGB (275,140,70); // arancione colore ombreggiatura

Canvas.Polygon ();

fine;

    Procedura Arco(x1, y1, x2, y2, x3, y3, x4, y4: intero); - visualizza l'arco di un'ellisse delimitata 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 suo lato destro.

Procedura Tform1.Button1Click (Mittente: Oggetto);

Var X3, y3, x4, y4: numero intero;

Con PaintBox1 fai

Canvas.Pen.Color: = clWhite;

Larghezza.Penna.Tela: = 3;

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

X3: = ClientWidth div 2;

X4: = LarghezzaCliente;

Y4: = ClientHeight 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 retta che collega 2 punti dell'ellisse: un punto con coordinate (x3, y3) con un punto (x4, y4).

Esempio : sostituisci nell'esempio dato per il metodo ARC, il metodo Chord e ottieni questo 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 : Introduci il metodo PIE nell'esempio fornito per il metodo ARC e ottieni questo risultato.

    procedura Testo fuori(x, y: intero; Testo: stringa); - restituisce la stringa passata nel parametro Text in un rettangolo, il cui angolo in alto a sinistra è specificato dalle coordinate x, y. Le caratteristiche del carattere vengono impostate con lo strumento Carattere.

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

Altezza.carattere.tela: = 20 ; // altezza 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 pronti all'uso per migliorare l'esperienza dell'utente. Questi componenti sono pubblicati sulla pagina aggiuntivo e Sistema tavolozza di componenti.

ComponenteImmagine(ClasseTimage) - progettato per visualizzare immagini grafiche archiviate in file esterni con estensioni:

    Ico (icona, pittogramma);

    Bmp (bitmap, bitmap);

    Wmf, .emf (metafile);

    Jpg, .jpeg (immagine compressa JPEG).

Il principale proprietà :

Dimensione dell'auto: booleano - se vero, il componente adatta la sua dimensione alla dimensione dell'immagine caricata; per impostazione predefinita falso.

Stirata: booleano - se vero, il valore caricato occupa l'intera area del componente; l'impostazione predefinita è false.

Tela: Tcanvas - viene utilizzato per disegnare all'interno del componente nella fase di esecuzione del programma.

Foto: Tpicture-definisce l'immagine inserita nel componente.

Il principale metodi classe immagine:

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

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

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

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

Procedura Tform1Button1Click (mittente: Oggetto);

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 nome (Caption), un'immagine impostata dalla proprietà Glifo... Esiste un insieme di pulsanti standard BitBtn, con proprietà predefinite (con un'immagine, un'etichetta e uno scopo specifici) - il tipo di un pulsante standard viene selezionato tramite la proprietà Genere... Tipo = (bkCustom, bkAbort, bkCancel, bkClose ...)

Compito numero 1

Crea un'applicazione che contenga nella maschera principale due componenti Immagine e 4 pulsanti ("Carica immagine", "Crea forma geometrica", "Cambia colore", "Esci") e ti permetta di:

a) caricare un elemento grafico selezionato dall'utente nel componente Immagine1 in modo che l'immagine occupi l'intera area del componente Immagine.

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

(per qualsiasi misura delle dimensioni e posizione del componenteImmagine1 iscrizione deve
direttamente sotto il componente).

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

(per qualsiasi modifica delle dimensioni e della posizione del componenteImmagine2 la figura deve essere costruita correttamente, cioè secondo l'assegnazione relativa al componenteImmagine2)

d) modificare il colore della linea tracciata in Image2 su richiesta dell'utente utilizzando il componente ColorDialog.

Compito numero 2

Crea un'applicazione che ti permetta di disporre in modo casuale diverse etichette nel componente Immagine (ad esempio, la parola "Evviva!"). Per l'implementazione, 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 numero 3

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

Compito numero 4

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

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

Compito numero 5

CON

selezionare il tipo della forma disegnata dal componente Radiogroup1, il colore di riempimento dal componente Radiogroup2 e disegnare la forma selezionata nel componente Image.

Compito numero 6

Creare un'applicazione che consenta all'utente di ridimensionare il componente PaintBox1 (in pixel).

Dividere il componente PaintBox1 in 2 parti uguali, all'interno di ciascuna parte disegnare un'ellisse dipinta nel colore selezionato dall'utente nel ColorDialog.

Compito numero 7

CON Creare un'applicazione che ti permetta di:

selezionare il nome di una forma geometrica dal ListBox e disegnare la forma selezionata nel componente Immagine. La forma deve essere riempita con il colore selezionato dall'utente nel componente ColorDialog se il componente RadioGroup è impostato su Sì.

Compito numero 8

Creare un'applicazione che consenta all'utente di ridimensionare il 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 ogni forma è selezionato dall'utente nel ColorGrid.

Compito numero 9

seleziona un nome geometrico dalla ListBox
forme (ellisse, rombo, rettangolo) e disegnare
la forma selezionata nel componente Immagine. Posizione
cifre della componente Immagine (I trimestre, II trimestre,

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

Compito numero 10

Creare un'applicazione che consenta all'utente di ridimensionare il componente PaintBox1 (in pixel).

Fornire che la dimensione del lato non può essere testo, non può essere un numero negativo e non può superare la dimensione più piccola del modulo.

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

Compito numero 11

Creare un'applicazione che ti permetta di:

Seleziona la posizione del disegno dal componente Radiogroup

nel componente Immagine di un triangolo rettangolo, imposta
colore di riempimento della forma o colore del contorno a seconda di
abilitare i pulsanti delle caselle di controllo. Seleziona il colore attraverso
il componente ColorGrid.

Compito numero 12

Creare un'applicazione che consenta all'utente di ridimensionare il componente PaintBox1 (in pixel).

Fornire che la dimensione del lato non può essere testo, non può essere un numero negativo e non può superare la dimensione più piccola del modulo.

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

Ad esempio, puoi modificare il colore di un modulo come segue:

form1.Color: = ColorBox1.Colors;

Compito numero 13

Creare un'applicazione che ti permetta di:

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

b) dividere il quadrato per una diagonale o due, a seconda dell'inclusione dei pulsanti Checkbox e dipingere ogni triangolo risultante in un colore diverso. La scelta del colore è a cura dell'utente.

Compito numero 14

Creare un'applicazione che consenta all'utente di ridimensionare il componente PaintBox1 (in pixel).

Fornire che la dimensione del lato non può essere testo, non può essere un numero negativo e non può superare la dimensione più piccola del modulo.

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

Ad esempio, puoi modificare il colore di un modulo come segue:

form1.Color: = ColorBox1.Colors;

Compito numero 15

Creare un'applicazione che ti permetta di:

a) impostare le dimensioni orizzontale e verticale del componente Immagine in modo che siano uguali e uguali al numero digitato dall'utente da tastiera;

(premesso che la dimensione del lato non può essere testo, non può essere un numero negativo e non può superare la dimensione più piccola del modulo)

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

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

Compito numero 16

Creare un'applicazione che consenta all'utente di ridimensionare il componente PaintBox1 (in pixel).

Fornire che la dimensione del lato non può essere testo, non può essere un numero negativo e non può superare la dimensione più piccola del modulo.

Dividi il componente PaintBox1 in 9 parti uguali e dipingi ogni rettangolo risultante a forma di scacchiera. Il colore di riempimento è selezionato dall'utente nel ColorBox.

Ad esempio, puoi modificare il colore di un modulo come segue:

form1.Color: = ColorBox1.Colors;

Compito numero 17

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

Quando si fa clic su OK, in Immagine1 viene disegnato un quadrato di lato X e in Immagine2 viene disegnato un triangolo rettangolo con i lati 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 quando il colore della linea e il colore di riempimento sono selezionati per disegnare la forma.

X - seleziona casualmente, utilizzando la funzione Random e il valore del valore X dovrebbe essere visualizzato nel componente Modifica.

Compito numero 18

Creare un'applicazione che consenta all'utente di ridimensionare il componente PaintBox1 (in pixel).

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

Ad esempio, puoi modificare il colore di un modulo come segue:

form1.Color: = ColorBox1.Colors;

Libreria di componenti visivi (VCL) Delphi ci fornisce i seguenti componenti visivi per la visualizzazione di informazioni grafiche: Immagine (immagine), PaintBox (finestra per il disegno), DrawGrid (tabella delle figure), Chart (grafici e grafici), Animate (uscita video clip ), nonché Form. Questi componenti hanno una proprietà Canvas (discussa sopra) che dà accesso a ogni 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.

Consideriamo i componenti di cui sopra in modo più dettagliato:

Componente immagine (immagine)

È un oggetto della classe TImage. Utilizzato per visualizzare sullo schermo le immagini lette dai file grafici. Per impostazione predefinita, emette sulla superficie del modulo le immagini presentate in formato * .bmp. Per visualizzare le immagini in formato jpg è necessario collegare l'unità JPEG nella direttiva usi. Situato nella scheda Addizionale della Component Palette.

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

Figura 9 - Il componente Immagine sul modulo

Per aprire una finestra di dialogo per la selezione dell'immagine desiderata, procedere come segue utilizzando l'Ispettore oggetti. Per fare ciò, trova la proprietà Picture e fai clic sui tre punti a sinistra di essa. Si apre la finestra Editor di immagini e in essa selezioniamo Carica, nella finestra aperta selezioniamo il file immagine.

Può anche essere eseguito a livello di codice chiamando il metodo LoadFromFile della proprietà Picture:

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

dove nome_pic.jpeg è il nome del file.

Tabella 8 - Proprietà di base del componente Immagine

Proprietà

Descrizione

L'immagine visualizzata nel campo del componente

Dimensioni dei componenti. Se queste dimensioni sono inferiori alle dimensioni della grafica e le proprietà Strech, AutoSize e Proportional sono False, viene visualizzata una parte dell'immagine.

Consente di ridimensionare automaticamente le immagini senza distorsioni. Per eseguire il ridimensionamento, il valore della proprietà AutoSize deve essere uguale a False

Consente di ridimensionare (rimpicciolire 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 sarà distorta

Consente di ridimensionare automaticamente il componente per adattarlo all'immagine

Consente di determinare la posizione orizzontale dell'immagine nel campo Componente immagine se la larghezza dell'immagine è inferiore alla larghezza del componente.

Superficie per visualizzare la grafica

Specifica il colore di sfondo trasparente dell'immagine

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

  • · Visualizza le immagini nella cartella;
  • · Visualizzare l'immagine a grandezza naturale o nel formato più adatto alle dimensioni della finestra;
  • · Gestire i file di immagine, nonché stampare, salvare, eliminare e modificare le immagini;
  • · Se necessario, aprire l'immagine nel programma di modifica;

Figura 10 - La finestra del programma prima dell'avvio

Creazione del 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 form il componente Image, il componente principale con cui dovremo lavorare. Oltre a lui, abbiamo bisogno dei seguenti componenti:

  • · ScrollBox È necessario quando in modalità full-size l'immagine andrà oltre l'immagine. Impostiamo la sua proprietà Aling al valore alClient in modo che la sua dimensione cambi proporzionalmente alla dimensione della finestra. E posiziona il componente Immagine su di esso;
  • · Aggiungeremo anche le finestre di dialogo dei componenti SavePictureDialog e OpenPictureDialog, destinate al salvataggio e all'apertura delle immagini. Occorre il primo per copiare l'immagine nella directory selezionata, il secondo per richiamare la finestra di dialogo per l'apertura di un file grafico. Si trovano nella pagina Dialogs della Component Palette. Anche da questa pagina abbiamo bisogno del componente PrintDialog, che dobbiamo chiamare la finestra di dialogo per la scelta di una stampante per la stampa.
  • Aggiungi MainMenu per aggiungere il menu principale al programma e XPManifest per un design più colorato
  • · Abbiamo anche bisogno di memorizzare i nomi delle immagini nella directory di lavoro da qualche parte. Per questi scopi, è utile il componente ListBox, che può essere nascosto durante l'elaborazione dell'evento Create di Form1.
  • · Per posizionare i pulsanti di navigazione e lavorare comodamente con essi, aggiungi un pannello Velo, sul quale posizioneremo questi pulsanti (Immagine precedente, Immagine successiva, Dimensioni reali, Ridimensiona, Elimina, Copia in, Stampa, Modifica). SpeedButton è selezionato come componente per loro.
  • · Aggiungere un timer per catturare i tasti "Sinistra" (immagine precedente), "Destra" (immagine successiva) e "Canc" (cancella l'immagine).
  • · E un altro componente - ProgressBar, che mostra il processo di caricamento di file * .Jpg di grandi dimensioni.
  • 3. Scrivere il codice per gestire l'evento di pressione dei pulsanti (Immagine precedente, Immagine successiva, Dimensioni reali, Ridimensiona, Elimina, Copia in, Stampa, Modifica). Scrivere il codice per gestire l'evento di click sulle voci del menu MainMenu (Exit, Open, Close, Create).
  • 4. Specificare le impostazioni iniziali per la creazione del modulo. Fare doppio clic sullo spazio libero del 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 FindFileInFolder (percorso, ext: stringa);

Questa routine esegue la scansione della cartella del percorso alla ricerca di file utilizzando la maschera ext.

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

  • 1. Elencare le capacità del componente Immagine.
  • 2. Di quale classe è il componente Immagine?
  • 3. 3. Che 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?

Argomento :
Lo scopo del lavoro di laboratorio Delphi.

Gli studenti devono imparare a:

  • Crea grafici

Parte teorica

pittogramma Nome Pagina Appuntamento
Immagine aggiuntivo
Forma aggiuntivo
Disegna Griglia

(tabella delle figure)

aggiuntivo
Grafico

(diagrammi e grafici)

aggiuntivo
Paintbox

(finestra di disegno)

Sistema

Forma Spazzola

Immagine:

Grafico:

Metodo Chiaro

Metodo Aggiungere

Metodo AggiungiXY

PaintBox:

Esercizio 1

Compito 2

Compito 3

con PaintBox1, tela fai

Pennello.Colore: = clRosso;

Colore Penna: = clVerde;

Stile penna:= psDash;

Colore Penna: = clRosso;

Spiegazione:

Esercizio 4

Var i: intero;

Serie1.Cancella;

per i: = da 0 a 22 do

Serie1.AggiungiXY (io * 0.29,10 *peccato (io * 0,29), ”,clVerde) ;, dove io * 0,29 (Valore AX) questo è un argomento e 10* peccato (io * 0.29) (AYValore)

  1. y = 3,2 * (14 * x)
  2. y = peccato (x)
  3. y = cos (x)
  4. y = x 2 + cos (x)
  5. y = x 2 -4,5 * 4

Esercizio 5

con ComboBox1 inizia

Elementi: = Screen.Fonts;

  1. Salva ed esegui il progetto.
  1. Incarico al lavoro.
  2. Incolla il codice che hai scritto
  3. Conclusione sul lavoro svolto. Argomento : Utilizzo delle capacità grafiche.

    Lo scopo del lavoro di laboratorio- Scopri le capacità grafiche Delphi.

    Gli studenti devono imparare a:

    • Crea qualsiasi pezzo grafico J
    • Usa le capacità grafiche
    • Applicare capacità grafiche
    • Crea grafici

    Parte teorica

    Delphi permette di sviluppare applicazioni in grado di visualizzare grafici: diagrammi, disegni, illustrazioni. Per visualizzare le informazioni grafiche, la libreria Delphi mette a disposizione dei componenti, il cui elenco è riportato nella tabella seguente:

    pittogramma Nome Pagina Appuntamento
    Immagine aggiuntivo Utilizzato per visualizzare la grafica: miniature, bitmap e metafile
    Forma aggiuntivo Usato per costruire primitive geometriche
    Disegna Griglia

    (tabella delle figure)

    aggiuntivo Utilizzato per creare una tabella nell'applicazione che può contenere elementi grafici
    Grafico

    (diagrammi e grafici)

    aggiuntivo Utilizzato per creare tabelle e grafici
    Paintbox

    (finestra di disegno)

    Sistema Usato per creare un'area sul modulo in cui disegnare

    Inoltre, è possibile visualizzare e immettere informazioni grafiche sulla superficie di qualsiasi componente finestra che disponga di una proprietà Canvas. I disegni creati durante l'esecuzione dell'applicazione possono essere immobili o animati.

    Forma : solo condizionatamente può essere attribuito ai mezzi di visualizzazione delle informazioni grafiche, poiché rappresenta semplicemente varie forme geometriche, opportunamente ombreggiate. La proprietà principale di questo componente è Shape, che può assumere valori, Spazzola(brush) - questa proprietà è un oggetto di tipo TBrush che ha un numero di sottoproprietà, in particolare: il colore (Brush.Color) e lo stile (Brush.Style) del riempimento della forma. La terza proprietà specifica del componente Shape è Pen, che determina lo stile delle linee.

    Immagine: proprietà principali: Picture - è responsabile del caricamento dell'immagine, Stretch - è responsabile della dimensione dell'immagine nel componente Image, AutoSize - è responsabile della dimensione del componente in cui è stata caricata l'immagine, tenendo conto della dimensione di l'immagine.

    Grafico: Per impostare i valori visualizzati, è necessario utilizzare i metodi della Serie. Diamo un'occhiata a tre di loro.

    Metodo Chiaro cancella la serie dai dati precedentemente inseriti.

    Metodo Aggiungere: - Add (Const AValue: Double; Const ALabel: String; AColor: TColor)

    consente di aggiungere un nuovo punto al diagramma. Il parametro AValue corrisponde al valore aggiunto della funzione, e il valore dell'argomento della funzione viene compilato automaticamente, quindi non è necessario impostarlo, il parametro ALabel è il nome che verrà visualizzato sul diagramma e nella legenda , AColor è il colore. Il parametro ALabel è facoltativo, puoi impostarlo vuoto: ".

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

    permette di aggiungere un nuovo punto al grafico della funzione. I parametri AXValue e AYValue corrispondono all'argomento e alla funzione. I parametri ALabel e AColor sono gli stessi del metodo Add.

    PaintBox: essere nella pagina Sistema. È una semplice finestra di tela in cui è possibile disegnare immagini arbitrarie. Gli strumenti grafici sono contenuti nelle proprietà Carattere, Pennello e Penna. Il canvas (canvas) è contenuto nella proprietà Canvas del componente. Il dipinto stesso è programmato nel gestore di eventi onPaint.

    Esercizio 1

    1. Crea un programma che ti introduca al componente Immagine. È necessario posizionare i componenti: Label, Image, BitBtn, Button. Firma come nell'immagine e carica qualsiasi immagine. Regola i componenti in modo che in Immagine1 l'immagine rientri nelle cornici e in Immagine2 l'immagine corrisponda alle sue dimensioni. Crea suggerimenti, quando passi con il mouse su ogni immagine, la proprietà Hint è responsabile dei suggerimenti, per visualizzare è necessario inserire il testo e abilitare i suggerimenti nella proprietà ShowHint.

    Compito 2

    1. Aumenta le dimensioni della forma e aggiungi i seguenti componenti: Forma, Etichetta. Sottoscrivi.
    2. Applicare stili a ciascun componente Forma in base all'immagine:

    Compito 3

    1. Ad esempio, posizioniamo il componente PaintBox su un form. Gestore OnPaint:

    con PaintBox1, tela fai

    Pennello.Colore: = clRosso;

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

    Colore Penna: = clVerde;

    Stile penna:= psDash;

    Rettangolo (120,60, Larghezza, Altezza);

    Colore Penna: = clRosso;

    Polilinea ();

    TextOut (75,20, 'Il tuo testo può essere qui!');

    Spiegazione: La prima riga imposta il colore di riempimento: Brush.Color: = clRed; Il secondo disegna parte dell'ellisse: Torta (12,100,140,280,12,100,140,280); Le seguenti righe impostano i parametri della penna (come le forme avranno un bordo), larghezza, colore e stile della linea: Pen.Width: = 4; Colore Penna: = clVerde; Stile penna:= psDash; Ma in questo caso vedremo una linea continua, poiché se lo spessore è più di un pixel, lo stile della linea sarà psSolid (solido). La riga seguente è responsabile del disegno del quadrato: Rettangolo (120,60, Larghezza, Altezza); Il comando seguente disegna un asterisco rosso: Polyline (); L'ultima riga è responsabile dell'output del testo: TextOut (75,20, "Il tuo testo può essere qui!");

    Esercizio 4

    1. Realizzare un programma che tracci un dato grafico della funzione y = 10 * sin (x)

    1. Ingrandire il modulo e posizionare il componente TChart su di esso dalla scheda Addizionale e posizionare il componente Pulsante, Etichetta. Allunga la nuova TChart a una dimensione conveniente per lo sviluppo.
    2. Entriamo nell'editor grafico facendo doppio clic sul componente. Modifica e personalizzazione dell'aspetto della serie. Per fare ciò, fare clic su Aggiungi e selezionare il tipo di grafico a linee e fare clic su OK. Per modificare il titolo, premere Titolo e inserire la formula y = 10 * sin (x).
    3. Scrivi il codice per disegnare il grafico nell'evento OnClick del componente Button:

    Var i: intero;

    Serie1.Cancella;

    per i: = da 0 a 22 do

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

    Spiegazione: Metodo Series1.Clear; cancella la serie dai dati inseriti in precedenza, in modo che durante l'aggiornamento non ci siano vecchi valori. Per disegnare un grafico, hai bisogno di valori, nel nostro caso 22 valori, in corrispondenza dei quali il grafico viene disegnato dalla funzione Serie1.AggiungiXY (io * 0.29,10 *peccato (io * 0,29), ”,clVerde) ;, dove io * 0,29 (Valore AX) questo è un argomento e 10* peccato (io * 0.29) (AYValore) valore di calcolo della funzione, ”(ALabel) il nome che verrà visualizzato sul diagramma e nella legenda può essere lasciato vuoto e clGreen (AColor) è il colore della linea.

    1. Completa da solo il seguente compito: disegna un grafico di funzioni
    2. y = 3,2 * (14 * x)
    3. y = peccato (x)
    4. y = cos (x)
    5. y = x 2 + cos (x)
    6. y = x 2 -4,5 * 4

    Esercizio 5

    1. Crea un'applicazione che ti permetta di visualizzare i caratteri nei font di sistema.
    2. Ingrandire la forma, posizionare DrawGrid1, ComboBox1, Label. Impostare le seguenti proprietà per il componente DrawGrid1: RowCount = 7, ColCount = 32, FixedCols = 0, FixedRows = 0, DafaultColWidth = 20, DefaultRowHeight = 20.
    3. Per ridisegnare il contenuto di ogni cella, creare un gestore di eventi OnDrawCell per il componente DrawGrid1. Per visualizzare i caratteri del font, utilizzeremo la proprietà Canvas del componente DrawGrid1. Abbiamo bisogno direttamente del metodo TextRect della proprietà Canvas. Questo metodo viene utilizzato per visualizzare le informazioni di testo in una cella specifica. Il gestore dell'evento sarà simile a questo:

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

    1. Salva il progetto. Assicurati che le celle della tabella visualizzino i caratteri del carattere di sistema predefinito.
    2. Per selezionare un carattere, utilizzeremo il componente ComboBox1. Affinché questo componente contenga tutti i caratteri dello schermo, è necessario aggiungerli all'elenco durante la creazione del modulo. I nomi di tutti i caratteri dello schermo possono essere trovati utilizzando la variabile globale Screen di tipo TScreen. Questa variabile viene aggiunta automaticamente a tutte le applicazioni Delphi. La variabile Screen contiene informazioni sullo stato corrente della schermata dell'applicazione: nomi di moduli e moduli dati utilizzati dall'applicazione; dati sul modulo attivo e sui componenti utilizzati da questo modulo; le dimensioni e la risoluzione dello schermo utilizzato; informazioni sui cursori e sui caratteri disponibili per l'applicazione. Le informazioni sui caratteri disponibili per l'applicazione sono contenute nella proprietà Font della variabile Screen.
    3. Crea un gestore di eventi onCreate per il modulo e aggiungi istruzioni ad esso:

    con ComboBox1 inizia

    Elementi: = Screen.Fonts;

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

    1. Salva ed esegui il progetto. Il componente DrawGrid1 contiene i caratteri del tipo di carattere impostato in ComboBox1.
    2. Per associare il valore del nome del font per DrawGrid1 e ComboBox1, creiamo un altro gestore di eventi:

    DrawGrid1.Font.Name:=ComboBox1.Text;

    1. Salva ed esegui il progetto.
    1. Numero, argomento, scopo del lavoro di laboratorio.
    2. Incarico al lavoro.
    3. Descrizione dei dati di input, intermedi e di risultato con indicazione della loro tipologia.
    4. Programma nel linguaggio di programmazione.
    5. Risultato dell'esecuzione del programma (dati immessi e dati ricevuti)
    6. Incolla il codice che hai scritto
    7. Conclusione sul lavoro svolto.

"Visualizzazione di informazioni grafiche in Delphi"
Piano tematico:
1. Metodi di visualizzazione della grafica
informazioni a Delfi.
2. Visualizzazione delle immagini.
3. Visualizzazione di geometric
figure.

1. Modalità di visualizzazione delle informazioni grafiche.
Ci sono diversi modi in Delphi
visualizzazione di informazioni grafiche:
Conclusione del pre-preparato
immagini (componenti dell'immagine,
Forma);
Costruire grafici e diagrammi
(scheda componenti, ecc.);
Imaging
programmaticamente (oggetto
Tela).

2. Visualizzazione delle immagini.
Visualizzazione delle immagini utilizzando
abbiamo esaminato il componente Immagine in
uno degli argomenti precedenti.
Qui guardiamo un esempio
implementazione dell'animazione più semplice
cambiando periodicamente
l'immagine visualizzata in
Componenti dell'immagine.
Vai per un esempio.


Visualizzazione di protozoi
forme geometriche sulla forma
fornisce un componente Shape.

3. Visualizzazione di forme geometriche.
Le principali proprietà del componente Shape:
Spazzola
Penna
Forma
Colore (.Color) e stile (.Style) per
riempiendo la forma.
Colore (.Color), stile (.Style), larghezza
(.Width) e metodo di output (.Mode) delle linee
figure.
Vista forma geometrica.

3. Visualizzazione di forme geometriche.
Da più componenti Shape
puoi creare semplici disegni.
Modificare la posizione a livello di codice
(.Sinistra, .In alto) dimensioni (.Larghezza, .Altezza) e
il colore (Brush.Color) dei componenti Shape
nella figura puoi implementare
elementi dell'animazione più semplice.
Considera un esempio.

4. Costruzione di grafici e diagrammi.
I diagrammi sono destinati a
migliore visualizzazione
array di dati numerici, loro
visualizzazione e analisi visiva.
Esempio.
Per la creazione di grafici in Delphi
ci sono diversi componenti,
uno di questi è il componente Grafico (sezione
TeeChart Std).

4. Costruzione di grafici e diagrammi.
Vista del componente Grafico dopo di esso
impostazioni sul modulo:

4. Costruzione di grafici e diagrammi.
Oltre a "Ispettore oggetti", accedi a
proprietà del componente Grafico, è possibile
ottenere aprendo una finestra speciale
finestra di dialogo (tasto destro sul componente \
Modifica grafico...)
Aggiungere
serie di dati
Cambia tipo
grafici

4. Costruzione di grafici e diagrammi.
Scelta di un tipo di grafico:

4. Costruzione di grafici e diagrammi.
Impostazione delle proprietà per gli assi delle coordinate
(Asse):

4. Costruzione di grafici e diagrammi.
I dati da visualizzare sono solitamente
trasferiti alla Carta programmaticamente,
esempio:
Serie1.Cancella; (cancellare lotto)
per i: = da 1 a N do
Serie1.addxy (i, A [i], '', clGreen);
Valuta per
Asse X
Valuta per
Asse Y
Firma
Asse X
Colore dei dati
sul diagramma
Considera un esempio di costruzione
grafico della funzione y = Sin (x)

Ulteriore:
Lavoro di laboratorio n. 13.1.
"Visualizzazione di immagini e geometrie
figure, la loro animazione”.
Esercizio:
1) Sviluppare un'applicazione da implementare
la più semplice animazione periodica
modifica dell'immagine visualizzata in
Componenti dell'immagine. (Il numero di immagini non è
meno di tre, raccogli le foto
da soli).

Esercizio:
2) Trova e disegna un'immagine da
Componenti di forma. A livello di programmazione
cambiando posizione, taglia o colore
Forma componenti nella figura
per eseguire elementi del più semplice
animazione.

Ulteriore:
Lavoro di laboratorio n. 13.2.
"Costruzione di grafici e diagrammi".
Esercizio:
1) Modifica app da
lavoro di laboratorio n. 9 (Display
dati in tabella). Aggiungi opportunità
visualizzare alcuni dati dalla tabella
su un grafico a barre o a torta.
2) Costruisci un grafico di una data funzione.

Elenco dei componenti per la visualizzazione delle informazioni grafiche

Per visualizzare le informazioni grafiche nella libreria Delphi sono previsti i componenti il ​​cui elenco è riportato nella tabella 4.1.

Tabella 4.1 Componenti della visualizzazione delle informazioni grafiche Pittogramma

Componente

Pagina

Descrizione

Immagine

Utilizzato per visualizzare la grafica: icone, bitmap e metafile.


PaintBox (finestra per il disegno)

Utilizzato per creare un'area su un modulo in cui disegnare.


DrawGrid (tabella delle figure)

Utilizzato per visualizzare dati non di testo in righe e colonne.


Grafico (grafici e grafici)

Il componente appartiene alla famiglia di componenti TChart che vengono utilizzati per creare tabelle e grafici.


Inoltre, è possibile visualizzare e immettere informazioni grafiche sulla superficie di qualsiasi Visualizzazione di elementi grafici sulla tela.

Tela Tela non è un componente, quindi in senso stretto non dovrebbe essere trattato in questo libro. Ma poiché molti componenti, in particolare i moduli, hanno una tela e la tela offre la possibilità di visualizzare varie informazioni grafiche, è comunque consigliabile fornire alcune informazioni iniziali sulla tela.

Una tela è un'area di un componente su cui è possibile disegnare o visualizzare immagini renderizzate. Contiene proprietà e metodi che semplificano notevolmente la grafica Delphi. Tutte le interazioni complesse con il sistema sono nascoste all'utente, quindi una persona completamente inesperta in computer grafica può disegnare in Delphi.

Ogni punto della tela ha coordinate X e ... Il sistema di coordinate della tela, come altrove in Delphi, ha origine nell'angolo in alto a sinistra della tela. Coordinata X aumenta man mano che ci si sposta da sinistra a destra e la coordinata - quando ci si sposta dall'alto verso il basso. Le coordinate sono misurate in pixel. Un pixel è l'elemento più piccolo della superficie di un disegno che può essere manipolato. La proprietà più importante di un pixel è il suo colore.

La tela ha la proprietà Pixel... Questa proprietà è una matrice bidimensionale che controlla i colori dell'area di disegno. Ad esempio, Tela. Pixel corrisponde al colore del pixel decimo da sinistra e ventesimo dall'alto. Un array di pixel può essere trattato come qualsiasi proprietà: cambia il colore assegnando a un pixel un nuovo valore o determina il suo colore da un valore memorizzato in esso. Ad esempio, Tela. Pixel: = 0 o Tela. Pixel: = clNeroè l'assegnazione del pixel al nero.

Proprietà Pixel può essere usato per dipingere su tela. Proviamo a disegnare un grafico pixel per pixel di una sinusoide sulla tela della forma. Per fare ciò, nell'event handler del form SuPaint(disegno) è possibile inserire il seguente codice:

TForm1. FormPaint (mittente: TObject);

varia, Y: reale; // coordinate della funzione, PY: longint; // coordinate pixel

inizio: = clBianco;

per PX: = 0 a Larghezza cliente fare

(X è l'argomento della trama,

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

(PY - coordinata pixel,

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

(Il colore del selezionato

pixel (Informazioni sulla luminosità))... Pixel: = 0;

fine;

Esegui questa applicazione di test e dovresti vedere l'output mostrato nella Figura 4.1a. Il grafico della sinusoide è risultato, anche se non molto buono, perché è diviso in punti separati - pixel.

Canvas - oggetto di classe TCanvas ha molti metodi che ti permettono di disegnare grafici, linee, forme usando la proprietà Penna- piuma. Questa proprietà è un oggetto, che a sua volta ha una serie di proprietà. Uno di questi è una proprietà che già conosci Colore- il colore con cui viene applicato il disegno. La seconda proprietà è Larghezza(larghezza della linea). La larghezza è espressa in pixel. La larghezza predefinita è 1.

Proprietà Stile determina l'aspetto della linea. Questa proprietà può assumere i seguenti valori:

La tela ha la proprietà PenPos genere TPoint(centimetro .). Questa proprietà specifica la posizione corrente della penna nelle coordinate dell'area di disegno. Spostare la penna senza tracciare una linea, ad es. la variazione PenPos, prodotto con il metodo canvas Sposta in (X, Y). Qui ( X, Y) - le coordinate del punto in cui viene spostata la penna. Questo punto corrente diventa l'origine, da cui il metodo LineaA (X, Y) puoi disegnare una linea su un punto con coordinate ( X, Y). In questo caso, il punto corrente viene spostato al punto finale della linea e una nuova chiamata LineTo disegnerà un punto da questo nuovo punto corrente.

Proviamo a disegnare con la penna il grafico sinusoidale dell'esempio precedente. In questo caso, il gestore di eventi del modulo SuPaint potrebbe assomigliare a:

procedura TForm1. FormPaint (mittente: TObject);

varia, Y: reale; // coordinate della funzione, PY: longint; // coordinate pixel

inizio: = clBianco ;. MoveTo (0, ClientHeight div 2);

per PX: = 0 a Larghezza cliente fare

(X è l'argomento della trama,

corrispondente al pixel con coordinata PX): = PX * 4 * Pi / LarghezzaClient ;: = Sin (X);

(PY - coordinata pixel,

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

(Si traccia una linea sul grafico)... LineTo (PX, PY);

Potete vedere il risultato dell'applicazione in questa versione nella Figura 4.1 b. Come puoi vedere, la qualità della grafica è notevolmente migliorata.

La penna può disegnare non solo linee rette, ma anche forme. Per un elenco completo dei metodi canvas che utilizzano una penna, vedere la guida in linea di Delphi. Nel frattempo, come esempio, ne daremo solo uno - Ellisse che disegna un'ellisse o un cerchio. È fatturato come

procedura Ellisse (X1, Y1, X2, Y2: numero intero);

dove i parametri X1, X2, Y1, Y2 definire le coordinate del rettangolo che racchiude un'ellisse o un cerchio. Ad esempio, l'operatore

Ellisse (10, 40, 20, 50);

disegnerà un cerchio con un diametro di 10 e coordinate del centro (15, 45).

Le forme sono generalmente disegnate non vuote, ma riempite con la proprietà canvas Spazzola- spazzola. Proprietà Spazzolaè un oggetto che a sua volta ha una serie di proprietà. Proprietà Colore definisce il colore di riempimento. Proprietà Stile definisce il motivo di riempimento (tratteggio). L'impostazione predefinita è Stile equivale bsSolido, che significa tinta unita Colore.

alla penna Penna c'è un'altra proprietà che non abbiamo ancora considerato. Questa proprietà - Modalità(modalità). L'impostazione predefinita è Modalità = pmCopia... Ciò significa che le linee sono disegnate con il colore specificato nella proprietà Colore... Ma sono possibili altre modalità, in cui non viene preso in considerazione solo il colore Colore ma anche il colore dei pixel di sfondo corrispondenti. La più interessante di queste modalità è pmNotXor- aggiunta allo sfondo tramite OR esclusivo inverso. Se questa modalità è impostata, ridisegnare la stessa forma nello stesso punto sulla tela rimuove l'immagine disegnata in precedenza e ripristina i colori dei pixel che erano prima della prima immagine della forma.

Questa caratteristica della modalità pmNotXor può essere utilizzato per creare semplici animazioni. Basta disegnare qualcosa, quindi cancellare ciò che è stato disegnato, ridisegnarlo leggermente modificato e il disegno sembrerà prendere vita.

Prova a creare una semplice animazione: un cerchio in movimento. Avvia una nuova app e nella sezione implementazione inserisci annuncio

X, Y: intero;

Questo introdurrà variabili globali X e - le coordinate correnti dell'immagine.

Nella forma evento SuPaint inserire dichiarazioni

Spazzola. Colore: = clBianco ;: = clBianco ;. Penna. Modalità: = pmNotXor;

Il primo di questi operatori imposta il colore del pennello su bianco. Spazzola... Ciò significa che il tuo cerchio sarà riempito di bianco all'interno. Il secondo operatore imposta il colore di sfondo della superficie del modulo su bianco.

Il terzo operatore imposta la modalità penna pmNotXor che ti permetterà di cancellare la vecchia immagine prima di dipingere quella nuova.

Anche l'animazione più semplice necessita di sincronizzazione. In caso contrario, la velocità di movimento sarà determinata dalla velocità del computer. Pertanto, trasferisci il componente nel modulo Timer- timer dalla pagina Sistema. Questo componente è descritto nella sezione 5.7 .

Puoi vedere la sua descrizione dettagliata lì. Per ora, imposta la sua proprietà Intervallo uguale, ad esempio, a 30 (questo è il tempo di sosta in millisecondi, ma il tempo di sosta reale sarà più lungo - vedere la Sezione 5.7) e impostare la proprietà Abilitato pari falso(questo significa che il timer non si avvierà automaticamente all'avvio dell'applicazione).

Al gestore eventi di questo componente OnTimer inserire dichiarazioni

// Cancella la vecchia immagine... Ellisse (X-5, Y, X + 5, Y-1Q); (X);

// Disegna una nuova immagine... Ellisse (X-5, Y, X + 5, Y-10);

// Fermati quando raggiungi la fine del modulo

Se(X> = LarghezzaCliente-20) poi... Abilitato: = falso;

Il primo di questi operatori disegna un cerchio dove era stato disegnato in precedenza, ad es. cancella l'immagine precedente.

L'ultimo operatore congela l'immagine sul bordo del form.

Ora trascina il pulsante nel modulo Pulsante e metti gli operatori nel gestore dei clic su di esso

X: = 10 ;: = 100 ;. Ellisse (X-5, Y, X + 5, Y-10) ;. Abilitato: = vero;

I primi due operatori impostano le coordinate di partenza del cerchio. Il terzo operatore disegna il cerchio nella sua posizione iniziale e il quarto avvia il timer.

Traduci l'applicazione, eseguila, fai clic sul pulsante. Vedrai l'immagine di un cerchio che si muove lungo la forma da sinistra a destra. E poi collega la tua immaginazione e trasforma questa applicazione non troppo interessante in qualcosa di più divertente.

Sulla tela è possibile visualizzare non solo le immagini create a livello di codice, ma anche le immagini archiviate in file grafici. Solo la tela stessa non ha un metodo per caricare un'immagine da un file. Pertanto, il file deve essere caricato in qualche altro oggetto grafico che possa percepire le informazioni dei file grafici. E poi riscrivi l'immagine da questo oggetto alla tela usando il metodo canvas Disegno... La sua descrizione:

Disegna (X, Y: Intero; Grafico: TGraphic);

Qui i parametri X e definire le coordinate dell'angolo in alto a sinistra del posizionamento dell'immagine sulla tela, a Grafico- un oggetto che memorizza informazioni. Tale oggetto può essere, ad esempio, un oggetto di tipo TBitMap, destinato alla memorizzazione di matrici di bit. Vediamo come appare in pratica.

Apri una nuova applicazione, trascina il componente nel modulo OpenPictureDialog dalla pagina Dialogs (questo è un componente della finestra di dialogo per l'apertura dei file grafici - vedere la sezione 8.2 ) e il pulsante Pulsante... Luogo OpenPictureDialog in qualsiasi punto del modulo, poiché questo componente non è visivo, e posizionare il pulsante nella parte inferiore del modulo. Aggiungi il codice al gestore di clic del pulsante:

procedura TForm1. Button1Click (mittente: TObject);

varia: TBitMap;

// Seleziona un file grafico dall'utente

Se OpenPictureDialog1. Eseguire poi

// Crea un oggetto BitMap di tipo TBitMap: = TBitMap. Creare;

// Porta l'immagine nella tela del modulo... Disegna (10, 10, BitMap);

// Distruggi l'oggetto BitMap... Libero;

fine;

Questo codice crea un oggetto temporaneo di tipo TBitMap Con nome BitMap... Quindi viene chiamata la finestra di dialogo per l'apertura di un file grafico OpenPictureDialog1 e se l'utente ha selezionato un file, questo viene caricato su BitMap metodo Carica da file... Allora con il metodo Disegno L'immagine caricata viene copiata sulla tela nell'area con le coordinate dell'angolo in alto a sinistra (10,10). Dopo di che l'oggetto temporaneo BitMap distrutto.

Esegui la tua applicazione e fai clic sul relativo pulsante. Vedrai che puoi caricare qualsiasi tipo di file grafico. bmp e verrà visualizzato sulla tela del modulo (vedi Figura 4.2 a). Puoi trovare i file grafici nella directory Immagini. In Delphi 5 e 4, di solito si trova in una directory. \ file di programma \ Common Files \ Borland Shared. In Delphi 3, si trova nella directory. \ program files \ Borland \ Delphi 3, e in Delphi 1 - nella directory Delphi 16. Nella directory Images c'è, in particolare, la sottodirectory \ Images \ Splash \ 16Color \, che contiene il file caricato nell'esempio in Figura 4.2

Hai creato un'applicazione abbastanza buona per la visualizzazione di file grafici. Ma ora proviamo a vedere il suo principale difetto. Senza chiudere l'applicazione, vai su qualche altro programma, ad esempio, torna a Delphi. Quindi, senza fare nulla, torna all'applicazione in esecuzione. Se la finestra del programma in cui sei uscito copriva completamente la finestra della tua applicazione, quindi tornandoci vedrai che l'immagine nella finestra è scomparsa. Se la finestra dell'applicazione è stata solo parzialmente sovrapposta, tornando all'applicazione, potresti vedere un risultato simile a quello mostrato nella Figura 4.2 b.

Puoi vedere che se la finestra di un'altra applicazione si sovrappone temporaneamente alla finestra della tua applicazione, l'immagine disegnata sulla tela del modulo viene danneggiata. Vediamo come eliminare questa mancanza.

Se la finestra è stata sovrapposta e l'immagine è stata danneggiata, il sistema operativo informa l'applicazione che qualcosa è cambiato nell'ambiente e che l'applicazione dovrebbe intraprendere l'azione appropriata. Non appena è richiesto un aggiornamento della finestra, viene generato un evento per esso SuPaint... Nel gestore di questo evento (nel nostro caso, l'evento del modulo), è necessario ridisegnare l'immagine.

Il ridisegno può essere eseguito in modi diversi a seconda dell'applicazione. Nel nostro esempio, potremmo eliminare la dichiarazione di una variabile BitMap(operatore varia BitMap: TBitMap) al di fuori della procedura di cui sopra, ad es. rendere questa variabile globale inserendola direttamente nella sezione implementazione... Operatore BitMap. Libero potrebbe essere spostato nel gestore eventi del modulo Distruggi che si verifica quando l'applicazione viene chiusa. Quindi, durante l'intero tempo di esecuzione della tua applicazione, avrai una copia dell'immagine nel componente BitMap e devi solo entrare nel gestore dell'evento SuPaint forma un solo operatore:

Disegna (10, 10, BitMap);

Fai questo e vedrai che l'immagine sul modulo non si deteriora per eventuali finestre sovrapposte.

Oltre al metodo considerato Disegno la tela ha anche un metodo di copia CopyRect:

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

Il metodo copia quello specificato dal parametro Fonte area dell'immagine nella tela della sorgente dell'immagine Tela nel parametro specificato dest l'area di questa tela. Un tipo TRect caratterizzare aree rettangolari Fonte e dest, già descritto nella sezione 3.2 .

Ad esempio, l'operatore

CopyRect (MyRect2, Bitmap. Canvas, MyRect1);

copie sulla tela del modulo in zona MyRect2 immagine dall'area MyRect1 tele componenti Bitmap.

Metodo di copia CopyRect prodotto nella modalità impostata dalla proprietà Modalità Copia... Per impostazione predefinita, questa proprietà ha il valore cmSrcCopia, che significa semplicemente sostituire l'immagine precedentemente contenuta nell'area dest, sull'immagine copiata. Altri possibili valori Modalità Copia consentono di combinare le immagini, ma la loro considerazione esula dallo scopo di questo libro.

Ci limiteremo a queste informazioni di base sull'output delle informazioni grafiche sulla tela. Sezione 3.2 sono state riportate informazioni sull'output sul canvas del testo. In generale, il canvas è un oggetto complesso con molte più proprietà e metodi. Ma ciò richiede una discussione dettagliata che va oltre lo scopo di questo libro. Il prossimo libro della serie All About Delphi esplorerà questi problemi in modo più dettagliato.

Un componente della finestra che ha la proprietà Tela- tela.

Componenti immagine e PaintBox

Componenti Immagine e Paintbox rappresentare una superficie limitata con una tela su cui è possibile inserire le immagini, come descritto nella sezione 4.2 ... In questo caso, il componente Paintbox, infatti, non dà nulla di nuovo rispetto al disegnare una forma sulla tela. Disegnare su Paintbox invece della forma, non ha vantaggi, tranne, forse, un po' di sollievo nella posizione di uno o più motivi nell'area della finestra.

Ma oltre a queste capacità, il componente Immagine ci sono proprietà che consentono di lavorare con diversi tipi di file grafici Supporta tre tipi di file: bitmap, icone e metafile. Tutti e tre i tipi di file memorizzano le immagini; l'unica differenza è nel modo in cui sono archiviati all'interno dei file e nei mezzi per accedervi. Bitmap (file con estensione. bmp) visualizza il colore di ciascun pixel nell'immagine. In questo caso, le informazioni vengono memorizzate in modo tale che qualsiasi computer possa visualizzare un'immagine con una risoluzione e un numero di colori corrispondenti alla sua configurazione.

Pittogrammi (file con estensione. ico) sono matrici di piccoli bit. Sono ubiquitariamente utilizzati per rappresentare le icone delle applicazioni, nei pulsanti rapidi, nelle voci di menu, in vari elenchi. Il modo di memorizzare le immagini nelle miniature è simile alla memorizzazione delle informazioni nelle bitmap, ma ci sono alcune differenze. In particolare, l'icona non può essere ridimensionata, mantiene la dimensione in cui è stata creata.

I metafile non memorizzano la sequenza di bit che compongono l'immagine, ma informazioni su come è stata creata l'immagine. Memorizzano sequenze di comandi di disegno che possono essere ripetute durante la ricreazione di un'immagine. Ciò rende questi file generalmente più compatti dei file bitmap.

Componente Immagine consente di visualizzare le informazioni contenute in file grafici di tutti i tipi specificati. Questo è fatto dalla sua proprietà Foto- oggetto di tipo TPicture.

Figura 4.3 Finestra dell'editor di immagini


Per familiarizzare con questa proprietà, aprire una nuova applicazione e trascinare il componente nel modulo. Immagine... Allungalo o impostane la proprietà Allineare pari alClient in modo che occupi l'intera area client del modulo. Fare clic sul pulsante con i puntini di sospensione accanto alla proprietà Foto nella finestra Object Inspector o fai doppio clic su Immagine... Si aprirà davanti a te la finestra Picture Editor (Fig. 4.3), che ti permetterà di caricare nella proprietà Foto qualsiasi file grafico (pulsante Carica), nonché salvare il file aperto con un nuovo nome o in una nuova directory. Fare clic su Carica per caricare il file grafico. Vedrai una finestra per l'apertura di un file grafico, mostrata in Fig.4.4 Mentre muovi il cursore nell'elenco dei file grafici, la finestra di destra mostra le immagini che contengono e sopra di loro - i numeri che caratterizzano la dimensione dell'immagine. Puoi selezionare qualsiasi tipo di file grafico di cui hai bisogno. Ricordiamo che i file grafici forniti con Delphi si trovano nella directory Images. In Delphi 5 e 4, di solito si trova in una directory. \ file di programma \ Common Files \ Borland Shared. In Delphi 3, si trova nella directory. \ program files \ Borland \ Delphi 3, e in Delphi 1 si trova nella directory Delphi 16. Dopo aver scaricato il file, fai clic su OK nella finestra dell'editor di immagini e nel tuo componente Immagine verrà visualizzata l'immagine selezionata. Puoi avviare la tua applicazione e ammirarla. Tuttavia, puoi già vedere l'immagine senza nemmeno eseguire l'applicazione.

Quando hai caricato un'immagine da un file in un componente durante il processo di progettazione Immagine, non solo lo visualizza, ma lo memorizza anche nell'applicazione. Questo ti dà la possibilità di spedire la tua applicazione senza un file grafico separato. Tuttavia, come vedremo in seguito, in Immagine file grafici esterni possono essere caricati anche mentre l'applicazione è in esecuzione.

Torniamo a considerare le proprietà del componente. Immagine.

Se imposti la proprietà Dimensione dell'auto v vero, quindi la dimensione del componente Immagine si adatterà automaticamente alle dimensioni dell'immagine al suo interno. Se la proprietà Dimensione dell'auto installato in falso, quindi l'immagine potrebbe non adattarsi al componente o, al contrario, l'area del componente potrebbe risultare molto più grande dell'area dell'immagine.

Un'altra proprietà è Stirata consente di adattare non il componente alle dimensioni dell'immagine, ma l'immagine alle dimensioni del componente. Installare Dimensione dell'auto v falso, allungare o ridurre le dimensioni del componente Immagine e installa Stirata v vero... Vedrai che il disegno occuperà l'intera area del componente, ma poiché è poco realistico impostare le dimensioni Immagine proporzionale alla dimensione dell'immagine, l'immagine risulterà distorta. Installare Stirata v vero può avere senso solo per alcuni modelli, ma non per le immagini. Proprietà Stirata non funziona su immagini di pittogrammi, che non possono essere ridimensionati.

Proprietà - Centro ambientato vero, centra l'immagine sul quadrato Immagine se la dimensione del componente è maggiore della dimensione dell'immagine.

Consideriamo un'altra proprietà - Trasparente(trasparenza). Se Trasparente equivale vero, quindi l'immagine in Immagine diventa trasparente. Questo può essere usato per sovrapporre le immagini una sopra l'altra. Posiziona il secondo componente sul modulo Immagine e caricare un'altra immagine in esso. Prova solo a fare una piccola foto piena e di contorno. È possibile, ad esempio, scattare una foto tra quelle solitamente posizionate sui pulsanti, ad esempio una freccia (file.\Programmi\file comuni\borland shared\immagini\pulsanti\freccia1l.Bmp). Muovi il tuo Immagine in modo che si sovrappongano l'uno all'altro e nel set di componenti superiore Trasparente pari vero... Vedrai che l'immagine in alto non oscura più quella in basso. Una delle possibili applicazioni di questa proprietà è l'imposizione di iscrizioni sull'immagine, realizzate sotto forma di matrice di bit. Queste etichette possono essere create utilizzando l'editor di immagini integrato in Delphi.

Si noti che la proprietà Trasparente agisce solo su matrici di bit. In questo caso, il colore del pixel in basso a sinistra della matrice di bit viene reso trasparente (ovvero sostituito dal colore dell'immagine sottostante) per impostazione predefinita.

Abbiamo coperto il caricamento di un'immagine da un file durante il processo di progettazione. Ma la proprietà Foto permette inoltre di organizzare facilmente lo scambio con file grafici di qualsiasi tipo durante l'esecuzione dell'applicazione. Per spiegare la tecnica di tale scambio, bisogna prima considerare più in dettaglio la proprietà Foto.

Questa proprietà è un oggetto, che a sua volta ha proprietà secondarie che puntano all'oggetto grafico memorizzato. Se in Foto viene memorizzata la matrice di bit, puntata dalla proprietà Foto. Bitmap... Se un'icona è memorizzata, è puntata dalla proprietà Foto. Icona... Il metafile memorizzato è puntato dalla proprietà Foto. Metafile... Infine, un oggetto grafico di tipo arbitrario è indicato dalla proprietà Foto. Grafico.

Un oggetto Foto e le sue proprietà Bitmap, Icona, Metafile e Grafico avere metodi di lettura e scrittura dei file Carica da file e Salva in file:

procedura Carica da file ( cost Nome del file: corda);

procedura Salva in file ( cost Nome del file: corda);

Per le proprietà Foto. Bitmap, Foto. Icona e Foto. Metafile il formato del file deve corrispondere alla classe dell'oggetto: matrice di bit, icona, metafile. Quando si legge un file in una proprietà Foto. grafica il file deve essere in formato metafile. E per l'oggetto stesso Foto i metodi di lettura e scrittura si adattano automaticamente al tipo di file. Spieghiamolo con un esempio.

Costruiamo un'applicazione simile all'esempio di visualizzazione di file grafici discusso nella sezione 4.2. Tanto per cambiare, puoi organizzarne il controllo non tramite un pulsante Pulsante e il menù. Posiziona un componente sul modulo Immagine... Allungalo o impostane la proprietà Allineare pari alClient in modo che occupi l'intera area client del modulo. Trascina il componente della finestra di dialogo di apertura del file grafico nel modulo OpenPictureDialog(vedi sezione 8.2 ). Posiziona anche il componente del menu principale nel modulo Menu principale(vedi sezione 6.1 ) e imposta una sezione al suo interno - File. Nel gestore di questa sezione, scrivi l'operatore

(OpenPictureDialog1. Esegui) poi... Foto. LoadFromFile (. NomeFile);

Questo operatore chiamerà la finestra di dialogo per l'apertura di un file grafico (vedi Fig. 4.4) e caricherà nel componente Immagine1 un'immagine da un file selezionato dall'utente (vedi Figura 4.5). Inoltre, il file può essere di qualsiasi tipo: matrice di bit, icona o metafile.

Figura 4.5 Immagine nel componente Immagine matrice di bit (a) e pittogrammi (6)



In questa applicazione, il metodo Carica da file applicata ai Immagine1. Foto... Se verranno aperti solo file a matrice di bit, l'operatore di caricamento del file può essere sostituito con

Foto. Bitmap. LoadFromFile (. NomeFile);

Per i pittogrammi può essere utilizzato l'operatore. Foto. Icona. LoadFromFile (. NomeFile);

e per i metafile, l'operatore. Foto. Metafile. LoadFromFile (. NomeFile);

o. Foto. Grafico. LoadFromFile (. NomeFile);

Ma in tutti questi casi, se il formato del file non corrisponde a quello previsto, si verificherà un errore. Il metodo funziona in modo simile. Salva in file con la differenza che si applicava a Foto o a Foto. Grafico salva un'immagine di qualsiasi formato in un file. Ad esempio, se integri la tua applicazione con una finestra di dialogo Finestra di dialogo Salva immagine(vedi sezione 8.2 ), entrare nella sezione Salva con nome nel menu e posizionare l'operatore nel suo gestore

SalvaPictureDialog1. Eseguire poi... Foto. SaveToFile (SavePictureDialog1. NomeFile);

quindi l'utente potrà salvare un'immagine di qualsiasi formato in un file con un nuovo nome. Solo in questo caso, per evitare ulteriore confusione, l'estensione del file salvato deve comunque corrispondere al formato dell'immagine salvata.

Il programma funzionerà in modo assolutamente identico per le immagini di qualsiasi formato se sostituisci l'operatore di salvataggio con

Foto. Grafico. SaveToFile (. NomeFile);

usando la proprietà Foto. Grafico... E se conosci il formato memorizzato nel componente Immagine immagini, quindi puoi applicare il metodo Salva in file alle proprietà Foto. Bitmap, Foto. Icona e Foto. Metafile.

Per tutti gli oggetti considerati Foto, Foto. Bitmap, Foto. Icona e Foto. Metafile sono definiti i metodi per l'assegnazione dei valori agli oggetti:

Assegna (Fonte: TPersistent);

Tuttavia, per BitMap, Icona e Metafile possono essere assegnati solo i valori di oggetti omogenei: rispettivamente, matrici di bit, icone, metafile. Viene generata un'eccezione quando si tenta di assegnare valori a oggetti dissimili EConvertError... Un oggetto Foto- universale, può essere assegnato ai valori degli oggetti di una qualsiasi delle altre tre classi. E il valore Foto può essere assegnato solo a un oggetto il cui tipo è lo stesso del tipo dell'oggetto in esso memorizzato.

Metodo Assegnare può essere utilizzato anche per scambiare immagini con gli Appunti. Ad esempio, l'operatore

Assegna (Immagine1. Immagine);

aggiungerà agli appunti l'immagine memorizzata in Immagine1... Allo stesso modo, l'operatore

app grafica delphi immagine

Immagine1. Foto. Assegna (appunti);

leggi dentro Immagine1 l'immagine negli appunti. Inoltre, può essere qualsiasi immagine o anche testo.

Hai solo bisogno di ricordare quando lavori con gli appunti da inserire nell'operatore usa il tuo modulo link al modulo Clipbrd... Delphi non inserisce automaticamente questo collegamento.

Tornando alle proprietà del componente Immagine, possiamo notare uno svantaggio inerente alla nostra applicazione di prova mostrata nella Figura 4.5 Quando si caricano immagini diverse, la dimensione della finestra dell'applicazione potrebbe essere troppo piccola, e quindi vedrai solo una parte dell'immagine, o troppo grande, e quindi il l'immagine sarà brutta posizionata nell'angolo in alto a sinistra della forma, lasciando molto spazio bianco. Questo svantaggio può essere eliminato utilizzando le proprietà Altezza(altezza) e Larghezza(larghezza) componente Immagine... Con la proprietà Dimensione dell'auto stabilito in vero dimensioni Immagine vengono impostati automaticamente uguali alla dimensione dell'immagine caricata. E queste dimensioni possono essere utilizzate per ridimensionare il modulo di conseguenza. Ad esempio, il codice sopra per caricare un'immagine da un file può essere sostituito con il seguente:

OpenPictureDialog1. Eseguire poi

inizio... Foto. LoadFromFile (. NomeFile) ;. Altezza Cliente: = Immagine1. Altezza + 10 ;. In alto: = Modulo1. ClienteRett. Superiore

+ (Form1. ClientHeight - Image1. Height) div 2 ;. LarghezzaCliente: = Immagine1. Larghezza + 10 ;. Sinistra: = Modulo1. ClienteRett. Sono partiti

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

fine;

Questo codice imposta l'area client del modulo leggermente più grande del componente. Immagine1, che a loro volta si adattano alle dimensioni dell'immagine a causa della proprietà Dimensione dell'auto... Apporta queste correzioni alla tua applicazione, eseguila e vedrai che il modulo ha iniziato ad adattarsi automaticamente alle dimensioni dell'immagine caricata.

Componente forma

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

Esempi di queste forme sono mostrati nella Figura 4.7.

Figura 4.7 Esempi di componenti Forma


Un'altra proprietà essenziale di un componente è Spazzola(spazzola). Questa proprietà è un oggetto di tipo TBrush, che ha una serie di sottoproprietà, in particolare: color ( Spazzola. Colore) e stile ( Spazzola. Stile) riempire la forma. Riempi con alcuni valori Stile puoi vedere in Figura 4.7 La terza delle proprietà specifiche del componente Forma - Penna(penna) che definisce lo stile della linea. Questa proprietà, come la proprietà Spazzola, sono già stati considerati nella Sezione 4.2. ... È possibile trovare informazioni di base su queste proprietà nel Capitolo 10 *.

Componente del grafico

Consideriamo ora il componente Grafico... Questo componente consente di creare vari grafici e diagrammi dall'aspetto molto impressionante (Figura 4.8). Componente Grafico ha molte proprietà, metodi, eventi, quindi se vengono considerati tutti, allora questo dovrebbe dedicare un intero capitolo. Pertanto, ci limiteremo a considerare solo le caratteristiche principali Grafico... Per il resto, puoi controllare l'aiuto integrato di Delphi o semplicemente provarli sperimentando con i diagrammi.

Componente Graficoè un contenitore di oggetti Serie genere TChartSeries- serie di dati con diversi stili di visualizzazione. Ogni componente può includere più serie. Se vuoi visualizzare un grafico, ogni serie corrisponderà a una curva nel grafico. Se si desidera visualizzare grafici, per alcuni tipi di grafici è possibile sovrapporre diverse serie, per altri (ad esempio per i grafici a torta) probabilmente sembrerà brutto. Tuttavia, anche in questo caso, puoi impostare per un componente Grafico diverse serie degli stessi dati con diversi tipi di grafici. Successivamente, attivandone uno in ogni istante, è possibile fornire all'utente la scelta del tipo di grafico che visualizza i dati di interesse.

Posiziona uno o due (se vuoi riprodurre la Figura 4.8) componenti Grafico sul modulo e guarda le proprietà aperte in Object Inspector. Diamo una spiegazione di alcuni di essi.

Determina la capacità dell'utente di scorrere la porzione osservata del grafico in fase di esecuzione premendo il pulsante destro del mouse. Valori possibili: pmNessuno - lo scorrimento è vietato, pmHorizontal, pmVertical o pmBoth - lo scorrimento è consentito, rispettivamente, solo in direzione orizzontale, solo in direzione verticale o in entrambe le direzioni.

Consente all'utente di modificare la scala dell'immagine durante l'esecuzione ritagliando frammenti di un diagramma o grafico con il cursore del mouse (nella Figura 4.8 b di seguito, il momento della visualizzazione di un frammento del grafico è mostrato per intero, mostrato nella Figura 4.8 a) .

Specifica il titolo del grafico.

Definisce la didascalia sotto il grafico. Nessuno per impostazione predefinita. Il testo della firma è definito dalla sottoproprietà Testo.

Definisce un bordo attorno al grafico.

La legenda del grafico è un elenco di simboli.

Margine sinistro, Margine destro, Margine superiore, Margine inferiore

Valori dei margini sinistro, destro, superiore e inferiore.

Asse Inferiore, Asse Sinistro, Asse Destro

Queste proprietà definiscono rispettivamente le caratteristiche degli assi inferiore, sinistro e destro. L'impostazione di queste proprietà ha senso per i grafici e alcuni tipi di grafici.

Parete Sinistra, Parete Inferiore, Parete Posteriore

Queste proprietà determinano rispettivamente le caratteristiche dei bordi sinistro, inferiore e posteriore dell'area di visualizzazione tridimensionale del grafico (vedi Fig. 4.8 a, grafico in basso).

Elenco delle serie di dati visualizzate nel componente.

Abilita o disabilita la visualizzazione 3D della carta.

Caratteristiche di visualizzazione 3D.

La scala della tridimensionalità (per la Fig. 4.8 è lo spessore del grafico e la larghezza delle bande del grafico).


Accanto a molte delle proprietà elencate nell'Ispettore oggetti, sono presenti pulsanti con i puntini di sospensione che consentono di richiamare una o l'altra pagina dell'Editor diagramma, una finestra multipagina che consente di impostare tutte le proprietà dei diagrammi. È anche possibile chiamare l'editor di diagrammi facendo doppio clic sul componente Grafico oppure facendo clic destro su di esso e scegliendo Modifica grafico dal menu a comparsa.

Se vuoi provare a riprodurre l'applicazione mostrata in Figura 4.8, fai doppio clic sul componente in alto Grafico... Verrai indirizzato alla finestra Editor grafico (Fig. 4.9) alla 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 (Figura 4.10), in cui puoi 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 diagramma, la scheda Legenda consente di impostare i parametri per visualizzare la legenda del diagramma (elenco di simboli) o addirittura nasconderla dallo schermo, la scheda Pannello determina l'aspetto del pannello su cui viene visualizzato il diagramma, la scheda 3D consente di modificare l'aspetto del diagramma: inclinazione, taglio, spessore, ecc.

Quando stai lavorando con l'editor di grafici e hai selezionato un tipo di grafico, nei componenti Grafico il tuo modulo mostra la sua vista con i dati condizionali inseriti in esso (vedi Fig. 4.11).

Figura 4.10 Scelta di un tipo di grafico nell'editor di grafici


Pertanto, puoi immediatamente osservare il risultato dell'applicazione di varie opzioni alla tua applicazione, il che è molto conveniente.

La pagina Serie, che dispone anche di una serie di schede, consente di selezionare caratteristiche aggiuntive per la visualizzazione della serie. In particolare, per un grafico a torta nella scheda Formato, è utile abilitare l'opzione Torta cerchiata, che farà in modo che per qualsiasi dimensione del componente Grafico visualizzare un grafico sotto forma di cerchio. Nella scheda Segni, i pulsanti del gruppo Stile determinano cosa verrà scritto sulle etichette relative ai singoli segmenti del grafico: Valore - valore, Percentuale - percentuale, Etichetta - nomi dati, ecc. Nell'esempio in Figura 4.8, il pulsante Percentuale è abilitato e la scheda Generale è impostata su un modello di percentuale per visualizzare solo valori interi.

Puoi, se vuoi, aggiungere a questo componente Grafico un'altra serie identica facendo clic sul pulsante Clona nella scheda Serie della pagina Grafico, quindi, per questa nuova serie, fare clic sul pulsante Modifica e selezionare un tipo di grafico diverso, ad esempio Bar. Naturalmente, due diversi tipi di grafici nella stessa immagine avranno un aspetto negativo. Ma puoi disattivare l'indicatore di questa nuova serie nella scheda Serie e quindi fornire all'utente la scelta di uno o un altro tipo di visualizzazione del grafico (di seguito verrà mostrato come è fatto).

Esci dall'editor di diagrammi, seleziona il componente inferiore nella tua applicazione Grafico e reimpostare le proprietà per esso utilizzando l'editor di diagrammi. In questo caso, sarà necessario specificare due serie, se si desidera visualizzare due curve sul grafico, e selezionare il tipo di grafico a linee. Poiché si tratta di grafici, è possibile utilizzare le schede Axis e Walls per definire le caratteristiche delle coordinate degli assi e dei bordi 3D del grafico.

Questo completa la progettazione dell'aspetto dell'applicazione. L'unica cosa che resta da fare è scrivere il codice che specifica i dati che si desidera visualizzare. Per la nostra applicazione di test, impostiamo solo alcuni dati costanti nel grafico a torta e le funzioni seno e coseno nei grafici.

Per impostare i valori visualizzati, utilizzare i metodi in serie Serie... Soffermiamoci su solo tre metodi principali.

Metodo Chiaro cancella la serie dai dati precedentemente inseriti.

Metodo Aggiungere:

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

consente di aggiungere un nuovo punto al diagramma. Parametro Un valore corrisponde al valore aggiunto, parametro Un'etichetta- il nome che verrà visualizzato sul diagramma e nella legenda, Un colore- colore. Parametro Un'etichetta- opzionale, puoi impostarlo vuoto: "".

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

permette di aggiungere un nuovo punto al grafico della funzione. Parametri AXValue e AYValue corrispondono a un argomento e a una funzione. Parametri Un'etichetta e Un colore lo stesso del metodo Aggiungere.

Pertanto, la procedura per caricare i dati nel nostro esempio può essere la seguente:

155;=251;=203;=404;

varia: parola;

inizio Serie1 fare

inizio; (A1, "Negozio 1", clGiallo); (A2, "Negozio 2", clBlu); (A3, "Negozio 3", clRosso); (A4, "Negozio 4", clViola);

fine;. Chiaro ;. Chiaro;

per io: = 0 a 100 fare

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

Se hai previsto, ad esempio, per i dati visualizzati in un grafico, due serie Serie1 e Serie4 tipi diversi - Torta e Sbarra, quindi è possibile introdurre una procedura che modifichi il tipo di grafico su richiesta dell'utente. Questa procedura può essere iniettata nell'evento Al clic un pulsante, in un comando di menu o, ad esempio, solo per gestire un clic su un componente Grafico... Per caricare i dati in Serie4 e per rendere invisibile questo diagramma in un primo momento, puoi inserire alla fine della procedura sopra le dichiarazioni

Assegna (Serie1) ;. Attivo: = falso;

Il primo di questi operatori sovrascrive i dati inseriti in Serie1, in serie Serie4... E il secondo operatore rende la serie invisibile Serie4... La modifica del tipo di diagramma viene eseguita dalla procedura

Attivo: = non Serie1. Attivo ;. Attivo: = non Serie4. Attivo;

Nella Figura 4.8 b, puoi vedere il risultato del passaggio dell'utente a una diversa visualizzazione del diagramma.

Principali articoli correlati