INSTITUTO SUPERIOR DE TRANSPORTES E COMUNICAÇÕES

DEPARTAMENTO DE TECNOLOGIAS DE INFORMAÇÃO E COMUNICAÇÃO

Licenciatura em Engenharia Informática e Telecomunicações

Programação III
Introdução aos gestores de layout
Docente: Mujhahid Karim/ Erick Mahanjane

Maputo, 21 de Agosto de 2023

 Conteúdo da aula
1. Introdução
2. Gestores de layout
3. FlowLayout
4. GridLayout
5. BorderLayout
6. CardLayout

2
1. Introdução
• Na última aula, verificou-se que ao executar a nossa primeira janela,
qualquer componente que era adicionado ao JFrame ocupava toda
tela, se tivessemos dois componentes, apenas o último a ser
adicionado é que era visualizado.

• Desta forma, concluiu-se que os componentes por si próprios não se

organizam, então durante esta aula debruçar-se-á sobre a utilização
dos layouts.
3
2. Gestores de Layout
• Uma das principais características da linguagem Java é a sua portabilidade
que dispensa preocupações com aspectos relacionados com hardware.
Imaginemos que um programa que foi codificado para rodar numa
máquina que possui um monitor com a resolução 1366 x 768 pixels, sendo
executado em um monitor 800 x 600 pixels, isso provavelmente iria fazer
com que os componentes fossem mal posicionados ou até mesmo que os
componentes não fossem vistos completamente ao nível da tela.

4
2. Gestores de Layout
• Outro tipo de linguagens de programação como C++, exigem que o programador
saiba de antemão para qual tipo de máquina esta desenvolvendo o programa, ou
então o programa deve carregar as características na hora de execução, esse tipo
de funcionamento agrega bastante complexidade ao algoritmo e reduz a
portabilidade.
• Em Java, não existe o posicionamento e dimensionamento dos componentes
gráficos, isso é feito através de processos chamados de Gestores de layouts,
tornando o programa com portabilidade, porque o mesmo pode ser executado
em um sistema operativo Windows com qualquer resolução ou então em outros
tipos de sistemas operativos como Linux.

5
3. FlowLayout
• O FlowLayout é o gestor com as funções mais simples, isso porque os
componentes são visualizados da esquerda para a direita na ordem de
inserção. Quando não existe mais espaço ele quebra a linha colocando o
componente numa outra linha, isso também pode ser testado usando o
curso do mouse para diminuir/aumentar o comprimento da tela.
• Construtores da classe FlowLayout
FlowLayout()
FlowLayout (int align)
FlowLayout(int align, int h, int v)
6
3. FlowLayout
• O parâmetro align permite especificar um novo alinhamento para os
objectos, os possíveis valores são:

1. FlowLayout.LEFT – alinhamento a esquerda;

2. FlowLayout.CENTER – alinhamento centralizado;

3. FlowLayout.RIGHT – alinhamento a direita.

• Os parâmetros h e v permitem indicar o espaçamento horizontal e

vertical.

7
3. FlowLayout
• Sintaxe:

• Dentro do construtor da classe, e antes de adicionar os componentes

ao JFrame, deve-se indicar qual o layout que JFrame o vai seguir:
• frame.setLayout(new FlowLayout());

• Agora, implemente a seguinte tela:

8
3. FlowLayout

9
4. GridLayout
• O GridLayout organiza os componentes em uma grelha imaginária, todos os
componentes desta grelha são redimensionados junto com as células e as células
possuem o mesmo tamanho.

• Sintaxe:
• frame.setLayout(new GridLayout(3, 2, 2, 2));

• GridLayout(linhas, colunas, espaçamento-horizontal, espaçamento-vertical)

• Para efeitos de testagem, vamos criar uma janela simulando uma tela de
autenticação, a tela irá possuir 1 título ex: “Autenticação”, uma caixa escrita
utilizador e o respectivo lugar para preencher o valor, um campo escrito senha e o
respectivo lugar para colocar a senha e um botão com o nome submeter.

10
4. GridLayout
• Como o GridLayout trabalha com células, quando tiver necessidade
que uma célula fique vazia, deve-se criar um JLabel vazio e adicionar
ao JFrame, assim ficara um espaço vazio, assim como pode ver
imagem abaixo logo a seguir a “Autenticação”.

11
4. GridLayout

12
5. BorderLayout
• O BorderLayout é um gestor que divide um container em 5 partes nomeadamente
uma parte superior (North), uma parte inferior (South), uma parte a esquerda
(West), uma parte a direita (East) e uma parte na central (Center).

• Em cada região é possível apenas colocar um componente, então como esse

gestor possui cinco regiões, apenas cinco components poderão existir no máximo.
No exemplo a seguir serão colocados cinco botões introduzidos no container, um
em cada região.

13
5. BorderLayout

• Pode-se visualizar que em cada região apenas um componente foi

colocado, mas os componentes não se organizam aleatoriamente, deve-se
indicar qual componente deve estar em qual região, isso deve ser indicado
na hora em que o componente estiver a ser adicionado ao container.
14
5. BorderLayout
• frame.add("North", jb_b1);
• frame.add("South", jb_b2);
• frame.add("West", jb_b3);
• frame.add("East", jb_b4);
• frame.add("Center", jb_b5);

• Para melhor perceber a nota anteriormente indicada, pode-se verificar

que o código que gerou a tela, e realizar algumas modificações, como
remover o “EAST” e executar o programa, deve relação o que
aconteceu. Após essa alteração, deve-se remover a região “SOUTH”.
Qual é a conclusão para o que acontece quando um componente é
removido do container?
15
5. BorderLayout

16
5. BorderLayout
• O facto de apenas poder adicionar um componente em cada região
poderia ser suficiente para esse gestor ser menos utilizado pelos
programadores, mas a linguagem de programação Java tem o conceito
de painéis, quer dizer que ao invés de adicionar-se um componente em
cada região adiciona-se um painel em cada região que se pretende
colocar mais de um componente, e como cada painel tem a capacidade
de ter um próprio layout, logo pode-se adicionar quantos componentes
forem pretendidos dispostos de maneira que se necessita.
17
5. BorderLayout
• JPanel

• Em alguns casos é necessário separar o JFrame em áreas para

adicionar outros componentes, o Painel assim como o JFrame
permitem que outros objectos sema adicionados nele, em uma
aplicação Java um ou mais painéis podem estar contidos em um
Jframe.

• Sintaxe: JPanel panel= new JPanel();

18
5. BorderLayout
• Então continuando com o BorderLayout, agora pode-se utilizar esse
gestor associado a vários JPanel formando assim uma interface
robusta.

19
5. BorderLayout

20
6. CardLayout
• O CardLayout é um gestor de cartões, que actua como se existisse uma
pilha de cartões, onde cada cartão é representado por um container, em
que cada um desses container pode ter um layout próprio. Cada cartão
tem um nome e o método para trocar de cartão é show().

• Para se utilizar esse gestor de layout irá se utilizar novos conceitos como
tratamentos de eventos, sendo que para a presente aula não se deve
preocupar com esses conceitos apenas utiliza-se para conseguir
completar o exemplo, sendo que haverá aulas dedicadas para mais
detalhes.
21
6. CardLayout
• Pode-se verificar a iteração do CardLayout ao clicar nos botões:

• Pode-se verificar que foram criados três painéis e quando o utilizador pressionar
nos botões acima, o respectivo painel é invocado e actualiza a parte inferior da
tela.

22
6. CardLayout

23
6. CardLayout

24
6. CardLayout

Nota: A parte sublinhada a amarelo será uma matéria para próximas aulas, por
enquanto vai se utilizando, de modo a completarmos o exemplo do GridLayout.

25
Exercícios
• Investigue os seguintes componentes e utilize dentro do seu JFrame
para verificar o efeito:

1. setResizable

2. JPasswordField

26
Bibliografia
1. Caelum FJ. (2011). Java e Orientação a Objectos,
http://www.caelum.com.br/download/caelum-java-objetos-fj11.pdf ,
2. Caelum FJ (2011). Java para Desenvolvimento Web,
http://www.caelum.com.br/download/caelum-java-web-fj21.pdf,
3. Oracle, (2011). Especificações do padrão JAVA EE,
http://www.oracle.com/technetwork/java/javaee/tech/index.html,
4. Campione, Mary e Walrath, Kathy, (2005). The Java Tutorial - Basics, Sun
Microsystems, http://java.sun.com/docs/books/tutorial/index.html#basics ,
5. Coelho, P. (2005). Programação com JSP, FCA. W3schools, (1999 – 2014).
Tutorial de HTML, http://www.w3schools.com/html/

27
DÚVIDAS E/OU QUESTÕES

28