Exemplo 1 – Sem Hardware
O primeiro exemplo de aplicação consiste, em entender com executar uma ação, sendo esta consequência de uma ação anterior, ou seja, quando um botão for carregado, o texto apresentado numa label vai alterar.
A aplicação consiste em dois botões, botão A e botão B, e numa label, na qual, inicialmente vai estar o texto "Nenhum Botão Pressionado". Quando se pressionar o botão A, o texto da Label vai mudar para "Botão A pressionado" e no B "Botão B pressionado".
Desenho do Layout (Designer)
Primeiro de tudo, devemos selecionar o "Screen1" na tabela de componentes para definirmos quais as suas propriedades.
Inicialmente, remover, nas propriedades do Screen 1 a opção "Scrollable" pois esta vai permitir colocar o alinhamento do ecrã centrado segundo a vertical. Seguidamente colocar as opções:
-- AlignHorizontal: Center (Centra os componentes segundo a horizontal)
-- AlignVertical: Center (Centra os componentes segundo a vertical)
-- BackgroundColor: Light Gray (Cor de fundo)
-- ScreenOrientation: Sensor (Como se comporta o ecrã, neste caso se rodar-mos o dispositivo móvel, o ecrã roda, acompanhando o movimento.
-- Title: Início
NOTA: As opções não referidas, devem ficar como estão por defeito, mas sendo que muitas são de personalização, fica ao critério de cada um.
Adicionar um "VerticalArrangement" ao screen, bastando ir à tab "Layout" da Palette, e arrastando para o screen o "VerticalArrangement".
Relativamente à propriedades deste:
-- AlignHorizontal: Center
-- AlignVertical: Center
-- Width: Fill Parent
-- Height: Fill Parent
Seguidamente devem ser adicionados uma label e dois botões, os quais podem ser encontrados na tab "User Interface" da Palette. Estes deve ser colocados dentro do Verticalarrengement, aparecendo as dependencias nos componentes como pode ser observado na imagem à direita.
NOTA: Quando um componente esta abaixo de outro com um pequeno avanço, quer dizer que está introduzido dentro deste, e que depende dele.
Propriedades:
Label1:
-- Ativar a opção "FontBold"
-- FontSize: 18.0
-- Text: Nenhum Botao Pressionado
-- TextAlignment: center
-- Width: Fill Parent...
-- Height: Automatic...
Button1:
-- BackgroundColor: Red
-- FontSize: 18.0
-- Text: Botao A
-- TextAlignment: center
-- TextColor: White
-- Width: Fill Parent...
-- Height: Automatic...
Button2:
-- BackgroundColor: Blue
-- FontSize: 18.0
-- Text: Botao B
-- TextAlignment: center
-- TextColor: White
-- Width: Fill Parent...
-- Height: Automatic...
Construção de Blocos (Blocks)
Para iniciar, começando pelo botão 1, colocar no viewer o bloco [when Button1.Click do] que pode ser encontrado na Palette->Screen1->Verticalarrengement1->Button1.
Depois, vamos encaixar do lado direito nesse bloco, um bloco que define a label e lhe permite alterar o texto, bloco [set Label1.Text to] que está em Palette->Screen1->Verticalarrengement1->Label1.
No final vamos utilizar um bloco de texto [" "] que esta na tab Text, como observado na figura à direita e como car nele o texto "Botao A pressionado".
O mesmo deve ser feito para o Botão dois, sendo que desta vez o bloco do botão deve ser adquirido na Palette->Screen1->Verticalarrengement1->Button2.
Para o botão B o texto da label será ""Botao B pressionado"
