Mise en forme - Galère avec les layouts

Version imprimable

Bonjour,

Étant habitué à trouver les mêmes problèmes que les miens déjà solutionnés sur ce forum, je n'y ai encore jamais posté, mais pour celui-ci, je ne trouve pas la réponse appropriée, je me permets donc de poster un nouveau message.

Je débute avec Java, et bien que j'aie déjà développé sous Android, la différence entre le XML sous android et le système de Layouts sous Java me bloque complètement.
J'essaye donc de faire une fenêtre principale toute bête, avec un bouton, centré de chaque côté, séparés par une image, un titre en dessous, et un logo centré au dessus de tout.
J'avais fait l'erreur de commencer ce projet sous Windev, que j'ai vite abandonné à cause de son langage et de sa stabilité toute relative, mais ça m'a permis d'avoir une idée de ce à quoi je voudrais que ça ressemble : Image

Voici mon code actuel :
Code:

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 import javax.swing.*; import javax.swing.JFrame; import java.awt.*; class Windows extends JFrame { Windows(){ // Propriété fenêtre JFrame jFrame = new JFrame(); jFrame.setTitle("Statistiques"); jFrame.setSize(1280, 720); jFrame.setLocationRelativeTo(null); jFrame.setResizable(false); jFrame.setBackground(Color.WHITE); jFrame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE); jFrame.setVisible(true); // Backgrounds JPanel jBackgroundG = new JPanel(); jBackgroundG.setBackground(Color.WHITE); JPanel jBackgroundD = new JPanel(); jBackgroundD.setBackground(Color.WHITE); // Boutons JButton bAvj = new JButton("AVJ"); bAvj.setBackground(new Color(120, 190, 60)); JButton bSi = new JButton("SI"); bSi.setBackground(new Color(0, 110, 130)); // Mise en forme jFrame.getContentPane().setLayout(new GridLayout(1,2)); jFrame.getContentPane().add(jBackgroundG); jBackgroundG.add(bAvj); jFrame.getContentPane().add(jBackgroundD); jBackgroundD.add(bSi); } }
J'ai beau faire ce que je veux, essayer tous les layouts possibles, je n'arrive déjà pas à centrer ces deux malheureux boutons, alors les séparer par une image, je n'y pense même pas.
Avec un BorderLayout, ils prennent toute la place dans leur layout respectif, avec un GridLayout de 9 lignes et 1 colonne, impossible de placer les boutons sur la ligne 5 pour qu'ils soient centrés...

Y'a surement un déclic que j'ai pas eu avec ces layouts, mais je trouve la mise en page vraiment galère.:arf:

J'espère que ma question ne relèvera pas trop de l'incompétence pure. Un tout grand merci d'avance à ceux qui prendront le temps de m'aider !

1 pièce(s) jointe(s)

Salut,

La plupart des LayoutManager standard de Swing ont des règles générales qui rendent difficiles un layout où tous les composants n'ont pas le même comportement. Je parle non seulement des règles appliquées aux composants qu'on met dans le conteneur, mais également des règles appliquées au conteneur lui même. Les composants eux-même ont leurs propres règles (en particulier les tailles préférentielles, mais aussi l'alignement).

La première solution est de prendre un LayoutManager standard possédant un paramétrage plus souple, au niveau composant :

il y a le SpringLayout, mais je le trouve assez complexe à mettre en œuvre. Son principe est de définir des positions relatives entre composants ou composants et bordure. Pas toujours simple.
Le GridBagLayout propose un système de règles assez complète, tout en étant relativement simple. Déjà il n'a pas la contrainte d'avoir les colonnes, de même largeur et lignes de même hauteur, et, selon les cas, peut ou pas s'étendre dans son conteneur (malheureusement, on n'a pas de contrôle direct, c'est juste une conséquence des règles des cellules dans la grille et des règles des composants. Malheureusement, toutes les contraintes s'appliquent à une cellule uniquement : pas moyen d'indiquer que 2 boutons dans 2 cellules différentes devraient avoir la même largeur. Mais pour ça, on peut s'en sortir avec les règles des composants.

La deuxième solution est de combiner plusieurs layout manager. Les layouts manager de base ont des présentations basiques, en ligne, en colonne, en grille, (avec le borderlayout qui a une présentation du type "dialogue" (un header, un footer, des sidebars, et un espace principal). Mais en combinant plusieurs layouts on arrive souvent à la solution voulue.

La troisième solution est de prendre un layout manager d'une bibliothèque tierce, comme le FormLayout de JGoodies par exemple. Très facilement configurable pour tout ce qui est formulaire, intégrant les règles classiques de ce la problématique (alignement, notion de DLU, etc). Cela fait longtemps que je ne l'ai pas pratiqué, donc je ne pourais pas de garantir qu'on peut faire ce que tu veux faire.

La quatrième solution est d'écrire son propre Layout Manager. Cela demande un peu de travail, mais ce n'est pas très difficile, mais demande de la rigueur pour avoir un fonctionnement optimal et général. Pour un layout vraiment très particulier, c'est une bonne solution. On peut éventuellement gérer qu'une partie du problème, et le combiner avec des layouts standard

Voici une solution par combinaison de plusieurs layout manager :
Code:

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 public class DemoLayout { public static void main(String[] args) throws MalformedURLException { JFrame frame = new JFrame(); // un panneau pour la partie bouton plus image au centre JPanel buttonPanel = new JPanel(new GridBagLayout()); // images pour l'exemple JLabel imageCenter = new JLabel(new ImageIcon(new URL("https://www.developpez.net/forums/image.php?u=327969&dateline=1420855918&type=thumb"))); JLabel imageLogo = new JLabel(new ImageIcon(new URL("https://gabarit.developpez.be/images/logo.png"))); JButton buttonLeft = new JButton("Département AVJ"); buttonLeft.setBorderPainted(false); // suppression bordure bouton buttonLeft.setBackground(new Color(120, 190, 60)); JButton buttonRight = new JButton("Département SI"); buttonRight.setBorderPainted(false); buttonRight.setBackground(buttonLeft.getBackground()); // ici j'impose des contraintes aux boutons, pour qu'ils soient de même largeur buttonLeft.setMinimumSize(new Dimension(Math.max(buttonLeft.getMinimumSize().width,buttonRight.getMinimumSize().width), buttonLeft.getMinimumSize().height)); buttonRight.setMinimumSize(new Dimension(Math.max(buttonLeft.getMinimumSize().width,buttonRight.getMinimumSize().width), buttonRight.getMinimumSize().height)); buttonLeft.setPreferredSize(buttonLeft.getMinimumSize()); buttonRight.setPreferredSize(buttonRight.getMinimumSize()); // une contrainte pour les boutons, pour qu'ils s'étendent dans la hauteur, et dans la largeur, en se partageant équitablement entre eux deux l'espace GridBagConstraints gbcButton = new GridBagConstraints(0,0,1,1,0.5,1,GridBagConstraints.CENTER,GridBagConstraints.VERTICAL,new Insets(0,0,0,0),0,0); // une contriante pour l'image au centre GridBagConstraints gbcImage = new GridBagConstraints(1,0,1,1,0,0,GridBagConstraints.CENTER,GridBagConstraints.NONE,new Insets(0,5,0,5),0,0); // le bouton de gauche buttonPanel.add(buttonLeft, gbcButton); // l'image centrale buttonPanel.add(imageCenter,gbcImage); // le bouton de droite gbcButton.gridx=2; buttonPanel.add(buttonRight, gbcButton); // un panel global JPanel mainPanel = new JPanel(new GridBagLayout()); // je mets le panel avec les boutons dans le panel global mainPanel.add(buttonPanel, new GridBagConstraints(0,0,1,1,0,0,GridBagConstraints.CENTER,GridBagConstraints.NONE,new Insets(5, 0, 5, 0),0,0)); // la partie au sud du panel global, avec un logo et un texte centrés JPanel southPanel = new JPanel(); southPanel.setLayout(new BoxLayout(southPanel, BoxLayout.Y_AXIS)); // le BoxLayout vertical met les composants en colonne imageLogo.setAlignmentX(JLabel.CENTER_ALIGNMENT); // je centre l'image dans le boxlayout southPanel.add(imageLogo); JLabel title = new JLabel("Statistiques"); // le texte title.setAlignmentX(JLabel.CENTER_ALIGNMENT); // je centre le texte southPanel.add(title); // je mets le southPanel dans le panel global mainPanel.add(southPanel, new GridBagConstraints(0,1,1,1,0,0,GridBagConstraints.CENTER,GridBagConstraints.NONE,new Insets(5, 0, 5, 0),0,0)); // je met le panel global au centre de la fenêtre frame.add(mainPanel); frame.setSize(400,400); frame.setLocationRelativeTo(null); frame.setVisible(true); } }
Qui donne :

Pièce jointe 258898

29/03/2017, 17h01
Neufunk

Waow, un tout tout grand merci !

Je vais m'inspirer de tout ça pour continuer mon travail.
J'avais essayé de mettre ensemble plusieurs Layouts Managers, mais j'avais le problème de superposition, qui fait que je n'arrivais pas à tout mettre en place sans que l'un passe au dessus d'un autre. Il semble que le GridBagLayout soit en effet une bonne solution pour pouvoir combiner efficacement plusieurs Layouts. Je n'ai pas encore bien saisi le fonctionnement précis avec les Constraints mais je vais potasser.

Encore une toute petite question pratique relative à Java, je vois ici que tu as codé la page avec la méthode Main. Est-ce une erreur que de créer une classe par fenêtre existante dans un logiciel et d'appeler le tout via la méthode Main de la Main Class ? N'ayant pas encore pris d'habitude, je n'aimerais pas en prendre de mauvaises. :oops:

Encore mille fois merci pour cette aide, et pour ce code diablement bien commenté qui me permettra d'apprendre et de m'en inspirer.
29/03/2017, 17h08
joel.drigo

Citation:

Envoyé par Neufunk

Encore une toute petite question pratique relative à Java, je vois ici que tu as codé la page avec la méthode Main. Est-ce une erreur que de créer une classe par fenêtre existante dans un logiciel et d'appeler le tout via la méthode Main de la Main Class ? N'ayant pas encore pris d'habitude, je n'aimerais pas en prendre de mauvaises. :oops:

C'est juste un exemple que j'ai fait, au plus vite, sans souci de faire de l'architecture, et surtout pour le diffuser le plus simplement, donc en évitant de faire 36 classes (quand je suis obligé, je fais des classes statiques internes, mais c'est pareil, c'est juste pour avoir un snippet unique qui se suffit à lui-même). Inutile de faire des classes juste pour faire des classes, c'est toujours mieux de séparer les comportements qui n'ont pas de rapport entre eux dans des classes séparées, en particulier si ces comportements doivent pouvoir être réutilisés, et faire des unités logiques distinctes.

C'est comme pour les images : j'ai mis des URL http pour que l'exemple fonctionne par copier/coller. Il faut évidemment éviter d'obliger d'avoir une connexion pour pouvoir lancer une application desktop, et charger des ressources, même si on tend à avoir tous la fibre et donc que c'est peu coûteux, c'est tout de même mieux d'avoir les ressources en interne au jar. Et puis un serveur ça peut tomber aussi.