Composant d'affichage d'informations graphiques dans Delphi. Présentation sur le thème "Affichage d'informations graphiques dans Delphi". Liste des composants pour l'affichage des informations graphiques

TRAVAUX DE LABORATOIRE

SUJET: « Graphiques dansDelphes– construction du plus simple
formes géométriques"

Brèves informations de la théorie

Delphi propose au développeur trois manières d'afficher des graphiques :

    tracer pendant que le programme est en cours d'exécution

    utilisation de graphiques pré-créés

    créer des images à l'aide de composants graphiques

Pour créer des graphiques, des classes spéciales ont été créées qui fournissent des outils et des méthodes de dessin : les outils sont décrits en trois classes - Tfont, Tpen, Tbrush ; La zone de dessin et les méthodes sont fournies par la classe Tcanvas.

ClassePoliceT– spécifie les caractéristiques de la police utilisée pour afficher le texte sur le canevas. Les propriétés de la classe sont décrites dans la section « Propriétés de base disponibles pour la plupart des composants ».

ClasseTpen– précise les caractéristiques du stylo (crayon) avec lequel les lignes sont tracées.

Propriétés classe Tpen:

Couleur:Tcolor – couleur de la ligne (par défaut – noir)

Largeur:integer – épaisseur de ligne en pixels ;

Style = (psSolid, psDash, psDot, psdashDot, psClear) – définit le style de ligne (solide, pointillé, pointillé, tiret-pointillé, invisible)

ClasseBrosse– définit les caractéristiques du pinceau qui peint la surface de l’image.

Propriétés classe Brosse:

Couleur:Tcolor – couleur du pinceau (par défaut – blanc)

Style– motif de pinceau, peut prendre les valeurs suivantes :

BsSolid – coloration solide

BsClear – manque d’ombrage

BsVertical – lignes verticales

BsBdiagonal – lignes diagonales droites

BsDiagCross – cellule oblique

BsHorizontal – lignes horizontales

BsFdiagonal – lignes diagonales gauche

BsCross – cage

ClasseToile– détermine la surface sur laquelle l'image créée est placée, et les outils avec lesquels l'image est créée : police, crayon, pinceau.

Par défaut, toute la zone client du formulaire est utilisée comme zone de travail (canvas) (sans l'en-tête, le menu principal et les lignes de défilement du formulaire), mais vous pouvez allouer des zones de travail plus petites à l'intérieur du formulaire à l'aide de composants Boîte de peinture ou Image. L'origine des coordonnées du canevas est le coin supérieur gauche de la zone de travail, la largeur de la zone de travail est déterminée par la propriété Largeur du client, hauteur – propriété Hauteur du client.

Propriétés classe Toile:

Toile:Tcanvas – définit la zone de dessin

Brosse:Tbrush – pinceau pour peindre des formes fermées

Police de caractère:Tfont – police pour afficher le texte sur la toile

Stylo:Tpen – crayon (stylo) pour dessiner

StyloPos:Tpoint – position actuelle du curseur invisible sur le canevas

Commentaire : Type de point T – défini comme suit :

Tapez Point = enregistrement

Pixel : Tcolor - définit les couleurs des pixels du canevas, X, Y - les coordonnées des pixels. La propriété Pixels est pratique à utiliser pour tracer des graphiques à l’aide de points de la couleur sélectionnée.

Principales méthodes de la classe TCanvas

    procédure Déménager à(x,y :entier) ; - déplace le stylo sans tracer de ligne vers un point de coordonnées (x, y).

    Procédure LigneVers(x,y :entier) ; - trace une ligne du point actuel au point de coordonnées (x, y).

Exemple : Tracez une ligne bleue diagonale sur la forme depuis le coin supérieur gauche de la forme jusqu'au coin inférieur droit.

Pen.color:= clblue;

Déplacer vers (0,0); LineTo(ClientWidth, ClientHeight);

    procédure Rectangle(x1,y1,x2,y2:entier); - dessine un rectangle : x1,y1 – coordonnées du coin supérieur gauche ; x2, y2 sont les coordonnées du coin inférieur droit.

Exemple : Dessinez un carré ombré de jaune d'un côté de 60 pixels au milieu de la forme.

var Xc,Yc : entier ; //

Xc:=ClientWidth div 2 ;

Xy:=ClientHeight div 2 ;

Canvas.Brush.color:=cljaune;

Toile.rectangle(xc-30,Yc-30,xc+30,Yc+30);

    procédure Ellipse(x1,y1,x2,y2:entier); - dessine une ellipse inscrite dans un rectangle avec les coordonnées spécifiées.

Exemple : dessinez une ellipse inscrite dans le composant PaintBox.

PaintBox1.Canvas.Pen.Width:=4; //largeur de ligne = 4 pixels

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

    procédure Polygone(); - dessine un polygone fermé spécifié par un tableau de coordonnées.

Exemple : dessinez un losange rempli reliant les milieux des côtés de la forme

Var Xc,Yc : entier ; // coordonnées du centre de l'espace client du formulaire

Xc:=ClientWidth div 2 ;

Xy:=ClientHeight div 2 ;

Canvas.Brush.Color:=Rvb (275,140,70); // orange couleur ombres

Canvas.Polygon();

fin;

    Procédure Arc(x1,y1,x2,y2,x3,y3,x4,y4 :entier); - affiche l'arc d'une ellipse délimité par un rectangle (x1, y1, x2, y2). L'arc est affiché d'un point de coordonnées (x3,y3) à un point de coordonnées (x4,y4) contre dans le sens des aiguilles d'une montre.

Exemple : tracez un arc d'ellipse reliant le milieu de la face supérieure du composant
PaintBox avec le milieu de son côté droit.

Procédure Tform1.Button1Click(Sender:Tobject);

Var X3,y3,x4,y4 : Entier ;

Avec PaintBox1, faites

Canvas.Pen.Color:= clWhite;

Canvas.Pen.Width:= 3;

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

X3 := ClientWidth div 2 ;

X4 := LargeurClient ;

Y4 := ClientHeight div 2 ;

Canvas.Pen.Color:= clMaroon;

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

Fin;

    procédure Accord(x1,y1,x2,y2,x3,y3,x4,y4 :entier); - trace une corde - une droite reliant 2 points de l'ellipse : un point de coordonnées (x3, y3) avec un point (x4, y4).

Exemple : Remplacez la méthode Chord dans l'exemple donné par la méthode ARC et obtenez le résultat suivant.

    procédure Tarte(x1,y1,x2,y2,x3,y3,x4,y4 :entier); - dessine un segment d'ellipse reliant le centre de l'ellipse aux coordonnées (x3,y3) et (x4,y4).

Exemple : Dans l'exemple donné pour la méthode ARC, imaginez la méthode PIE et obtenez ce résultat.

    procédure Sortie de texte(x,y:entier;Texte:chaîne); - affiche la chaîne passée dans le paramètre Texte dans un rectangle dont le coin supérieur gauche est spécifié coordonnées x,y. Les caractéristiques de la police sont définies par l'outil Police.

Exemple : écrivez le nom du graphique tracé au bas du formulaire.

Toile.Font.Hauteur : = 20 ; //hauteur du caractère 20 pixels

Canvas.Font.Color:=clblue;

Canvas.TextOut(10, ClientHeight-24, 'graphique de la fonction SIN(X)');

Composants graphiques

Delphi propose un certain nombre de composants prêts à l'emploi qui vous permettent d'améliorer interface utilisateur. Ces composants se trouvent sur la page Supplémentaire Et Système palettes de composants.

ComposantImage(ClasseImage) – créé pour afficher des images graphiques stockées dans des fichiers externes avec des extensions :

    Ico(icône, pictogramme) ;

    Bmp (bitmap, bitmap);

    Wmf, .emf (métafichier) ;

    Jpg, .jpeg (image compressée JPEG).

Basique propriétés :

Dimensionnement automatique:boolean – lorsqu'il est défini sur true, le composant ajuste ses dimensions à la taille de l'image chargée ; la valeur par défaut est fausse.

Extensible:boolean – si vrai, la valeur chargée occupe toute la surface du composant ; la valeur par défaut est fausse.

Toile:Tcanvas – utilisé pour dessiner à l'intérieur du composant pendant l'exécution du programme.

Image:Tpicture - Définit l'image placée dans le composant.

Basique méthodes classe Timage:

Procédure ChargerDeFichier(Nom du fichier : chaîne ); - charge une image à partir d'un fichier nommé Filename dans le composant.

Procédure Enregistrer dans un fichier(Nom du fichier : chaîne ); -enregistre l'image du composant dans un fichier nommé Filename.

ComposantBoîte de peinture - définit une zone de dessin rectangulaire. La propriété principale est Toile, toutes les méthodes de la classe Tcanvas sont disponibles, elle n'a pas de propriétés indépendantes.

Exemple : dessinez une ellipse jaune inscrite dans le composant PaintBox1.

Procédure Tform1Button1Click(sender:Tobject);

Avec PaintBox1.Canvas, faites

Brush.Color:=cljaune;

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

fin;

ComposantBitBtn bouton raster

Le bouton BitBtn, contrairement au bouton standard, peut, en plus du titre (Légende), contenir une image spécifiée par la propriété Glyphe. Il existe un ensemble de boutons BitBtn standard, avec des propriétés prédéfinies (avec une image, une inscription et un objectif spécifiques) - le type de bouton standard est sélectionné via la propriété Gentil. Kind=(bkCustom, bkAbort,bkCancel, bkClose …)

Tâche n°1

Créez une application qui contient deux composants Image et 4 boutons sur le formulaire principal ("Charger l'image", "Construire une figure géométrique", "Changer la couleur", "Quitter"), et permet de :

a) chargez l'image graphique sélectionnée par l'utilisateur dans le composant Image1 afin que l'image occupe toute la zone du composant Image.

b) sous le composant Image1, affichez l'inscription « Ceci est une image provenant d'un fichier.

(pour toute mesure de la taille et de la position du composantImage1 inscription doit
situé strictement sous le composant).

c) dessiner une figure géométrique à l'intérieur du composant Image2 : un segment d'ellipse rempli reliant le milieu du composant Image aux milieux des côtés inférieur et droit du composant Image.

(pour tout changement de taille et de position du composantImage2 la figure doit être construite correctement, c'est-à-dire selon les spécifications du composantImage2)

d) changer la couleur du trait d'une figure dessinée dans Image2 à la demande de l'utilisateur à l'aide du composant ColorDialog.

Tâche n°2

Créez une application qui vous permet de placer aléatoirement plusieurs étiquettes (par exemple, le mot « Hourra ! ») dans le composant Image. Pour implémenter cela, utilisez le générateur de nombres aléatoires Randomize et la fonction Random.

Les dimensions du composant Image, le mot affiché dans l'Image et le nombre de mots doivent être renseignés par l'utilisateur.

Tâche n°3

Créez une application qui vous permet de sélectionner le nom d'une forme géométrique dans une ListBox et de dessiner la forme sélectionnée dans le composant Image. La couleur de la forme est sélectionnée à partir du composant RadioGroup.

Tâche n°4

Divisez le composant PaintBox1 en 4 parties égales, peignez chaque partie d'une couleur différente, par exemple : bleu, jaune, vert, rouge.

À côté de chaque coin de PaintBox1, écrivez les coordonnées de ce coin (par rapport à l'origine du formulaire sur lequel se trouve le composant PaintBox1).

Tâche n°5

AVEC

sélectionnez le type de forme à dessiner à partir du composant Radiogroup1, la couleur de remplissage à partir du composant Radiogroup2 et dessinez la forme sélectionnée dans le composant Image.

Tâche n°6

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Divisez le composant PaintBox1 en 2 parties égales, à l'intérieur de chaque partie dessinez une ellipse, remplie de la couleur sélectionnée par l'utilisateur dans ColorDialog.

Tâche n°7

AVEC Créez une application qui vous permet de :

sélectionnez le nom d'une forme géométrique dans la ListBox et dessinez la forme sélectionnée dans le composant Image. La forme doit être remplie avec la couleur sélectionnée par l'utilisateur dans le composant ColorDialog si Oui est sélectionné dans le composant RadioGroup.

Tâche n°8

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Divisez le composant PaintBox1 en 4 parties égales, à l'intérieur de chaque partie dessinez une forme géométrique différente (ellipse, losange, triangle et rectangle). La couleur de chaque forme est sélectionnée par l'utilisateur dans le ColorGrid.

Tâche n°9

sélectionnez le nom de la forme géométrique dans la ListBox
formes (ellipse, losange, rectangle) et dessinez
la forme sélectionnée dans le composant Image. Emplacement
formes dans le composant Image (quartier I, quart II,

III ou IV quart) et la couleur de la figure est sélectionnée
à partir des composants RadioGroup.

Tâche n°10

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Précisez que la taille du côté ne peut pas être du texte, ne peut pas être un nombre négatif et ne peut pas dépasser la taille plus petite du formulaire.

Divisez le composant PaintBox1 en 4 parties égales, à l'intérieur de chaque partie dessinez une forme géométrique sélectionnée par l'utilisateur dans la Combobox (ellipse, losange, triangle et rectangle). La couleur de la figure est sélectionnée par l'utilisateur dans la ColorBox.

Tâche n°11

Créez une application qui vous permet de :

sélectionner dans le composant Radiogroup la position du dessin

dans le composant Image du triangle rectangle, définissez
la couleur de l'ombrage ou de la couleur du contour de la figure, selon
activation des boutons de case à cocher. Sélectionnez la couleur via
Composant ColorGrid.

Tâche n°12

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Précisez que la taille du côté ne peut pas être du texte, ne peut pas être un nombre négatif et ne peut pas dépasser la taille plus petite du formulaire.

Divisez le composant PaintBox1 en 2 parties égales, à l'intérieur de l'une des parties dessinez une forme géométrique sélectionnée par l'utilisateur dans la Combobox (ellipse, losange, triangle et rectangle). La couleur de la figure est sélectionnée par l'utilisateur dans la ColorBox.

Par exemple, vous pouvez modifier la couleur du formulaire comme suit :

form1.Color:= ColorBox1.Colors;

Tâche n°13

Créez une application qui vous permet de :

a) dessiner un carré au milieu de la forme (la taille du côté du carré est renseignée par l'utilisateur). Précisez que la taille du côté ne peut pas être du texte, ne peut pas être un nombre négatif et ne peut pas dépasser la taille plus petite du formulaire.

b) divisez le carré en une ou deux diagonales, en fonction de l'inclusion des boutons de case à cocher, et peignez chaque triangle obtenu d'une couleur différente. Le choix de la couleur est fait par l'utilisateur.

Tâche n°14

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Précisez que la taille du côté ne peut pas être du texte, ne peut pas être un nombre négatif et ne peut pas dépasser la taille plus petite du formulaire.

Divisez le composant PaintBox1 en 2 parties égales, à l'intérieur d'une partie, dessinez un losange et à l'intérieur de l'autre partie, dessinez n'importe quel triangle. La couleur de la figure est sélectionnée par l'utilisateur dans la ColorBox.

Par exemple, vous pouvez modifier la couleur du formulaire comme suit :

form1.Color:= ColorBox1.Colors;

Tâche n°15

Créez une application qui vous permet de :

a) définir les dimensions du composant Image horizontalement et verticalement pour qu'elles soient identiques et égales au nombre saisi par l'utilisateur à l'aide du clavier ;

(à condition que la taille du côté ne puisse pas être du texte, ne puisse pas être un nombre négatif et ne puisse pas dépasser la taille plus petite du formulaire)

b) divisez le composant Image en 4 carrés égaux avec deux lignes bleues ;

c) à l'intérieur de chaque carré obtenu, dessinez un cercle qui y est inscrit (permettez à l'utilisateur de choisir la couleur des cercles via la boîte de dialogue de sélection des couleurs).

Tâche n°16

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Précisez que la taille du côté ne peut pas être du texte, ne peut pas être un nombre négatif et ne peut pas dépasser la taille plus petite du formulaire.

Divisez le composant PaintBox1 en 9 parties égales et peignez chaque rectangle en damier obtenu. La couleur de remplissage est sélectionnée par l'utilisateur dans la ColorBox.

Par exemple, vous pouvez modifier la couleur du formulaire comme suit :

form1.Color:= ColorBox1.Colors;

Tâche n°17

Placez deux composants Image et quatre boutons sur le formulaire : Couleur de ligne, Couleur de remplissage, Ok et Quitter ; et le composant Edit.

Lorsque vous cliquez sur le bouton OK, un carré de côté X est dessiné dans Image1 et un triangle rectangle avec des branches égales, chacune ayant une longueur X, est dessiné dans Image2.

Le sommet du triangle coïncide avec l'origine de Image2. L'un des sommets du carré coïncide avec l'origine de Image1.

Le bouton OK devient disponible uniquement lorsque vous avez sélectionné une couleur de ligne et une couleur de remplissage pour dessiner la forme.

X – sélectionne au hasard, en utilisant Fonctions aléatoires et le composant Edit doit afficher la valeur de X.

Tâche n°18

Créez une application qui permet à l'utilisateur de définir les dimensions du composant PaintBox1 (en pixels).

Divisez le composant PaintBox1 en 4 parties égales ; à l'intérieur de la partie sélectionnée par l'utilisateur, un cercle rempli doit être construit, dont la taille est définie par l'utilisateur. L'utilisateur sélectionne la couleur de remplissage dans la ColorBox.

Par exemple, vous pouvez modifier la couleur du formulaire comme suit :

form1.Color:= ColorBox1.Colors;

Pour afficher des informations graphiques, la bibliothèque Delphi fournit des composants dont la liste est donnée dans le tableau. 6.

Tableau 6

Composants pour afficher des informations graphiques

Composant Page Description
Image Supplémentaire Utilisé pour afficher des graphiques
PaintBox (fenêtre pour dessiner) Système Utilisé pour créer une zone sur le formulaire dans laquelle vous pouvez dessiner
DrawGrid (table des dessins) Supplémentaire Utilisé pour afficher des données non textuelles dans des lignes et des colonnes
Graphique (graphiques et graphiques) Supplémentaire Le composant appartient à la famille de composants TeeChart, utilisés pour créer des tableaux et des graphiques.
Chartfx (graphiques et graphiques) ActiveX Éditeur de graphiques et de graphiques
FIBook (pages Excel) ActiveX Composante de saisie et de traitement d'informations numériques
VtChart (graphiques) ActiveX Fenêtre de création de diagrammes

De plus, vous pouvez afficher et saisir des informations graphiques sur la surface de n'importe quel composant de fenêtre possédant la propriété Toile- toile.

Tables d'images - Composants DrawGrid et StringGrid

Composant DessinerGrille utilisé pour créer une table dans l'application pouvant contenir images graphiques. Ce composant est similaire au composant Grille de chaînes puisque ce dernier est dérivé de DrawGrid. Donc dans DessinerGrille toutes les propriétés, méthodes, événements du composant sont présents Grille de chaînes sauf ceux liés au texte, c'est-à-dire sauf propriétés Cellules, Cols, lignes, objets. De ce point de vue, la composante Grille de chaînes a des capacités nettement supérieures à celles DessinerGrille puisqu'il peut stocker à la fois des images et des textes dans des cellules. Et si vous souhaitez saisir du texte dans certaines cellules DessinerGrille vous devrez alors utiliser des méthodes pour afficher du texte sur un plan, ce qui n'est pas très pratique.

Composants DrawGrid et StringGrid avoir un aperçu Toile, sur lequel vous pouvez poster des images.

Il existe une méthode Cellule-Rect, qui renvoie la zone de canevas allouée pour une cellule donnée. Cette méthode est définie comme

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

ACol et ARow- des indices de colonnes et de lignes commençant à 0, à l'intersection desquels se trouve la cellule. La zone renvoyée par cette fonction est la zone de canevas dans laquelle l'image souhaitée peut être dessinée. Par exemple, l'opérateur

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

BitMap.Canvas,Rect(0,0,BitMap.Height,BitMap.Width));

méthode de copie CopierRectà la cellule (1,1) du tableau DessinerGrille image du composant BitMap. Cette cellule est la deuxième en partant de la gauche et la deuxième en partant du haut du tableau, puisque les indices commencent à 0. Veuillez noter que si la cellule est plus petite que la taille de l'image copiée, seule la partie supérieure gauche de l'image apparaîtra dans la cellule.

Image sur le canevas du composant DrawGrid et StringGrid, comme sur le canevas de n'importe quel composant, il est sujet à effacement lorsque la fenêtre de l'application est superposée par d'autres fenêtres ou, par exemple, lorsque l'application est réduite.

Un moyen pratique de saisir des images dans des cellules DessinerGrille est d'utiliser un gestionnaire d'événements SurDrawCell. Ces événements se produisent pour chaque cellule du tableau au moment où elle est redessinée. L'en-tête du gestionnaire ressemble à :

procédure TForml.DrawGridlDrawCell(Sender: TObject;

ACol, ARow : entier ; Rect : TRect ; État : TGridDrawState)

Paramètre État indique l'état de la cellule. C'est un ensemble pouvant contenir les éléments suivants : gdSélectionné- cellule sélectionnée, gdFocused- la cellule focalisée, gdFixe- une cellule dans une zone fixe du tableau. Paramètre État peut être utilisé pour afficher les cellules différemment dans différents états.

Composant de forme

Composant de forme ne peut être classé que sous certaines conditions comme moyen d'affichage d'informations graphiques, car il représente simplement diverses formes géométriques, ombrées de manière appropriée. La propriété principale de ce composant est Forme(formulaire), qui peut prendre les valeurs suivantes :

StRectangle – rectangle ;

StSquare – carré ;

StRoundRect - rectangle aux coins arrondis ;

StRouhdSquare - carré aux coins arrondis ;

StEllipse – ellipse ;

StCircle - cercle.

Une autre propriété essentielle du composant est Brosse(brosse). Cette propriété est un objet de type TBrush, ayant un certain nombre de sous-propriétés, notamment la couleur (Pinceau. Couleur) et style (Style Pinceau) remplir la figure. Vous pouvez voir le remplissage de certaines valeurs de style sur la Fig. 3.2. La troisième propriété spécifique du composant Forme- Stylo(stylo) qui définit le style de ligne.

Composant graphique

Regardons maintenant le composant Graphique. Ce composant vous permet de créer divers tableaux et graphiques très impressionnants. Composant Graphique a de nombreuses propriétés, méthodes, événements, de sorte que si nous les considérions tous, nous devrions y consacrer un chapitre entier. Nous nous limiterons donc à considérer uniquement les principales caractéristiques Graphique. Vous pouvez trouver le reste dans l'aide intégrée de Delphi, ou simplement les essayer en expérimentant avec les diagrammes.

Composant Graphique est un conteneur d'objets Série- héritiers de la classe TChartSérie. Chacun de ces objets représente une série de données caractérisées par un certain style d'affichage : un graphique ou un diagramme particulier. Chaque composant Graphique peut comprendre plusieurs épisodes. Si vous souhaitez afficher un graphique, alors chaque série correspondra à une courbe sur le graphique. Si vous souhaitez afficher des graphiques, pour certains types de graphiques, vous pouvez superposer plusieurs séries différentes les unes sur les autres, pour d'autres (comme les diagrammes circulaires), cela aura probablement l'air moche. Cependant, même dans ce cas, vous pouvez définir un composant Graphique plusieurs séries de données identiques avec différents types des diagrammes. Ensuite, en en rendant un actif à chaque fois, vous pouvez proposer à l'utilisateur le choix du type de graphique qui affiche les données qui l'intéressent.

Placez un ou deux composants Graphique sur le formulaire et examinez les propriétés qui s'ouvrent dans l'inspecteur d'objets. Voici quelques explications sur certains d’entre eux.

AllowPanning - détermine la capacité de l'utilisateur à faire défiler la partie observée du graphique pendant l'exécution en appuyant sur le bouton droit de la souris. Valeurs possibles : pmNone - le défilement est interdit, pmHori/ontal, pm Vertical ou pmBoth - le défilement est autorisé, respectivement, uniquement dans le sens horizontal, uniquement dans le sens vertical ou dans les deux sens.

AhowZoom - permet à l'utilisateur de modifier le zoom d'une image au moment de l'exécution en découpant des parties d'un tableau ou d'un graphique avec le curseur de la souris. Si le cadre d'un fragment est dessiné vers la droite et vers le bas, alors ce fragment est étiré pour couvrir tout le champ du graphique. Et si le cadre est tiré vers la gauche, alors l'échelle d'origine est restaurée.

Titre - définit le titre du diagramme.

Pied - définit la légende sous le diagramme. Aucun par défaut. Le texte de la signature est déterminé par la sous-propriété Text.

Cadre - définit le cadre autour du diagramme.

À côté de la plupart des propriétés répertoriées dans l'inspecteur d'objets, il y a des boutons avec des points de suspension qui vous permettent d'appeler l'une ou l'autre page de l'éditeur de graphiques - une fenêtre multipage qui vous permet de définir toutes les propriétés des graphiques. L'éditeur de diagrammes peut également être appelé en double-cliquant sur le composant Graphique ou en cliquant dessus avec le bouton droit et en sélectionnant la commande Modifier le graphique dans le menu contextuel.

Double-cliquez sur le composant supérieur Graphique. Vous serez redirigé vers la fenêtre de l'éditeur de graphique sur la page Graphique, qui comporte plusieurs onglets. Tout d’abord, vous serez intéressé par l’onglet Série. Cliquez sur le bouton Ajouter - ajoutez une série. Vous serez redirigé vers une fenêtre où vous pourrez sélectionner le type de graphique ou de graphique. Dans ce cas, sélectionnez Pie - un diagramme circulaire. A l'aide de l'onglet Titres, vous pouvez définir le titre du graphique, l'onglet Légende permet de définir les paramètres d'affichage de la légende du graphique (liste de symboles) ou de la supprimer complètement de l'écran, l'onglet Panneau détermine l'apparence du panneau sur dans lequel le graphique est affiché, l'onglet 3D vous donne la possibilité de modifier l'apparence de votre graphique : inclinaison, décalage, épaisseur, etc.

Lorsque vous travaillez dans l'éditeur de graphiques et que vous avez sélectionné un type de graphique, les composants Graphique Votre formulaire affiche son apparence avec les données conditionnelles qui y sont saisies. Par conséquent, vous pouvez immédiatement voir le résultat de l’application de diverses options à votre application, ce qui est très pratique.

La page Série, qui comporte également un certain nombre d'onglets, vous permet de sélectionner des options d'affichage supplémentaires pour la série. En particulier, pour un graphique à secteurs, dans l'onglet Format, il est utile d'activer l'option Secteur cerclé, qui garantira que le graphique s'affichera sous forme de cercle quelle que soit la taille du composant Graphique. Dans l'onglet Marques, les boutons du groupe Style déterminent ce qui sera écrit sur les étiquettes liées aux segments individuels du graphique : Valeur - valeur, Pourcentage - pourcentages, Étiquette - noms de données, etc.

Vous pouvez si vous le souhaitez ajouter une autre série identique à ce composant Graphique en cliquant sur le bouton Cloner de l'onglet Séries de la page Graphique, puis pour cela nouvelle série Cliquez sur le bouton Modifier et sélectionnez un autre type de graphique, par exemple à barres.

Quittez l'éditeur de graphiques, sélectionnez le composant graphique inférieur dans votre application et répétez la définition de ses propriétés à l'aide de l'éditeur de graphiques. Dans ce cas, vous devrez spécifier deux séries si vous souhaitez afficher deux courbes sur le graphique, et sélectionner le type de graphique Courbe. Parce que le nous parlons de concernant les graphiques, vous pouvez utiliser les onglets Axe et Murs pour spécifier les caractéristiques de coordonnées des axes et des bords tridimensionnels du graphique.

C'est tout pour le design apparence la demande se termine. Il ne reste plus qu'à écrire le code qui précise les données que vous souhaitez afficher. Pour l'application de test, définissons simplement quelques données constantes dans le diagramme circulaire et quelques fonctions dans les graphiques.

Pour définir les valeurs affichées, vous devez utiliser les méthodes Series. Concentrons-nous uniquement sur trois méthodes principales.

Méthode Clair efface une série de données saisies précédemment.

Méthode Ajouter:

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

permet d'ajouter un nouveau point au diagramme. Paramètre Une valeur correspond à la valeur ajoutée, paramètre Une marque- une étiquette qui sera affichée sur le schéma et dans la légende, Une couleur- couleur. Paramètre Une marque- facultatif, il peut être mis vide : ‘ ’. Méthode AjouterXY :

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

vous permet d'ajouter un nouveau point au graphe de fonction. Possibilités Valeur AX Et Valeur AY correspondent à l’argument et à la fonction. Possibilités ALabel et AColor la même chose que dans la méthode Ajouter.

Ainsi, la procédure de chargement des données dans notre exemple pourrait ressembler à :

const Al = 155 ; A2 = 251 ; A3 = 203 ; A4=404 ; var je:mot; commencer

Avec la série, commencez

Add(Al,"Atelier l", clJaune);

Ajouter(A2,"Atelier 2",clBleu);

Ajouter(A3,"Atelier 3",clRed);

Ajouter(A4,"Atelier 4",clPurple); fin;

Série2.Clair ; SérieS.Clear ; pour i:=0 à 100, commencez

Série2.AddXY(0,02*Pi*i,sin(0,02*Pi*i)

SérieS.AddXY(0,02*Pi*i,cos(0,02*Pi*i) fin ;

ClRed); ,clBleu);

Les opérateurs Clair sont nécessaires si vous souhaitez mettre à jour les données pendant que l'application est en cours d'exécution.

Ceci conclut notre introduction au composant Graphique. Certes, nous n’avons pris en compte qu’une petite partie de ses capacités.


« Affichage d'informations graphiques dans Delphi » Aperçu du sujet : 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 iiiiii nnnn ffff oooo rr rr mmmm ahhh t skst 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 eeee eee g g y g eee ooooo mmmm eee ttt rrrr eeee hhchh eee ssss kkkk eeee xxxx ffff iii yyyy uuuu rrrrr P Pooooo ssss ttt rrrrr ooooo eee nnnn eeee eeee y yy g rrrrr aaaa ffff eeee kkkk oooo vvvv i et et et d d d d iiiiii aaa yyyy rrrrr aaaa mmmm mmmm ....


1. Méthodes d'affichage des informations graphiques. Dans Delphi, il existe plusieurs manières d'afficher des informations graphiques : Sortie d'images pré-préparées (composants Image, Forme) ; P Construction de graphiques et de diagrammes (Composant Chart, etc.) ; F Formation d'images par programmation (objet Canvas).


2.Afficher 2.Afficher les images. L'affichage des images à l'aide du composant Image que nous avons examiné dans LLC DDDDD DDDD LLC Yiyy et et et le ZZZZ P P P P PRRRDDDDDDDDDDDDDD IIII XXXX T T T T T T T T T T TOTEMMM .... Ici, nous considérerons un exemple de mise en œuvre animation la plus simple en modifiant périodiquement l'image affichée dans les composants Image. PPPP EDURRRREEEE YYYE TTTT IIII n N N n AAAAAA PP PRRR IIII MMMMEEEE RRRRR ...






3.Affichage 3.Affichage des formes géométriques. ET À partir de plusieurs composants Shape, vous pouvez créer des dessins simples. P En modifiant par programme la position (.Left,.Top), la taille (.Width,.Height) et la couleur (Brush.Color) des composants Shape dans un dessin, vous pouvez implémenter des éléments de l'animation la plus simple. R R R R aaaa ssssssss mmmm ooooh tttt rrrrr eee tttt yee p p p p rrrrr iii mmmm eee rrrrr....


4.Construction 4.Construction de graphiques et de diagrammes. Les diagrammes sont conçus pour une représentation plus visuelle des tableaux de données numériques, leur affichage visuel et leur analyse. PPPP rrrrr iiii mmmm eee rrrrr.... Pour créer des graphiques dans Delphi, il existe plusieurs composants, l'un d'eux est le composant Chart (section TeeChart Std).










Graphiques et diagrammes. Les données à afficher sont généralement transmises au graphique par programme, exemple : Series1.Clear ; (série claire) pour i:=1 à N do Series1.addxy(i, A[i], clGreen); Valeur de l'axe X Valeur de l'axe Y Étiquette de l'axe X Couleur des données sur le graphique 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 aaaa f f f f uuuu nnnn kkkk tsstst iiiiii y y y y = = = = S S S S iiii nnnn ((((xxxx))))


Suivant : Travaux de laboratoire « « 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 ss xxxx ffff iiii aaaa uuuu rrrrr, et et et xxxx a a a a nnnn iiii mmmm aaaa tsstst iiii yayayaya """"...Tâche : 1) Développer une application pour réaliser une animation simple en modifiant périodiquement l'image affichée dans les composants Image. (Le nombre de photos est d'au moins trois, choisissez vous-même les photos).




Suivant : Travaux de laboratoire """" PPPP oooo ssss tttt rrrrr ooooo eee nnnn iiii eee yy g rrrrr aaaa ffff iiii kkkk ooooo vvvv i i i i d d d iiii aaaa yyyy rrrrr aaaa mmmm mmmm """". ..Tâche : 1)M modifier l'application depuis travail de laboratoire 9 (Afficher les données dans un tableau). Ajoutez la possibilité d'afficher certaines données d'un tableau dans un histogramme ou un diagramme circulaire. 2) Construire un graphique de la fonction donnée.

Bibliothèque de composants visuels (VCL) Delphi nous fournit les composants visuels suivants pour afficher des informations graphiques : Image (image), PaintBox (fenêtre de dessin), DrawGrid (tableau d'images), Chart (tableaux et graphiques), Animate (clips vidéo de sortie). ), ainsi que Form. Ces composants ont une propriété Canvas (discutée ci-dessus) qui donne accès à chaque pixel. Bien entendu, vous n'avez pas besoin de dessiner pixel par pixel pour travailler avec des graphiques dans Delphi ; le système Delphi fournit des outils puissants pour travailler avec des graphiques.

Examinons de plus près les composants ci-dessus :

Composant d'image

Est un objet de la classe TImage. Utilisé pour afficher des images lues à partir de fichiers graphiques. Par défaut, affiche les images présentées au format *.bmp sur la surface du formulaire. Pour sortir des images au format jpg, vous devez inclure le module JPEG dans la directive use. Situé dans l'onglet Supplémentaire de la palette de composants.

Après avoir placé le composant Image sur le formulaire, celui-ci prend la forme d'une zone rectangulaire sélectionnée.

Figure 9 - Composant image sur le formulaire

Pour ouvrir une boîte de dialogue permettant de sélectionner l'image souhaitée, vous devez effectuer les opérations suivantes à l'aide de l'inspecteur d'objets. Pour ce faire, recherchez la propriété Image et cliquez sur les trois points à sa gauche. La fenêtre Picture Editor s'ouvre et sélectionnez Charger ; dans la fenêtre qui s'ouvre, sélectionnez le fichier image.

Cela peut également être effectué par programme en appelant la méthode LoadFromFile de la propriété Picture :

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

où name_pic.jpeg est le nom du fichier.

Tableau 8 - Propriétés de base du composant Image

Propriété

Description

Image affichée dans le champ du composant

Dimensions des composants. Si ces dimensions sont inférieures à la taille de l'illustration et que les propriétés Stretch, AutoSize et Proportional sont définies sur False, alors une partie de l'image est affichée.

Vous permet de redimensionner automatiquement les images sans distorsion. Pour effectuer une mise à l'échelle, la propriété AutoSize doit être définie sur False

Vous permet de redimensionner automatiquement (réduire ou étirer) une image pour l'adapter à la taille du composant Image. Si la taille du composant n'est pas proportionnelle à la taille de l'image, alors l'image sera déformée

Vous permet de redimensionner automatiquement un composant pour l'adapter à la taille de l'image

Permet de déterminer la position horizontale de l'image dans le champ du composant Image si la largeur de l'image est inférieure à la largeur du composant.

Surface pour afficher des graphiques

Spécifie une couleur d'arrière-plan d'image transparente

Exemple 1 : écrivez un programme pour afficher des images à l'aide du composant Image. Le programme doit avoir les capacités suivantes :

  • · afficher les images dans le dossier ;
  • · visualiser l'image en taille réelle ou dans le format le plus adapté à la taille de la fenêtre ;
  • · gérer les fichiers image, ainsi qu'imprimer, enregistrer, supprimer et modifier des images ;
  • · si nécessaire, ouvrez l'image dans un programme d'édition ;

Figure 10 - Fenêtre du programme avant son démarrage

Création d'un projet :

  • 1. Créez un dossier pour les fichiers du programme et lancez l'environnement de développement intégré Delphi.
  • 2. Ajoutez des composants au formulaire :

Tout d’abord, nous placerons le composant Image sur le formulaire, composant principal avec lequel nous devrons travailler. En plus de cela, nous aurons besoin des composants suivants :

  • · ScrollBox C'est nécessaire quand en mode pleine grandeur l'image dépassera l'image. On attribue la valeur alClient à sa propriété Aling pour que ses dimensions changent proportionnellement à la taille de la fenêtre. Et placez le composant Image dessus ;
  • · Nous ajouterons également les composants de dialogue SavePictureDialog et OpenPictureDialog, conçus pour enregistrer et ouvrir des images. Nous avons besoin du premier pour copier l'image dans le répertoire sélectionné, du second pour appeler la boîte de dialogue d'ouverture fichier graphique. Ils se trouvent sur la page Boîtes de dialogue de la palette de composants. À partir de cette page, nous avons également besoin du composant PrintDialog, que nous devons appeler la boîte de dialogue de sélection d'une imprimante à imprimer.
  • · Ajoutez MainMenu pour ajouter un menu principal au programme et XPManifest pour un design plus coloré
  • · Nous devons également stocker les noms des images situées quelque part dans le répertoire de travail. Le composant ListBox est pratique à ces fins ; il peut être masqué lors du traitement de l'événement Create de Form1.
  • · Pour placer des boutons de navigation et travailler facilement avec eux, nous ajouterons un panneau Voile sur lequel nous placerons ces boutons (Image précédente, Image suivante, Taille réelle, Ajuster à la taille, Supprimer, Copier vers, Imprimer, Modifier). SpeedButton est sélectionné comme composant pour eux.
  • · Ajoutez une minuterie pour capturer les frappes « Gauche » (image précédente), « Droite » (image suivante) et la touche « Suppr » (suppression de l'image).
  • · Et un autre composant - ProgressBar, qui affiche le processus de chargement de gros fichiers *.Jpg.
  • 3. Écrivez le code pour traiter l'événement de clic sur le bouton (Image précédente, Image suivante, Taille réelle, Ajuster à la taille, Supprimer, Copier vers, Imprimer, Modifier). Écrivez du code pour traiter l'événement de clic sur les éléments du menu MainMenu (Quitter, Ouvrir, Fermer, Créer).
  • 4. Définissez les paramètres initiaux de création du formulaire. Double-cliquez sur espace libre form et écrivez le code de procédure procédure TForm1.FormCreate(Sender:TObject), voir le code du module en annexe 1.
  • 5. Écrivez des procédures du type suivant :

procédure FindFileInFolder(chemin, ext : chaîne);

Cette procédure analyse le dossier de chemin pour les fichiers à l'aide du masque ext.

La liste complète du code du module de programme se trouve à l'annexe 1 (liste de programmes 3).

  • 1. Répertoriez les fonctionnalités du composant Image.
  • 2. De quelle classe le composant Image est-il un objet ?
  • 3. 3. Quel type de fichier le composant Image prend-il en charge par défaut ?
  • 4. 4. Répertoriez les principales propriétés du composant Image.
  • 5. 5. Quelle propriété stocke l'image du composant Image ?

Description de la présentation par diapositives individuelles :

1 diapositive

Description de la diapositive :

2 diapositives

Description de la diapositive :

Support visuel Programmation Delphi, comme Windows, prend en charge Interface graphique utilisateur (GDI – Interface graphique Delphi). Dans Delphi, il existe deux manières d'afficher des informations graphiques : afficher des images pré-préparées ; dessin du programme.

3 diapositives

Description de la diapositive :

La première méthode est basée sur l’utilisation des composants Image et Shape. Vous pouvez utiliser une image prête à l'emploi (icône) ou la créer vous-même à l'aide de l'éditeur d'images. La deuxième façon consiste à générer des images par programme à l'aide de l'objet Canvas.

4 diapositives

Description de la diapositive :

Delphi a à sa disposition objet spécial, qui est stylisée comme une propriété Canvas. Il n'est disponible que lorsque l'application est en cours d'exécution, il ne peut donc être contrôlé depuis le programme qu'en écrivant code requis en langage Pascal Objet. Si un objet possède la propriété Canvas, vous pouvez dessiner sur sa surface. Les candidats les plus appropriés pour ce rôle sont le formulaire lui-même et le composant spécial PaintBox.

5 diapositives

Description de la diapositive :

Propriétés de l'objet Canvas : Stylo – propriété permettant de tracer des lignes et des bordures de formes géométriques. Le stylet suit les commandes du curseur graphique et, à son tour, possède ses propres propriétés imbriquées : Couleur – détermine la couleur de la ligne (noir par défaut) ; Mode – style de dessin (a de nombreuses significations qui ne sont pas données ici) ; Style – style de ligne, qui peut prendre les valeurs suivantes : рsSolid – solide (par défaut) ; рsDosh – en pointillés ; psDot – en pointillés ; рsDoshDot – ligne pointillée (et autres propriétés) ; Largeur – épaisseur de ligne (par défaut 1 pixel) ;

6 diapositives

Description de la diapositive :

Pinceau – une propriété permettant de remplir des formes avec les propriétés imbriquées suivantes : Couleur – couleur du pinceau (blanc par défaut) ; Style – motif de pinceau, qui peut prendre les valeurs suivantes : bsClear – coloration unie ; bsHorizontal – lignes horizontales ; bsVertical – lignes verticales ; bsFDiagonal – lignes diagonales gauches ; bsBDiagonal – lignes diagonales droites ; bsCross – cellule ; bsDiagCross – cellule oblique ;

7 diapositives

Description de la diapositive :

Police – une propriété permettant d'afficher du texte qui possède les propriétés imbriquées suivantes : Couleur – couleur des caractères ; Hauteur – hauteur de la police en pixels ; Nom – nom de la police ; Taille – taille de la police ; Style – style de police, qui peut prendre les valeurs suivantes : fsBold – gras ; fsItalic – italique ; fsUnderline – souligné ; fsStrikeOut – barré ;

8 diapositives

Description de la diapositive :

PenPos (Pen Position) – une propriété permettant de stocker la position actuelle du dessin (définit la position du stylo dans la zone de dessin dans ce moment temps); Pixels – une propriété de tableau pour écrire et lire les coordonnées des points individuels de la zone de dessin (« toile »).

Diapositive 9

Description de la diapositive :

Méthodes de l'objet Canvas MoveTo(x,y: integer) – déplace le stylo de la position actuelle vers un point avec les coordonnées x, y spécifiées sans tracer de ligne ; LineTo(x.y: integer) - déplace le stylo de la position actuelle vers un point avec les coordonnées données x, y, en traçant une ligne ; Arc(x1, y1, x2, y2, x3, y3, x4, y4 : entier) – dessine l'arc d'une ellipse inscrit dans un rectangle de coordonnées (x1, y1) et (x2, y2). L'arc est déterminé par les rayons de l'ellipse passant par les points (x3,y3) et (x4,y4) ;

10 diapositives

Description de la diapositive :

Chord(x1, y1, x2, y2, x3, y3, x4, y4 : integer) – dessine une corde d'une ellipse selon la description donnée pour la méthode Arc ; Ellipse(x1, y1, x2, y2 : entier) – dessine une ellipse inscrite dans un rectangle avec le coin supérieur gauche au point (x1, y1) et le coin inférieur droit au point (x2, y2) ; FillRect(Rect (x1, y1, x2, y2: integer)) – remplit le rectangle avec la couleur spécifiée dans le pinceau actuel. Utilise la fonction Rect, qui représente un rectangle aux coordonnées données ;

11 diapositive

Description de la diapositive :

FloodFill(x,y: integer; Color: TColor; FillStyle: TFillStyle) – remplissage avec la couleur actuelle spécifiée dans la propriété Brush : avec FillStyle=fsBorder – une zone fermée depuis le point de coordonnées x, y jusqu'à la bordure définie par le Couleur; avec FillStyle=fsSurface – la partie de la surface qui a la couleur Color ; Pie(x1, y1, x2, y2, x3, y3, x4, y4 : integer) – dessine un secteur d'ellipse inscrit dans un rectangle de coordonnées (x1, y1) et (x2, y2). Le secteur est défini par deux rayons d'ellipse passant par les points (x3, y3) et (x4, y4) ;

12 diapositives

Description de la diapositive :

Polyligne (Points : tableau de TPoint) – dessine une polyligne, reliant séquentiellement les points du tableau Points ; Polygone (Points : tableau de TPoint) – dessine des polygones en connectant séquentiellement des points dans le tableau Points. Elle diffère de la méthode Polyligne en ce qu'elle connecte automatiquement la fin de la polyligne à son début ; Rectangle (x1, y1, x2, y2 : entier) – dessine un rectangle avec le coin supérieur gauche au point (x1, y1) et le coin inférieur droit au point (x2, y2) ;

Diapositive 13

Description de la diapositive :

Retresh – la méthode est appelée lorsqu'il est nécessaire de redessiner l'image ; RoundRect (x1, y1, x2, y2, x3, y3 : entier) – dessine un rectangle aux coins arrondis. Les coins sont dessinés comme des quarts d’ellipse d’une largeur de x3 et d’une hauteur de y3 ; TextOut (x, y:integer, Text:String) – affiche le texte spécifié dans le paramètre Text. Le texte s'inscrit dans un rectangle dont le coin supérieur gauche a les coordonnées x, y.




Haut