3.- CONSTRUCCIÓN DE INTERFAZ

3.1.- Objetivo

3.1.1.- Diseño - Propuestas

 

• La primera propuesta 

 

1er Interfaz

Botones (JButton)

Estas son de color verde oscuro, 4 serán botones de opciones , y 26 seran botones de las letras del abecedario.
Texto (JLabel)

Estas están de rosado oscuro el que esta en el lado superior del centro será ocupado por el titulo, el del medio (rosado claro) sera una etiqueta de imagen, del lado inferior central estará la palabra oculta  . 

                             

• La Segunda propuesta 

Después de una reunión entre mi grupo, se fue tirando "ideas sobre la mesa", y el resultado borrador fue el siguiente:

A partir de esta propuesta se planteo bien las ideas, implementando el diseño de Layout para ordenar cada espacio necesitado para nuestra interfaz y el resultado fue el siguiente : 

 

3.2.- Desarrollo

En este punto, después de haber aprendido sobre el Layout   y sus distintos clases de implementación e logrado avanzar significativamente la construcción de mi interfaz gráfica.

          

3.2.1.-Construcción de botones (JButton)

 En este punto logré encontrar 2 formas para generar los 26 botones que representan al abecedario:

• Normal

      

    public JButton Q,W,E,R,T,Y,U,I,O,P,A,S,D,F,G,H,J,K,L,Ñ,Z,X

            ,C,V,B,N,M;

        JPanel p1= new JPanel(); 

        p1.setLayout(new FlowLayout()); 

        A = new JButton("A");

        B = new JButton("B");

        C = new JButton("C");

        D = new JButton("D");

        E = new JButton("E");

        F = new JButton("F");

        G = new JButton("G");

        H = new JButton("H");

        I = new JButton("I");

        J = new JButton("J");

        K = new JButton("K");

        L = new JButton("L");

        M = new JButton("M");

        N = new JButton("N");

        Ñ = new JButton("Ñ");

        O = new JButton("O");

        P = new JButton("P");

        Q = new JButton("Q");

        R = new JButton("R");

        S = new JButton("S");

        T = new JButton("T");

        U = new JButton("U");

        V = new JButton("V");

        W = new JButton("W");

        X = new JButton("X");

        Y = new JButton("Y");

        Z = new JButton("Z");

        p1.add(A);

        p1.add(B);

        p1.add(C);

        p1.add(D);

        p1.add(E);

        p1.add(F);

        p1.add(G);

        p1.add(H);

        

        JPanel p2= new JPanel();

        p2.setLayout(new FlowLayout()); 

        p2.add(I);

        p2.add(J);

        p2.add(K);

        p2.add(L);

        p2.add(M);

        p2.add(N);

        p2.add(Ñ);

        p2.add(O);

        

        JPanel p3= new JPanel();

        p3.setLayout(new FlowLayout()); 

        p3.add(P);        

        p3.add(Q);                

        p3.add(R);

        p3.add(S);

        p3.add(T);

        p3.add(U);

        p3.add(V);

        p3.add(W);

        

        JPanel p4= new JPanel();

        p4.setLayout(new FlowLayout()); 

        p4.add(X);

        p4.add(Y);

        p4.add(Z);

        JPanel pSUR = new JPanel();              

        pSUR.setLayout(new BoxLayout(pSUR, BoxLayout.Y_AXIS));           

        pSUR.add(p1); 

        pSUR.add(p2); 

        pSUR.add(p3); 

        pSUR.add(p4); 

        Container cp = getContentPane(); 

        cp.add(pSUR,BorderLayout.SOUTH);

• Bucle For 

Para esta demostración tuve que importar todo el código ya que es necesaria para entender como funciona, el código resaltado es el primordial para esta objetivo; la cual es generar los 26 botones. 

        package Vistas;

import java.awt.event.*;

import java.awt.*;

import javax.swing.*;

public class menu extends JFrame {

    

    

    public menu(){

        

        

        //setLayout(new BorderLayout(20,10));

        JPanel panel1=new JPanel();

        panel1.setLayout(new BorderLayout(100,20) );

        JButton respuesta= new JButton("0");

        respuesta.setEnabled(false);

        

        

        panel2=new JPanel();  

        panel2.setPreferredSize(new Dimension(30,100));

        panel2.setLayout(new GridLayout(3,3,05,05));

     

            String letra;

            char[] s;

            s=new char[26];

            for ( int j=0; j<26; j++) {

                s[j] = (char) ('A' + j );

                letra = String.valueOf(s[j]);

                crearBoton(letra);   

            }

        

        

        panel1.add(respuesta,BorderLayout.NORTH);

        add(panel1, BorderLayout.CENTER);

        add(panel2,BorderLayout.SOUTH);

        //-----------------------------------

        JPanel panel5=new JPanel();

        panel5.setLayout(new BorderLayout(200,0) ); 

        panel5.add(new JLabel(" hola"),BorderLayout.EAST);

        JPanel panel3=new JPanel();

        panel3.setLayout(new BorderLayout(200,0) );

        panel3.add(new JLabel(" adios "),BorderLayout.WEST);

        add(panel5,BorderLayout.EAST);

        add(panel3,BorderLayout.WEST);

        //-----------------------------------

        

        

        

        

    }

 

    private void crearBoton(String boton){

        JButton botones = new JButton(boton);

        botones.setMaximumSize(new Dimension(4,4));

        botones.setMinimumSize(new Dimension(4,4));

        botones.setPreferredSize(new Dimension(4,4));

        panel2.add(botones);

        

                

    }

    private JPanel panel2;

    

    

}

3.3.- Resultados

3.3.1.- Resultado Botones Abecedario

En la imagen solo se resaltan los botones lo demás fue omitido.

• Normal

• Bucle For

3.4.- Referencias 

https://docs.oracle.com/javase/7/docs/api/java/awt/LayoutManager.html