Discussion :

[Dine_Med]

Bnojour,

J'aimerai savoir comment faire des Boutons avec une couleur dégradé , comme les boutons sur l'image si dessous.

Merci d'avance.

[herch]

salut,

voici un exemple d'un bouton en dégradé... je ne sais pas si c'est la meilleur façon de faire, mais je te le mets quand même, et plus important, ça marche

class GradientButton

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
 
import javax.swing.JButton;
import javax.swing.AbstractButton;
import javax.swing.Timer;
import javax.swing.plaf.basic.BasicButtonUI;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.GradientPaint;
import java.awt.AlphaComposite;
import java.awt.RenderingHints;
import java.awt.Paint;
import java.awt.Color;
import java.awt.image.BufferedImage;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
 
public class GradientButton extends JButton
{
	private Color startClr = null, endClr = null, borderClr = null; 
	private BufferedImage imgButton = null;
 
	public GradientButton(String text)
	{
		this(text, Color.WHITE, new Color(190, 190, 190), Color.DARK_GRAY);
	}
	public GradientButton(String text, Color startClr, Color endClr, Color borderClr)
	{
		super(text);
		setContentAreaFilled(false);
		this.startClr = startClr;
		this.endClr = endClr;
		this.borderClr = borderClr;
		BasicButtonUI ui = new BasicButtonUI(){
			protected void paintButtonPressed(Graphics g, AbstractButton b)
			{
				Graphics2D g2 = (Graphics2D)g;
				GradientPaint grad = new GradientPaint(0, 0, new Color(190, 190, 190), 0, b.getHeight(), 
						Color.WHITE);
				g2.setPaint(grad);
				g2.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.7f));
				g2.fillRect(0, 0, b.getWidth(), b.getHeight());
			}
		};
		setUI(ui);
	}
	public void setStartColor(Color clr)
	{
		startClr = clr;
	}
	public void setEndColor(Color clr)
	{
		endClr = clr;
	}
	public void paintBorder(Graphics g)
	{
		Graphics2D g2 = (Graphics2D)g;
		g2.setColor(borderClr);
		g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
		g2.drawRoundRect(0, 0, getWidth()-1, getHeight()-1, 10, 10);
	}
	public void paintComponent(Graphics g)
	{
		Graphics2D g2 = (Graphics2D)g;
		if (imgButton == null)
		{
			imgButton = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_ARGB);
			Graphics2D g2Img = imgButton.createGraphics();
			g2Img.setClip(g2.getClip());
			GradientPaint grad = new GradientPaint(0, 0, startClr, 0, getHeight(), endClr);
			g2Img.setPaint(grad);
			g2Img.fillRoundRect(0, 0, getWidth(), getHeight(), 10, 10);
		}		
		g2.drawImage(imgButton, 0, 0, imgButton.getWidth(), imgButton.getHeight(), null);
		super.paintComponent(g2);
	}
}

class pour tester

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
import javax.swing.*;
import java.awt.*;
 
public class TestGradientButton
{
	public static void main(String[] args)
	{		
		JFrame frm = new JFrame();
		Box bx = Box.createVerticalBox();
		GradientButton btn1 = new GradientButton("GradientButton1");
		GradientButton btn2 = new GradientButton("GradientButton2", Color.WHITE, Color.RED, Color.BLACK);
		GradientButton btn3 = new GradientButton("GradientButton3", Color.WHITE, Color.BLUE, Color.GREEN);
		//btn.setBounds(35, 50, 120, 30);
		bx.add(btn1);
		bx.add(Box.createVerticalStrut(10));
		bx.add(btn2);
		bx.add(Box.createVerticalStrut(10));
		bx.add(btn3);
		frm.add(bx);
		frm.setSize(200, 200);
		frm.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
		frm.setVisible(true);
	}
}

tu remarqueras peut être des lignes de code inutiles (des import par exp), j'ai nettoyé un peu, mais j'ai pas beaucoup de temps, alors...

[bouye]

Trois petites remarques :

- plutot que de coder en dur le gradient, il peut etre interressant de mettre un ComponentListener sur le bouton et de recalculer les limites du gradient en fonction des nouvelles dimensions du bouton quand on recoit un componentResized.

- A tester mais il n'est peut-etre pas necessaire de creer une image intermediaire. Mais bon si ca se trouve ca aide un peu au niveau performances.
Dans ce cas preferrer une BufferedImage compatible (getGraphicsConfiguration().createCompatibleImage(...)) plutot qu'une creee au vol.

- pour arriver a faire la meme chose sans se casser la tete : recupere SwingX et utiliser un JXButton avec un backgroundPainter approprie.

[Dine_Med]

Bonjour,

ça marche ,Je vous remercie beaucoup c'est très gentil.