Dans cette fiche...

Description de l'applet

Difficulté : Résultat
Dans certains cas, il peut être intéressant de faire interagir Java et Javascript (voyez par exemple le plan de ce site, ou l'applet Aquarium).

Les boutons Rouge et Vert ne fonctionneront pas tout à fait comme prévu. Lisez la suite pour en connaître la raison.
Votre navigateur n'est pas compatible Java !

 

Listing de l'applet

// --------------------------------------------
// JSCOULEURS : INTERACTION JAVASCRIPT/JAVA
// --------------------------------------------
import java.applet.*;
import java.awt.*;
public class JSCouleurs extends Applet
{
	public String couleur;
	// Initialisation de l'applet
	public void init()
	{
		// Couleur de fond : noir
		setBackground(Color.black);
		// Couleur de départ
		couleur = "blanc";
	}
	// Dessin de l'applet
	public void paint(Graphics g)
	{
		int i;
		// Couleur par défaut (blanc)
		g.setColor(Color.white);
		// Autres couleurs (si la variable couleur a été modifiée)
		if (couleur.equalsIgnoreCase("jaune")) g.setColor(Color.yellow);
		if (couleur.equalsIgnoreCase("rouge")) g.setColor(Color.red);
		if (couleur.equalsIgnoreCase("vert"))  g.setColor(Color.green);
		// Ecrire le texte
		g.drawString("Les couleurs de ce texte peuvent être", 10, 30);
		g.drawString("modifiées via JavaScript.", 10, 45);
	}
}

Télécharger le listingTélécharger le listing

 

Le listing en détail...

Les lignes non commentées ont déjà été traitées dans les exemples précédents.

public String couleur;
On déclare un objet de type String. Une chose importante : l'objet est déclaré en public, ce qui autorisera Javascript à le lire et à le modifier.
 
if (couleur.equalsIgnoreCase("jaune")) g.setColor(Color.yellow);
if (couleur.equalsIgnoreCase("rouge")) g.setColor(Color.red);
if (couleur.equalsIgnoreCase("vert"))  g.setColor(Color.green);
Dans la méthode paint(), on change la couleur de texte en fonction de la valeur de l'objet déclaré plus haut.
De cette manière, si la couleur est modifiée par Javascript, elle sera aussi modifiée par paint().

Beau discours, mais ça ne marche pas !
C'est vrai : Javascript modifie correctement l'objet couleur, mais rien ne force Java à redessiner l'applet, donc à appeler la méthode paint().

Vous noterez que les 2 derniers boutons fonctionnent, eux. Leur code comporte un appel à la méthode repaint() de l'applet, qui elle-même lance paint(). Reportez-vous au bas de cette page pour le code de chaque bouton.

Pour tester les boutons Rouge et Vert malgré tout : appuyez sur l'un des boutons, puis réduisez la fenêtre de votre navigateur, et enfin réagrandissez-la. En faisant tout cela, vous forcez manuellement l'applet à se redessiner, et le changement de couleur fonctionne !

En résumé : pour faire interagir Javascript avec Java, on passera plutôt par un appel de fonction, que par une modification directe de variable.

 

Intégration de l'applet dans la page

Voici le code qui a été utilisé dans cette page HTML pour faire apparaître l'applet :

<applet name="Couleurs" code="JSCouleurs.class" width=250 height=90>
Votre navigateur n'est pas compatible Java !
</applet>

Notez le name="Couleurs" qui permet de nommer l'applet au niveau de la page HTML. Celle-ci sera ainsi reconnue par Javascript.

Pour plus de précisions sur l'intégration d'une applet, cliquez ici.

 

Mise en place du formulaire

Voici le code utilisé pour créer les boutons Javascript, qui modifient l'objet couleur, de l'applet nommée elle-même Couleurs.

<form>
	<input type="button" name="BoutonRouge" value="Rouge"
		onclick="document.Couleurs.couleur='rouge';">
	<input type="button" name="BoutonVert" value="Vert" 
		onclick="document.Couleurs.couleur='vert';">
	<input type="button" name="BoutonJaune" value="Jaune" 
		onclick="document.Couleurs.couleur='jaune'; document.Couleurs.repaint();">
	<input type="button" name="BoutonBlanc" value="Blanc"
		onclick="document.Couleurs.couleur='blanc'; document.Couleurs.repaint();">
</form>

Notez le code du dernier bouton : en plus de changer la couleur, il appelle la méthode repaint() de l'applet, donc indirectement la méthode paint().

 

Hit-Parade