Desde que já aprendemos como executar nossa primeira aplicação para Android usando a Eclipse IDE e conhecemos um pouco mais sobre os diretórios e arquivos importantes para o desenvolvimento de softwares para a plataforma, chegou a vez de nos aprofundarmos em uma característica importante de nosso projeto que é a possibilidade que o SDK nos oferece de ver a mesma informação através de múltiplas visões (views). Se você ainda não viu nossa série anterior, pode acessar nossas partes um e dois da série Programando para Android com o Eclipse IDE.
Particularmente, nossos próximos estudos no desenvolvimento de softwares para a plataforma se concentrarão nos diversos layouts de aplicativos que são possíveis de criar para um único projeto Android.
Ansioso por começar, neh? Então, mãos a obra!
Layout Linear
Particularmente, nossos próximos estudos no desenvolvimento de softwares para a plataforma se concentrarão nos diversos layouts de aplicativos que são possíveis de criar para um único projeto Android.
Ansioso por começar, neh? Então, mãos a obra!
Layout Linear
O primeiro layout que mostraremos é o Linear que também é o modelo mais simples de apresentação de dados. Ele gerencia a distribuição dos dados na tela através apenas da orientação(horizontal ou vertical) definida pelo usuário, onde os objetos são desenhados e ordenados em tela após a finalização de seu objeto predecessor, ou seja, desenhados um após o outro no sentido escolhido. Entretanto, é possível ao usuário agrupar diversos sub-elementos de layout linear com diferentes orientações, de modo a que o resutado final seja tão misto quanto quisermos. E é exatamente o que mostraremos no post de hoje.
Nosso primeiro passo é abrir o Eclipse IDE e localizar a pasta onde salvamos o nosso projeto ou caso o projeto tenha sido criado dentro do workspace padrão do software, apenas selecioná-lo na janela package (costumeiramente localizada na lateral esquerda do programa).
Com o projeto localizado e plenamente identificado pela janela de pacotes (package), expandimos a pasta “res” e devemos encontrar nela a pasta layout. Nela devemos encontrar o arquivo main.xml que utilizamos no último post para alterar as mensagens exibidas de 'hello world”. Nesta pasta, crie um novo arquivo xml com o nome “linear.xml”. Abra o arquivo criado e insira as seguintes linhas:
Nosso primeiro passo é abrir o Eclipse IDE e localizar a pasta onde salvamos o nosso projeto ou caso o projeto tenha sido criado dentro do workspace padrão do software, apenas selecioná-lo na janela package (costumeiramente localizada na lateral esquerda do programa).
Com o projeto localizado e plenamente identificado pela janela de pacotes (package), expandimos a pasta “res” e devemos encontrar nela a pasta layout. Nela devemos encontrar o arquivo main.xml que utilizamos no último post para alterar as mensagens exibidas de 'hello world”. Nesta pasta, crie um novo arquivo xml com o nome “linear.xml”. Abra o arquivo criado e insira as seguintes linhas:
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
android:text="red"
android:gravity="center_horizontal"
android:background="#aa0000"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:text="green"
android:gravity="center_horizontal"
android:background="#00aa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:text="blue"
android:gravity="center_horizontal"
android:background="#0000aa"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:text="yellow"
android:gravity="center_horizontal"
android:background="#aaaa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
android:text="Café Com Bits"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
android:text="O blog de tecnologia"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
android:text="Que te ensina tudo"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
android:text="do Android"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
Entendendo o código: É possível notar no código acima 3 elementos , por outro lado, força os blocos coloridos representados pelos pelos objetos Textview a organizarem-se horizontalmente. Enquanto isso, o último faz com que os seus TextViews organizem-se verticalmente, um abaixo do outro.
Agora, abra o arquivo hello.java e edite as linhas a seguir:
Agora, abra o arquivo hello.java e edite as linhas a seguir:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//setContentView(R.layout.main);
setContentView(R.layout.linear); }
Execute e se tudo correr bem, sua aplicação terá a aparência a seguir:
Gostou? Então fique a vontade para brincar um pouco com o código do layout e ver como o mesmo comporta-se. Sugestão: Altere o atributo android:layout_weight em cada elemento e veja como o resultado final altera-se!
Até a próxima!
Gostou? Então fique a vontade para brincar um pouco com o código do layout e ver como o mesmo comporta-se. Sugestão: Altere o atributo android:layout_weight em cada elemento e veja como o resultado final altera-se!
Até a próxima!
