Olá estou tentando criar uma piramide alimentar interativa no Android, para minha App, o Guia Nutricional, vou fazer um pequeno tutorial aqui para vocês acompanharem como fiz, vamos lá, primeiramente desenhei uma piramide alimentar básica no Corel Draw, e depois dividi ela em várias partes para tentar desenhar na tela do Android posicionando os ImageButton nos locais corretos, para poder acessar os toques e exibir a mensagem e também mostrar melhor as divisões.
Bom vamos lá a primeira parte foi o desenho da piramide de alimentos no Corel Draw:
Depois exportei as partes para o projeto e no projeto posicionei os ImageButton assim:
Depois coloque as devidas imagens em cada ImageButton correspondente, e emulei, veja:
Bem o que falta agora é o código XML, que segue abaixo:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:background="#00AFEF"
>
<ImageButton
android:id="@+id/ImageTopo"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageButton
android:id="@+id/ImageSubEsquerda"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
/>
<ImageButton
android:id="@+id/ImageSubDireita"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
/>
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageButton
android:id="@+id/ImageSobEsquerda"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
/>
<ImageButton
android:id="@+id/ImageSobDireita"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
/>
</LinearLayout>
<ImageButton
android:id="@+id/ImageBase"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
/>
</LinearLayout>
Espero que gostem do tutorial, só hoje, domingo tive tempo de cria-lo, espero escrever mais e mais, só falta tempo, e conhecimento, pois estou caminhando no desenvolvimento Android, e trabalhando muito no Guia Nutricional, que brevemente deve ter mais uma atualização, que além da piramide alimentar terá mais conteúdos,
obrigado a todos, Thiago.
0 comentários:
Postar um comentário