java - emmanuel.adam.free.fremmanuel.adam.free.fr/site/img/pdf/appgr6java2dp.pdf · e. adam –...
Post on 11-Jan-2019
216 Views
Preview:
TRANSCRIPT
E. ADAM – ISTV - UVHC
JAVA
Applications Graphiques
E. ADAM
UVHC - ISTV
E. ADAM – ISTV - UVHC
Graphique 2D● L'objet Graphics2D de Java Swing permet :
– la transformation affine ● (rotation, basculement, étirement, ...)
– la gestion de couleurs ● (contraste, luminosité, netteté, saturation...)
– La gestion du rendu ● (texture, dégradé de couleurs, ...)
– L'édition de texte améliorée
Applications graphiques en Java
E. ADAM – ISTV - UVHC
Transformations●G2D permet :
– la rotation (rotate), le redimensionnement (scale), le basculement (shear), la translation (translate) de graphiques
– Il est possible de combiner les transformations :
● Utilisation de la classe de Transformation Affine : – AffineTransform
Applications graphiques en Java
E. ADAM – ISTV - UVHC
Transformations●AffineTransform : appliquer une transformation affine sous forme de matrice à chaque point (x, y) d'un graphique :
Applications graphiques en Java
x 'y '=[a c tx
b d ty] . x
y=a.xc.ytx
b.xd.yty
[2 0 0 0 0.5 0
]
Redimensionnement
E. ADAM – ISTV - UVHC
Transformations
Applications graphiques en Java
[1 0 10 0 1 20
]
Translation
0 0
[1 0.5 0 0 1 0
]
Basculement
0 0
10
20
E. ADAM – ISTV - UVHC
Transformations
Applications graphiques en Java
[0 −1 0 1 0 0
]
Rotation PI/2
0 0
[costetha −sintetha 0 sintetha cos tetha 0
]
Rotation Téta
0 0
E. ADAM – ISTV - UVHC
Transformations●Utilisation de TransformAffine :
– Dans la méthode paint ou paintComponent :
public void paintComponent(Graphics g){
super.paintComponent(g);if (!tracker.checkID(0)) return;
Graphics2D g2d = (Graphics2D) g;AffineTransform atOld = g2d.getTransform();AffineTransform atT = new AffineTransform();atT.rotate(Math.PI/6);
g2d.drawImage(imgFixe, atT, this);
}
Applications graphiques en Java
E. ADAM – ISTV - UVHC
Rendu : Qualité●Activer le mode Qualité et anti aliasing
Utilisation de la classe ColorSpaceGraphics2D g2d = (Graphics2D) g;
RenderingHints qualityHints = new RenderingHints(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_ON);
qualityHints.put(RenderingHints.KEY_RENDERING,RenderingHints.VALUE_RENDER_QUALITY);
g2d.setRenderingHints(qualityHints);
E. ADAM – ISTV - UVHC
Rendu : Qualité●Activer le mode Qualité et anti aliasing
Qualité par défaut Qualité activée
E. ADAM – ISTV - UVHC
Rendu : Transparence●Activer la composante Alpha (transparence)
Utilisation de la classe AlphaComposite12 possibilités de mélange de couleurs : CLEAR, SRC, DST, SRC_OVER, DST_OVER, SRC_IN, DST_IN, SRC_OUT, DST_OUT, SRC_ATOP, DST_ATOP, or XOR
Gestion de transparence : ...// dessin en mode pleing2d.drawImage(img1, 0, 0, 480, 360, this);
// definition d'une transparence à 50% pour les prochains dessinsAlphaComposite ac =
AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.5f);g2d.setComposite(ac);g2d.drawImage(img2, 30, 30, 100, 100, this);...
E. ADAM – ISTV - UVHC
Rendu : Qualité●Activer le mode transparence à 50%
E. ADAM – ISTV - UVHC
Rendu d'images●Création d'un image N&B à partir d'une image couleur●Utilisation de tampons d'images : BufferedImage
– BufferedImage imgCouleur = new BufferedImage(largeur, hauteur, BufferedImage.TYPE_INT_RGB);– BufferedImage imgNB = new BufferedImage(largeur, hauteur, BufferedImage.TYPE_INT_RGB);
●Utilisation de la classe RenderingHints● Interpolation Alpha : défaut, rapide ou qualité● Antialiasing : défaut, activé, non activé● Rendu des couleurs : défaut, rapide ou qualité● Tramage : défaut, activé, non activé● Métriques partielles : défaut, activé, non activé● Interpolation : plus proche voisin, bi-linéaire, bi-cubique● Rendu : défaut, rapide ou qualité● Antialiasing du texte : défaut, activé, non activé
– Utilisation sous forme de table de hashage (cf doc)– Graphics2D srcG = imgCouleur.createGraphics();– RenderingHints rhs = g2d.getRenderingHints();– srcG.drawImage(img, 0, 0, this);
E. ADAM – ISTV - UVHC
Rendu d'images : N & B●Création d'un image N&B à partir d'une image couleur
●Utilisation de la classe ColorSpace– Niveau de gris; 2, 3, .... couleurs; Mode HVS ; CMY;...
– ColorSpace cs = ColorSpace.getInstance(ColorSpace.CS_GRAY);
●Utilisation de la classe ColorConvertOp– Réalise une conversion pixel à pixel de l'image initiale
– ColorConvertOp theOp = new ColorConvertOp(cs, rhs);
– theOp.filter(imgCouleur, imgNB);
E. ADAM – ISTV - UVHC
Rendu d'images : N & B
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Package java.awt.image
●2 interfaces pour agir sur BufferedImage et Raster (rectangle de pixels) : – BufferedImageOp and RasterOp.
● Classes implementant ces interfaces : AffineTransformOp, BandCombineOp, ColorConvertOp, ConvolveOp, LookupOp, RescaleOp.
– Ces classes sont utilisées pour les tranformations géométriques, l'adoucissement, le renforcement, le constraste, la saturation, et la coloration d'images
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Package java.awt.image
●La classe Kernel permet la définition de filtre : ●Un filtre est une transformation mathématique (appelée produit de convolution) modifiant la valeur de chaque pixel en fonction de sa valeur et de celle de ses voisins à partir d'une matrice (matrice de convolution)
Matrice=p i−1, j−1 p i , j−1 pi1, j−1
pi−1, j pi , j p i1, j
p i−1, j1 p i , j1 pi1, j1
coulp x , y=∑j=−1
1
∑i=−1
1
p i , j×coulpxi , y j
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exemple : Détection de bords
La matrice pour la détection de bord est : float[] elements = { 0.0f, -1.0f, 0.0f,
-1.0f, 4.f, -1.0f, 0.0f, -1.0f, 0.0f};
BufferedImage imgFiltree = newBufferedImage(largeur,hauteur,BufferedImage.TYPE_INT_RGB);
// définition de la matrice 3 x 3Kernel kernel = new Kernel(3, 3, elements);
ConvolveOp cop = new ConvolveOp(kernel, ConvolveOp.EDGE_NO_OP, null);
cop.filter(imageSource,imageFiltree);
g2d.drawImage(imageFiltree, 0, 0, largeur, hauteur, this);
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exemple : Détection de bords
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exemple : Inversion de couleurs
●Utilisation de LookupOp qui applique aux 3 couleurs et à la transparence (si elle est définie) des modifications données par des tableaux de type ByteLookupTable
byte reverse[] = new byte[256];for (int j=0; j<256; j++) reverse[j]=(byte)(256-j);
ByteLookupTable blut=new ByteLookupTable(0, reverse);
LookupOp lop = new LookupOp(blut, null);
lop.filter(imgCouleur, imgInverse);
g2d.drawImage(imgInverse, 0, 0, largeur, hauteur, this);
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exemple : Inversion de couleurs
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exemple : Luminosité - Contraste
Utilisation de RescaleOp qui applique aux 3 couleurs et à la transparence (si elle est définie) des modifications données par un coefficient et une constante
for each pixel from Source object { for each band/component of the pixel { destElement = (srcElement*coefficient) + constante }}
RescaleOp rop = new RescaleOp(2f, -10.0f, null);rop.filter(imgCouleur,bimg);
g2d.drawImage(bimg, 0, 0, largeur, hauteur, this);
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exemple : Luminosité - Contraste
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exercice : Flou
Donner selon vous la matrice 3 x 3 permettant de « flouter » une image
Indice, l'objectif est d'uniformiser les couleurs
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exercice : Flou
Une matrice 3 x 3 permettant de « flouter » une image est la matrice : 1/9 1/9 1/91/9 1/9 1/91/9 1/9 1/9
float[] elements = new float[9];Arrays.fill(elements, 1.f/9.f);
Kernel kernel = new Kernel(3, 3, elements);ConvolveOp cop = new ConvolveOp(kernel, ConvolveOp.EDGE_NO_OP, null);cop.filter(imgCouleur,bimg);g2d.drawImage(bimg, 0, 0, largeur, hauteur, this);
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exercice : Flou
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exercice : Plus Net
Donnez une matrice 3 x 3 permettant de rendre plus net une image
Indice, les points doivent se singulariser des voisins
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exercice : Plus Net
Une matrice 3 x 3 permettant de « rendre » une image est la matrice : -1 -1 -1-1 9 -1-1 -1 -1
float[] elements = new float[9];Arrays.fill(elements, -1.f);elements[4] = 9.f;
Kernel kernel = new Kernel(3, 3, elements);ConvolveOp cop = new ConvolveOp(kernel, ConvolveOp.EDGE_NO_OP, null);cop.filter(imgCouleur,bimg);g2d.drawImage(bimg, 0, 0, largeur, hauteur, this);
E. ADAM – ISTV - UVHC
Rendu d'images : filtres●Exercice : Plus Net
E. ADAM – ISTV - UVHC
Gestion de lignes●Attributs du pinceau : Largeur
●Utilisation de BasicStroke : pinceau de base
pinceau de 12 pixel : (dans la méthode paint par exemple)....BasicStroke pinceauLarge = new BasicStroke(12.0f);g2.setStroke(pinceauLarge);g2.drawLine(0, 0, 400, 300);....
E. ADAM – ISTV - UVHC
Gestion de lignes●Attributs du pinceau : jointure
●Définition de l'angle à partir duquel commence la jointure
pinceau à bords et jointures ronds : (dans la méthode paint par exemple)....BasicStroke pinceauRond = new BasicStroke(12.0f,
BasicStroke.CAP_ROUND, BasicStroke.JOIN_ROUND, 10f);g2.setStroke(pinceauRond);g2.drawPolyline( new int[]{0, 10, 20, 30},
new int[]{0, 10, 0, 10},4);
....
Programmer’s Guide to the Java 2D™ APIEnhanced Graphics and Imaging for JavaJavaTM 2 SDK, Standard Edition, 1.4 VersionApril 24, 2001
10°
E. ADAM – ISTV - UVHC
Gestion de lignes●Attributs du pinceau : pointillés
Définition du pointillé par tableau : {10} --> espacement tous les 10 pixels{10, 20} --> espacement de 20 pixels tous les 10 pixels{10, 20, 5, 2} --> trait de 10 pixels, séparation de 20 pixels, trait de 5 pixels, séparation de 2 pixels, ...
(dans la méthode paint par exemple)....BasicStroke pinceauPointille = new BasicStroke(12.0f,
BasicStroke.CAP_ROUND, BasicStroke.JOIN_ROUND, 10f,new float[]{10, 20, 5, 2}, 0f);
g2.setStroke(pinceauPointille);g2.drawLine( 0, 0, 300, 400);.... début des pointillés
E. ADAM – ISTV - UVHC
Gestion de lignes●Attributs du pinceau : pointillés
E. ADAM – ISTV - UVHC
Remplissage de formes●Dégradé linéaire de couleurs
●Utilisation de GradientPaint
●Définition – de la couleur d'origine et de sa position– de la couleur de destination et de sa position– du bouclage
(dans la méthode paint par exemple)....GradientPaint gp = new GradientPaint(0f, 0f, Color.White,
0f, (float)hauteur/2f, Color.RED, true);g2d.setPaint(gp);g2d.fillRect(0, 0, larg2, haut2);....
Cycle activé
O (Blanc)
D (Destination)
cycle
E. ADAM – ISTV - UVHC
Remplissage de formes●Dégradé linéaire de couleurs
E. ADAM – ISTV - UVHC
Remplissage de formes●Dégradé de couleurs
● Point1: Couleur1 (R1, G1, B1) --> Point2: Couleur2 (R2, G2, B2)
● Distance entre les 2 points = d
● « Distances » de couleurs dR = (R2 – R1), dG = (G2 – G1), dB = (B2 – B1)
● Incréments de couleurs pour i allant de P1 à P2 : – incR = dR/d ; incG = dG/d ; incB = dB/d ;
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures dessinées●Utilisation de TexturePaint
●Etapes – Définir une image tampon (BufferedImage)– Dessiner le motif (par son objet Graphics2D)– Définir les dimensions de la texture (Rectangle)– Créer la texture (TexturePaint)
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures dessinées//////////////////////////////////////////////////Dessin de textureint taille = 20;
BufferedImage bi = new BufferedImage(taille, taille, BufferedImage.TYPE_INT_RGB);Graphics2D g2dBi = bi.createGraphics();g2dBi.setColor(Color.MAGENTA);g2dBi.fillRect(0,0,taille,taille);g2dBi.setColor(Color.red);g2dBi.fillOval(0,0,taille,taille);
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures dessinées////////////////////////////////////////////////// textureRectangle r = new Rectangle(0,0,taille,taille);TexturePaint tp = new TexturePaint(bi, r);
//////////////////////////////////////////////////mise en place de la textureg2d.setPaint(tp);
//////////////////////////////////////////////////dessin texturiseg2d.fillRect(0,0,largeur,hauteur);
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures dessinées
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures jpg●Utilisation de TexturePaint
●Etapes – Récupérer l'image source (Image et Toolkit)– Redimensionner l'image (AffineTransform)– Définir une image tampon (BufferedImage)– Dessiner l'image – Définir les dimensions de la texture (Rectangle)– Créer la texture (TexturePaint)
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures jpg...int taille = 100;int largeurImg = img.getWidth(this);int hauteurImg =img.getHeight(this);// recup de la dimension maximaleint maxi=(largeurImg>hauteurImg?largeurImg:hauteurImg);// définition du ratio (largeur/hauteur)double coefLargeur = (double)largeurImg/(double)maxi;double coefHauteur = (double)hauteurImg/(double)maxi;// definition de l'image tampon base sur la taille de la texture et le ratioBufferedImage bi = new BufferedImage((int)(taille*coefLargeur),
(int)(taille*coefHauteur), BufferedImage.TYPE_INT_RGB);
Graphics2D g2dImg = bi.createGraphics();
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures jpg// definition de la reduction de l'imageAffineTransform at = new AffineTransform();double reducX =((double)taille/(double)largeurImg)*coefLargeur; double reducY =((double)taille/(double)hauteurImg)*coefHauteur; at.setToScale(reducX, reducY);g2dImg.setTransform(at);// dessin de l'image dans l'image tampong2dImg.drawImage(img, 0, 0, this);
//////////////////////////////////////////////////Dessin de textureRectangle r = new Rectangle(0,0,taille,taille);TexturePaint tp = new TexturePaint(bi, r);g2d.setPaint(tp);g2d.fillOval(0,0,largeur,hauteur);
E. ADAM – ISTV - UVHC
Remplissage de formes●Application de Textures jpg
E. ADAM – ISTV - UVHC
Zone de dessin : Clipage● Zone de clipping = zone délimitant l'affichage du graphique
● Définition de zone géométriques issues de :– Arc2D, Ellipse2D, Rectangle2D, RoundRectangle2D
●Exemple:● Arc2D : xo, yo, largeur, hauteur, °départ, °arrivée, type
– (xo, yo) = coordonnées haut gauche du rectangle contenant l'arc
– ° depart et ° arrivée : origines le centre du rectangle– type : corde (CHORD), camembert (PIE), ouvert (OPEN)
E. ADAM – ISTV - UVHC
Zone de dessin : Clipage
...// Créer un arc de type corde de 240°Arc2D arc = new Arc2D.Float(0f, 0f, largeur, hauteur, 0f, 240f, Arc2D.CHORD);
// Définir la zone de dessing2d.setClip(arc);
g2d.drawImage(img, 0, 0, largeur, hauteur, this);
// Créer un rectangle Rectangle r = new Rectangle(0, 0, largeur/3, hauteur);// modifier la zone de dessin = intersection de l'ancienne avec le rectangleg2d.clip(arc);
g2d.drawImage(img2, 0, 0, largeur, hauteur, this);
E. ADAM – ISTV - UVHC
Zone de dessin : Clipage
E. ADAM – ISTV - UVHC
Objets graphiques complexes● Utilisation de Shape et de GeneralPath●Un objet Shape = chemin géométrique de : lignes; courbes quadratiques; courbes de Bézier
– + Rectangles, ellipses, ....
// Créer un shape avec courbe de Bezierp = new GeneralPath(GeneralPath.WIND_NON_ZERO);p.moveTo(- 100, 0);p.curveTo(-50, -100, 50, 50, 100, 0);p.lineTo(0, 100);p.closePath();// translater l'origine vers le centre de la position du diagrammeg2d.translate(largeur/2, hauteur/2);//dessiner le diagramme en le remplissantg2d.fill(p);//rétablir l'origineg2d.translate(-largeur/2, -hauteur/2);
x0, y0 x2, y2
x1, y1
Courbe quadratique
E. ADAM – ISTV - UVHC
Objets graphiques complexes
E. ADAM – ISTV - UVHC
Objets graphiques complexes● Utilisation de Area
●Une aire Area = intersection, union, disjonction, différence de Shape :
///////////////union d'une étoile et d'un arcArea aire = new Area(etoile);aire.add(new Area(arc));///////////////mise en place d'un degradeGradientPaint gp = new GradientPaint(0f, 0f, Color.RED, 0f, (float)haut2, Color.BLUE);g2d.setPaint(gp);
///////////////dessin de l'aireg2d.fill(aire);
E. ADAM – ISTV - UVHC
Objets graphiques complexes
Unionaire.add(new Area(arc));
Intersectionaire.intersect(new Area(arc));
Disjonctionaire.exclusiveOr(new Area(arc));
Différenceaire.substract(new Area(arc));
E. ADAM – ISTV - UVHC
Textes● Utilisation de polices dérivées
●Utilisation : – Définir une police de caractère– Définir une transformation affine– Créer une police dérivée– Appliquer cette police
●Exemple : // créer une policeFont police = new Font("Helvetica", Font.BOLD, largeur/6);// définir la transformation (ici rotation de PI/8)AffineTransform atFont = new AffineTransform();atFont.setToRotation(-Math.PI/8);// crée et mettre en place la police dérivéeFont policeDerivee = police.deriveFont(atFont);g2d.setFont(policeDerivee);// dessiner le texteg2d.drawString("J'adore JAVA !!!", larg4, haut2);
E. ADAM – ISTV - UVHC
Textes● Utilisation de polices dérivées
top related