Usando o Recurso de ‘Placements’ do Magic xpa

Usando o Recurso de ‘Placements’ do Magic xpa

Uma das preocupações quando se desenvolve aplicativos é a resolução de tela. Principalmente quando se trata de uma aplicação RIA mobile, pois existem varias resoluções de diferentes e temos que atender a todas com o mínimo de esforço de desenvolvimento possível.

Para resolver este problema, nós usamos uma configuração chamada placements.

Os placements configuram os ajustes dos controles para redimensionamento e reposicionamento da tela, evitando que ela fique distorcida ou desarrumada:

Imagem_001

Porém, é difícil sabermos exatamente quais os valores corretos para configuração dos placements em nossos layouts. Isso nos obriga a realizar vários testes com diferentes valores a fim de determinar quais são os corretos para cada tela de nossa aplicação.

Imagem_002

 

O Cálculo 

Existe um cálculo que pode ser feito para se descobrir qual a configuração correta para os controles de tela de modo que não haja distorções no layout caso a tela seja maximizada, reposicionada horizontalmente ou quando o programa for aberto em uma tela com uma resolução diferente.

Este cálculo está disponível em uma planilha Excel que pode ser encontrado no help do Magic xpa:

Home > Technical Notes > Forms >Control Placement Definitions

ou diretamente aqui.

Abrindo este arquivo, encontraremos três painéis:

1. Form Navigation Properties – Onde adicionamos a altura e largura da tela que estamos desenhando no Studio. Normalmente configuramos a menor resolução de tela possível para o SO que estamos desenvolvendo:

Form Navigation Properties

Width

80

Height

13

 

*Se estivermos desenvolvendo a tela horizontalmente então devemos trocar os valores: o valor de Width colocamos em Height e vice-versa, desta forma o cálculo será feito levando em consideração o posicionamento horizontal da tela.

 

2. Control Navigation Properties – Onde colocamos altura, largura e a posição do controle na tela:

Control Navigation Properties

Left

0,000

Top

1,000

Width

5,000

Height

1,125

 

3. Placement – Onde mostra o resultado, os valores que devem ser configurados no placements do controle:

Placement

Left

0%

Right

6%

Top

8%

Bottom

9%

Agora é só inserir os valores calculados na configuração de placements do controle.

Imagem_003

*Os valores devem ser calculados para cada controle da tela.

Douglas - Analista Programador Magic Software Brasil

Douglas – Analista Programador Magic Software Brasil

Novo Comentário