~ / TIS3 / AL / tps / player-layout /

Gestion de la géométrie avec Java/Swing

© 2010—2023 - Renaud Blanch

Le but de ce TP est de mettre en pratique vos connaissances sur les gestionnaires de géométrie. Vous allez réaliser une maquette de lecteur multi-média (i.e., vous ne réaliserez que l'interface utilisateur et non le noyau fonctionnel).

Lecteur

Les images ci-dessous vous fournissent un exemple de l'interface de commande d'un lecteur multimédia (celle de VLC sous Mac OS X) pour deux tailles de fenêtre.

On ne fournit pas de code de départ. Voilà quelques lignes pour vous aider à démarrer :

import javax.swing.SwingUtilities;

class VLC implements Runnable {
	public void run() { 
		// main window
		JFrame vlc = new JFrame("VLC");
		vlc.setDefaultCloseOperation(EXIT_ON_CLOSE);
		vlc.setPreferredSize(new Dimension(800, 100));
		
		// votre code
		
		vlc.pack();
		vlc.setVisible(true);
	}
	
	public static void main(String[] args) {
		SwingUtilities.invokeLater(new VLC());
	}
}

Dans la mesure de ce que permet le jeu de composant interactifs de SWING (JButton, JSlider, etc.), reproduisez cette interface sans vous soucier de l'aspect graphique en utilisant les gestionnaires de géométrie simples (BorderLayout, FlowLayout, et BoxLayout, pour ce dernier, voir How to Use BoxLayout) et la hiérarchie des conteneurs.

Pour la bordure autour des composants qui gèrent le temps, on pourra utiliser une Border et la fabrique associée : BorderFactory. Leur utilisation est expliquée dans le tutoriel How to Use Borders. Votre réalisation pourra ressembler à l'image ci-dessous (notez que l'aspect exact importe peu, ce qui compte c'est le comportement lors du redimensionnement de la fenêtre).

Vérifiez que tous les composants sont présents, que les boutons de gauche restent stables et collés à gauche quand on redimensionne la fenetre. Vérifiez que dans la partie basse le slider du volume reste collé à gauche, et les 2 boutons à droite. Vérifiez en haut que le slider s'allonge, que les 2 labels sont au dessus et restent collés de chaque côté.

Quand l'utilisateur essaie de la redimensionner, l'interface garde sa hauteur (100 pixels), mais sa largeur varie effectivement tout en conservant une largeur minimum (e.g. 700 pixels). Modifiez votre réalisation pour qu'elle se comporte de cette manière quand elle est redimensionnée (ComponentListener).

Liste de lecture

Lorsqu'on appuie sur le bouton situé en bas à droite de l'interface (qui devient alors bleu), un panneau supplémentaire comportant la liste de lecture apparaît comme illustré ci-dessous. Lorsque l'on reclique sur ce bouton, la liste de lecture disparaît, et la fenêtre retrouve sa taille initiale. Réalisez ce comportement. Pour la liste de lecture, utilisez une JTable (voir le tutorial sur l'utilisation des JTable).

Pour le bouton, utilisez un JToggleButton qui change de couleur seul et qui a une méthode isSelected pour savoir s'il est sélectionné ou non.

Faites en sorte que lorsque la liste de lecture apparaît, on puisse la faire disparaître si on redimensionne la fenêtre en passant sous un certain seuil pour sa hauteur (par exemple 200 pixels).

mise à jour : 28 mars 2023