Este documento apresenta como criar o primeiro projeto com Xamarin Forms no Visual Studio 2017, incluindo como criar a solução com 4 projetos, identificar a estrutura da solução, executar o aplicativo no emulador e salvar e reabrir o projeto.
1. PRIMEIRO PROJETO COM XAMARIN FORMS
Prof. Me. Tiago A. Silva
VERSÃO 2019
www.tiago.blog.br
PROGRAMAÇÃO DE APLICATIVOS MOBILE I
2. PLANO DE AULA
▪ Nesta aula vamos aprender:
✓Criar Projetos Xamarin
✓Conhecer a estrutura de uma Solução
✓Executar o PrimeiroApp
✓Salvar e Reabrir o PrimeiroApp
2www.tiago.blog.br
OBJETIVO: APRENDER A CRIAR PROJETOS XAMARIN NO VISUAL STUDIO 2017
4. XAMARIN: CRIANDO O PRIMEIRO PROJETO
4www.tiago.blog.br
Após abrir o Visual Studio 2017, vá no
menu “Arquivo”, em seguida em “Novo”
e então “Projeto”. Caso você prefira
também pode usar o atalho do teclado:
Ctrl + Shift + N
1
2
5. ANDROID
5www.tiago.blog.br
1) Na caixa de
diálogo,
selecione
“Visual C#”,
em seguida:
“Cross-
Plataform”
2) Escolha “Mobile App (Xamarin.Forms)”
3) Dê um nome para
seu projeto: Sem
espaços e caracteres
especiais. No exemplo:
“PrimeiroApp”
4) Defina o local onde será criada o
diretório do projeto. Escolha a Área de
Trabalho
6. XAMARIN: CRIANDO O PRIMEIRO PROJETO
6www.tiago.blog.br
1) Selecione “Blank App”
2) Aqui estão os projetos que
poderão ser criados: Android, iOS
e Windows. Marque todos.
3) Clique em OK e aguarde o
Visual Studio 2017 finalizar a
criação da solução.
8. XAMARIN: SOLUÇÃO COM 4 PROJETOS
8www.tiago.blog.br
Solução PrimeiroApp, que contém
4 projetos.
Projeto “Xamarin”, código em C# e XAML.
Vamos editar apenas aqui.
Código nativo com a estrutura completa de um projeto
Android. O Xamarin irá gerar esse código a partir das
implementações feita no projeto acima.
Projeto para iOS, completo assim como Android.
Alterações específicas podem ser feitas aqui.
Projeto para Windows Phone, a vantagem é
usar o emulador mais rápido, na própria
máquina.
9. XAMARIN: ONDE VOU PROGRAMAR?
9www.tiago.blog.br
Toda a programação em nossa disciplina
será realizada em XAML e C#. Portanto
vamos utilizar apenas o projeto Xamarin,
ou seja, vamos editar os arquivos .xaml e
.cs
Será possível ver o aplicativo no
emulador Android. Porém ele é bem
mais lento do que o emulador do
Windows.
Caso você tenha um dispositivo
com iOS é possível configurá-lo
para visualizar os App após
prontos e durante o
desenvolvimento.
10. ANDROID
10www.tiago.blog.br
Código por trás, em C#, para
manipular os comportamentos e
interações do usuário no XAML
Linguagem de marcação XAML
usada para estruturar a interface
do App
12. EXCUTAR O PRIMEIROAPP NO EMULADOR
12www.tiago.blog.br
Para ver o projeto no emulador:
1) Selecione PrimeiroApp.UWP
2) Clique no botão “Computador Local”
3) Aguarde a abertura do emuladorLembre-se: caso você selecione PrimeiroApp.Android
jamais feche o emulador após aberto, devido ao
tempo necessário para carregar o emulador
novamente.
13. ANDROID
13www.tiago.blog.br
Tela onde o App irá aparecer após criado,
note que a mensagem “Welcome to
Xamarin.Forms” está descrita em um
Label no arquivo XAML
Ferramenta de diagnóstico
para verificar a quantidade
de memória RAM e
processamento gasto pelo
App
15. FECHANDO A ABRINDO A SOLUÇÃO
15www.tiago.blog.br
Para fechar a solução sem fechar o Visual Studio
2017 você pode ir no menu “Arquivo” e selecionar
a opção “Fechar Solução”.
Se estiver finalizando os trabalhos do dia e for desligar
o computador, basta fechar o Visual Studio 2017 e a
solução será fechada também.
16. 16www.tiago.blog.br
Para abrir o projeto novamente vá até a pasta
onde você o salvou e clique no arquivo .sln, que
é a solução do Visual Studio 2017. É fortemente
aconselhável que você não abra diretamente no
pendrive.
Caso você deseje
copiar o projeto para o
seu pendrive, atente-se
ao tamanho do
diretório, não deixe
para copiar na última
hora.