mise en page en utilisant la grille Javascript pour une calculatrice

Question

Quelqu'un peut-il me dire la meilleure façon d'utiliser la mise en page Grille pour régler les boutons de ma calculatrice

Answer 1

C'est presque trop générale répondre à une question, vous ne même pas clairement De quel langage de programmation parlez-vous (JavaScript? Java? X.net?). Permettez-moi de vous donner un exemple utilisant Java. L'idée de base serait que vous créiez un javax.swing.JButton (en supposant que vous utilisiez Swing) pour chaque bouton, alors vous pensez à la disposition que vous souhaitez obtenir (évidemment une grille), et ajoutez les boutons à le composant parent. Par exemple, pour mimer la mise en page du calculateur de GNOME:

import java.awt.*; 
import javax.swing.*; 

/** 
* +----+----+----+----+ 
* |Bksp| CE | Clr| +- | 
* +----+----+----+----+ 
* | 7 | 8 | 9 |/| 
* +----+----+----+----+ 
* | 4 | 5 | 6 | * | 
* +----+----+----+----+ 
* | 1 | 2 | 3 | - | 
* +----+----+----+----+ 
* | 0 | . | = | + | 
* +----+----+----+----+ 
*/ 
public class Calculator extends JPanel { 
    public Calculator() { 
     JButton bksp  = new JButton("Bksp"); 
     JButton ce  = new JButton("CE"); 
     JButton clr  = new JButton("Clr"); 
     JButton plusminus = new JButton("+-"); 
     JButton div  = new JButton("/"); 
     JButton mult  = new JButton("*"); 
     JButton minus  = new JButton("-"); 
     JButton plus  = new JButton("+"); 
     JButton equals = new JButton("="); 
     JButton dot  = new JButton("."); 
     JButton[] digits = new JButton[10]; 
     for (int i = 0; i < digits.length; i++) { 
      digits[i] = new JButton(String.valueOf(i)); 
     } 

     /* do the layout */ 
     setLayout(new GridLayout(5, 4, 5, 5)); 
     add(bksp); 
     add(ce); 
     add(clr); 
     add(plusminus); 
     add(digits[7]); 
     add(digits[8]); 
     add(digits[9]); 
     add(div); 
     add(digits[4]); 
     add(digits[5]); 
     add(digits[6]); 
     add(mult); 
     add(digits[1]); 
     add(digits[2]); 
     add(digits[3]); 
     add(minus); 
     add(digits[0]); 
     add(dot); 
     add(equals); 
     add(plus); 
    } 

    public static void main(String[] args) { 
     Calculator calc = new Calculator(); 

     JFrame frame = new JFrame(); 
     frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 
     frame.getContentPane().add(calc); 

     frame.setSize(300, 300); 
     frame.setVisible(true); 
    } 
} 

Avec new GridLayout(5, 4, 5, 5) on souhaite définir une grille de 5x4 (5 lignes, 4 colonnes) et un espacement inter-cellulaire de 5 pixels, à la fois horizontalement et verticalement. Après cela, vous ajoutez simplement les boutons dans le bon ordre (de gauche à droite, de haut en bas).