linguagem de programação interface gráfica · 2017. 12. 8. · layoutmanager •posicionamento e...
TRANSCRIPT
Joyce França Professora de Ciência da Computação - IFNMG
Linguagem de Programação
Interface Gráfica
Exemplo
• Fazer a tela
Exemplo
• Como ficou?
• Precisamos organizar os espaços dos componentes da interface gráfica! Layout Manager
LayoutManager
• Posicionamento e tamanho dos componentes Java Swing são controlados por LayoutManager’s.
• Um Layout Manager é um objeto Java associado a um componente Java Swing que na maioria dos casos é um componente de background como uma janela ou um painel. Um Layout Manager controla os componentes que estão dentro do componente ao qual ele está associado.
4
LayoutManager
• Os quatro principais LayoutManager’s do Java Swing são:
▫ BorderLayout
▫ FlowLayout
▫ BoxLayout
▫ GridLayout
5
BorderLayout
• Esse Layout Manager divide a área de um componente de background em cinco regiões (norte, sul, leste, oeste e centro). Somente um componente pode ser adicionado em cada região.
• Eventualmente, o BorderLayout altera o tamanho preferencial dos componentes para torná-los compatíveis com o tamanho das regiões.
• O BorderLayout é o Layout Manager padrão de umJFrame.
6
BorderLayout
7
Exemplo
JFrame janela=new JFrame("Janela"); janela.setSize(500,500);
janela.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); Panel p = new Panel(); p.setLayout(new BorderLayout()); //Norte //rotulo JLabel rotulo=new JLabel(); rotulo.setText("Bem vindo! Sistema Financeiro"); p.add(rotulo, BorderLayout.NORTH); //Oeste //rotulo JLabel rotulo3=new JLabel(); rotulo3.setText("Comentarios:"); p.add(rotulo3, BorderLayout.WEST); //centro //CAMPO DE TEXTo JTextArea texto=new JTextArea(5, 5); p.add(texto, BorderLayout.CENTER); p.add(new Button("SALVAR"), BorderLayout.SOUTH); janela.setContentPane(p); janela.setVisible(true);
FlowLayout
• Esse Layout Manager arranja os componentes da esquerda para direita e quando o tamanho horizontal não é suficiente ele “pula” para a próxima “linha”.
• O FlowLayout não altera o tamanho preferencial dos componentes.
• O FlowLayout é o Layout Manager padrão de um JPanel.
9
FlowLayout
10
BoxLayout
• BoxLayout: Esse Layout Manager arranja os componentes de cima para baixo “quebrando linha” a cada componente adicionado.
• O BoxLayout não altera o tamanho preferencial dos componentes.
11
BoxLayout
12
panel.setLayout(new BoxLayout(panel,BoxLayout.PAGE_AXIS));
panel.setLayout(new BoxLayout(panel,BoxLayout.LINE_AXIS));
Exemplo
• Sem Layout
• Com BoxLayout
JFrame janela=new JFrame("Janela"); janela.setSize(500,500); janela.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); Panel p = new Panel(); p.setLayout(new BoxLayout(p,BoxLayout.X_AXIS)); JLabel rotulo=new JLabel(); rotulo.setText("Bem vindo! Sistema Financeiro"); p.add(rotulo); JLabel rotulo2=new JLabel(); rotulo2.setText("Usuario"); p.add(rotulo2); JTextField campo=new JTextField(10); p.add(campo); JLabel rotulo3=new JLabel(); rotulo3.setText("Comentarios:"); p.add(rotulo3); JTextArea texto=new JTextArea(5, 5); p.add(texto); JButton botao=new JButton("salvar"); p.add(botao);
GridLayout
• Esse Layout Manager divide a área de um componente de background em células semelhantemente a uma tabela. As células possuem o mesmo tamanho.
14
GridLayout
15
panel.setLayout(new GridLayout(0,2));
Exemplo GridLayout
JFrame janela=new JFrame("Janela");
janela.setSize(500,500);
janela.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
Panel p = new Panel();
p.setLayout(new GridLayout(0,2));
JLabel rotulo=new JLabel();
rotulo.setText("Sistema Financeiro");
p.add(rotulo);
JLabel rotulo5=new JLabel();
rotulo5.setText("");
p.add(rotulo5);
JLabel rotulo2=new JLabel();
rotulo2.setText("Usuario");
p.add(rotulo2);
JTextField campo=new JTextField(10);
p.add(campo);
JLabel rotulo3=new JLabel();
rotulo3.setText("Comentarios:");
p.add(rotulo3);
JTextArea texto=new JTextArea(5, 5);
p.add(texto);
JLabel rotulo6=new JLabel();
rotulo6.setText("");
p.add(rotulo6);
JButton botao=new JButton("salvar");
p.add(botao);
janela.setContentPane(p);
janela.setVisible(true);
Construtor de GUI do Netbeans
• Passo a passo:
Passo 1: Criar novo projeto Java
Passo 2: Nomeie seu projeto
Passo 3: Clique no projeto com botão direito
Passo 4: Selecione Formulário Jframe Form
Passo 5: Nomeie sua tela
Passo 6: Visualize os componentes a direita
Passo 7: Arraste os componentes
Passo 8: Veja o código em Source
Exemplo
• Faça a seguinte tela usando o Construtor GUI do Netbeans
Exercício • Faça a seguinte tela usando o Construtor GUI do
Netbeans