Desenvolvendo com Silverlight para WP7 Mango [Update]

85
Windows Phone 7

description

Apresentação feita em serra talhada

Transcript of Desenvolvendo com Silverlight para WP7 Mango [Update]

Page 1: Desenvolvendo com Silverlight para WP7 Mango [Update]

Windows Phone 7

Page 2: Desenvolvendo com Silverlight para WP7 Mango [Update]

Felipe Pimentel

Consultor e Arquiteto- ASP.NET 4.0- Windows Phone 7

@FelipePimentell

Felipe Pimentel

[email protected]

Page 3: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 4: Desenvolvendo com Silverlight para WP7 Mango [Update]

Introdução aoWindows phone 7 “Mango”

Page 5: Desenvolvendo com Silverlight para WP7 Mango [Update]

Visão geral do Windows Phone Nova plataforma mobile da Microsoft. Foco no usuário final Nova interface – Metro

Interface também adotada no Windows 8. Utilização de HUBS Desenvolvimento .NET Windows Phone Marketplace.

Page 6: Desenvolvendo com Silverlight para WP7 Mango [Update]

Hardware do Windows Phone Padronização junto aos fabricantes. Mínimo: 256 MB RAM e 8 GB de storage Botões – Back (Voltar) , Start (Iniciar) e Search (Procurar) Tela – Multitouch capacitivo (800x480) Câmera – mínimo de 5 megapixels + flash Sensores e serviço

Wi-fi Accelerometer Compass (Bússola) Location (GPS) Speech (Reconhecimento de voz) Vibration Push Notifications

Page 7: Desenvolvendo com Silverlight para WP7 Mango [Update]

Arquitetura do Windows Phone

Page 8: Desenvolvendo com Silverlight para WP7 Mango [Update]

Ciclo de Vida de Desenvolvimento

Page 9: Desenvolvendo com Silverlight para WP7 Mango [Update]

VISUAL STUDIO

Page 10: Desenvolvendo com Silverlight para WP7 Mango [Update]

O que é o VISUAL STUDIO?

Um conjunto de ferramentas de desenvolvimento que permite aos desenvolvedores de software resolver problemas complexos e criar soluções inovadoras.

Baseia-se em três pilares principais:Desenvolvimento rápido de aplicativosColaboração eficaz em equipeExperiências de usuário inovadoras

Page 11: Desenvolvendo com Silverlight para WP7 Mango [Update]

O que posso fazer com o VS?

• Desenvolver Web Sites ASP.NET, AJAX.NET e Silverlight. • Impressionar com mídia e gráficos desenvolvidos com

o Windows Presentation Foundation. • Desenvolver aplicativos que estendem funções do

Office. • Desenvolver aplicações para Windows Phone.• Desenvolver jogos.• Desenvolver soluções de integração coorporativa com

Windows Communication Foundation e o Windows Workflow Foundation e muito mais...

Page 12: Desenvolvendo com Silverlight para WP7 Mango [Update]

Criando uma Solução

Page 13: Desenvolvendo com Silverlight para WP7 Mango [Update]

Criando a partir de templates

Page 14: Desenvolvendo com Silverlight para WP7 Mango [Update]

Interface Design

Page 15: Desenvolvendo com Silverlight para WP7 Mango [Update]

Interface Programação

Page 16: Desenvolvendo com Silverlight para WP7 Mango [Update]

Lógica de Programação

Page 17: Desenvolvendo com Silverlight para WP7 Mango [Update]

Estruturas de controle de fluxo if ... else

Comando condicional: executa um bloco de comandos se uma condição for verdadeira.

A cláusula else (condição falsa) é opcional.

if (idade >= 18){ Response.Write("Autorizado."); Response.Write("Sua idade é: " + idade);}else if (idade > 15 && idade < 18){ Response.Write("Somente com os pais."); Response.Write("Menor de 18 anos.");}else{ Response.Write("Não autorizado."); Response.Write("Menor de 15 anos.");}

Page 18: Desenvolvendo com Silverlight para WP7 Mango [Update]

Estruturas de controle de fluxo switch … case

Estrutura de decisão que seleciona um comando com base no valor de uma variável.

A cláusula default é opcional.

switch (sexo){ case "masculino": Response.Write("Homem"); break; case "feminino": Response.Write("Mulher"); break; default: Response.Write("Não informado"); break;}

Page 19: Desenvolvendo com Silverlight para WP7 Mango [Update]

Estruturas de Repetição

for Estrutura de repetição composta por três expressões:

Inicialização.Condição de parada.Atualização.

for (int i = 0; i < 10; i++) { Response.Write(i); Response.Write("<br />");}

Page 20: Desenvolvendo com Silverlight para WP7 Mango [Update]

Estruturas de Repetição

while Estrutura de repetição que realiza as operações

indicadas enquanto a condição especificada for verdadeira.

int i = 0;while(i < 10){ Response.Write(i); Response.Write("<br />"); i++;}

Page 21: Desenvolvendo com Silverlight para WP7 Mango [Update]

Estruturas de Repetição do ... while

Estrutura de repetição semelhante à anterior, porém as condições são verificadas ao final da execução.

As operações especificadas são executadas pelo menos uma vez. Necessita do caractere “;” ao final da estrutura.

int i = 0;do{ Response.Write(i); Response.Write("<br />"); i++;}while (i < 10);

Page 22: Desenvolvendo com Silverlight para WP7 Mango [Update]

Conversão DE TIPOS

// Exemplo Istring s = "123"; int i = s;Response.Write(i);

// Exemplo IIstring s = "123";int i = Convert.ToInt32(s);Response.Write(i);

// Exemplo IIIstring s = "123";int i = int.Parse(s);Response.Write(i);

// Exemplo Vstring s = "valor";int i = 0;if (int.TryParse(s, out i)){ Response.Write(i);}else{ Response.Write("inválido");}

// Exemplo IVstring s = "valor"; int i = Convert.ToInt32(s);Response.Write(i);

Page 23: Desenvolvendo com Silverlight para WP7 Mango [Update]

Estruturas de Repetição foreachEsta estrutura de repetição é uma variação

do for. Especifica uma variável auxiliar e a coleção

ou array cujos elementos serão percorridos.

int[] i = { 1, 3, 5, 7, 9 };foreach (int j in i){ Response.Write(j); Response.Write("<br />");}

Page 24: Desenvolvendo com Silverlight para WP7 Mango [Update]

Namespaces• Declarando um namespace

• Namespaces em cadeia

• Instrução Using

namespace Cadastro.Telas {public class TelaCliente {}

}

using System;using System.Data;using Cadastro.Telas;using Pessoa = Cadastro.Cliente;

namespace Cadastro {public class Cliente {}

}

Page 25: Desenvolvendo com Silverlight para WP7 Mango [Update]

Introdução ao xaml

Page 26: Desenvolvendo com Silverlight para WP7 Mango [Update]

O que é XAML?

• É uma linguagem de marcação.• Tecnologia de criação de interface do .NET

Framework.• Disponível desde o .NET Framework 3.0• Criação de interface para as plataformas:

– WPF (Windows Presentation Foundation)– Silverlight para Web– Silverlight para Windows Phone– Windows 8

Page 27: Desenvolvendo com Silverlight para WP7 Mango [Update]

Poderes e limitações do XAML

• É uma linguagem declarativa.• Mais usada para criar e instanciar objetos.• Templates• Data Binding• Animações/Efeitos de Transição • Há coisas que só podem ser feitas no XAML,

outras apenas no código e outras em ambas.

Page 28: Desenvolvendo com Silverlight para WP7 Mango [Update]

Sintaxe do XAML

• Elementos do objeto– Um elemento do objeto declara a instância de um tipo

(componente).– Para iniciar o objeto sempre começa com “<”, seguido do nome do

objeto e finaliza com “>”.– Para fechar um objeto com conteúdo, começa com “</”.– Para fechar um objeto sem conteúdo, termina com “/>”.

<StackPanel> <Button Content="Click Me"/>

</StackPanel>

Page 29: Desenvolvendo com Silverlight para WP7 Mango [Update]

Sintaxe do XAML

• Atributos (Propriedades)– Propriedades podem ser declaradas como

atributos no XAML.

<Button Background="Blue" Foreground="Red" Content="This is a button"/>

Page 30: Desenvolvendo com Silverlight para WP7 Mango [Update]

Sintaxe do XAML

<Button> <Button.Background>

<SolidColorBrush Color="Blue"/> </Button.Background> <Button.Foreground>

<SolidColorBrush Color="Red"/> </Button.Foreground> <Button.Content>

This is a button </Button.Content>

</Button>

• Sintaxe de propriedade do elemento– Algumas propriedade precisam ser declaradas

como elemento de objeto.

Page 31: Desenvolvendo com Silverlight para WP7 Mango [Update]

Sintaxe do XAML

<Button> <Button.Background>

<SolidColorBrush Color="Blue"/> </Button.Background> <Button.Foreground>

<SolidColorBrush Color="Red"/> </Button.Foreground> <Button.Content>

This is a button </Button.Content>

</Button>

• Sintaxe de propriedade do elemento– Algumas propriedade precisam ser declaradas

como elemento de objeto.

Page 32: Desenvolvendo com Silverlight para WP7 Mango [Update]

Elementos Contêiner

• Habilita criação complexas de layouts.• Facilita questão diversas do layout como

posicionamento e redimensionamento.• Todos elementos de objeto precisam estar em

pelo menos um Elemento Contêiner.• Alguns Elementos Contêiner são:

– Grid– Canvas– StackPanel.

Page 33: Desenvolvendo com Silverlight para WP7 Mango [Update]

Elementos Contêiner

• Canvas – Define uma área na qual os Elementos filhos podem definir coordenadas relativas a essa área.- Mais fácil de trabalhar com Posições X e Y.

<Canvas Width="640" Height="480" Background="White">

<Rectangle Canvas.Left="30" Canvas.Top="30" Fill="red"

Width="200" Height="200" /></Canvas>

Page 34: Desenvolvendo com Silverlight para WP7 Mango [Update]

Elementos Contêiner

• Grid– Define uma área

flexível que consiste em colunas e linhas..

<Grid Width="400" Height="300"> <Grid.ColumnDefinitions> …</Grid.ColumnDefinitions>

<Grid.RwDefinitions> ...</Grid.RowDefinitions>

//Restante dos elementos

</Grid>

Page 35: Desenvolvendo com Silverlight para WP7 Mango [Update]

Elementos Contêiner

• Grid

Page 36: Desenvolvendo com Silverlight para WP7 Mango [Update]

Elementos Contêiner

• StackPanel– Organiza os elementos filhos em uma

única linha que pode ser orientada horizontalmente ou verticalmente.

<StackPanel Margin="20"> <Rectangle Fill="Red" Width="50" Height="50" Margin="5" /> <Rectangle Fill="Blue" Width="50" Height="50" Margin="5" /><Rectangle Fill="Green" Width="50" Height="50" Margin="5" /> <Rectangle Fill="Purple" Width="50" Height="50" Margin="5" />

</StackPanel>

Page 37: Desenvolvendo com Silverlight para WP7 Mango [Update]

Data binding

Page 38: Desenvolvendo com Silverlight para WP7 Mango [Update]

Data Binding

• Disponibiliza uma forma simples para exibir dados no layout.

• Estabelece uma conexão entre o UI e um objeto de dados.

• Mudanças feito no UI ou diretamente no objeto, são refletidos em ambos lados.– Exemplo: Um usuário edita um TextBlock. O valor

atribuido a esse elemento é automaticamente atualizado no objeto de origem também.

Page 39: Desenvolvendo com Silverlight para WP7 Mango [Update]

Data Binding

• O Binding precisa especificar a origem e o destino.

Page 40: Desenvolvendo com Silverlight para WP7 Mango [Update]

Data Binding

• Exemplo:

<TextBox x:Name="MyTextBox" Text="Text" Foreground="{Binding Brush1}"/>

XAML

Código

MyColors textcolor = new MyColors(); textcolor.Brush1 = new SolidColorBrush(Colors.Red);MyTextBox.DataContext = textcolor;

Page 41: Desenvolvendo com Silverlight para WP7 Mango [Update]

Data Binding

• Formas de Binding:– One Way: Padrão, as alterações no objeto refletem no

UI, mas o inverso não acontece.– Two Way: Alterações feitas no objeto e no UI refletem

em ambos lados.– One Time: Alterações feitas em ambos lados não são

refletidas. Os dados são apenas enviados uma vez ao UI.

Page 42: Desenvolvendo com Silverlight para WP7 Mango [Update]

Data Binding

• Exemplo:

<TextBox x:Name="MyTextBox" Text="Text" Foreground="{Binding Brush1, Mode=TwoWay}"/>

XAML

Código

MyColors textcolor = new MyColors(); textcolor.Brush1 = new SolidColorBrush(Colors.Red);MyTextBox.DataContext = textcolor;

Page 43: Desenvolvendo com Silverlight para WP7 Mango [Update]

PANORAMA E PIVOT

Page 44: Desenvolvendo com Silverlight para WP7 Mango [Update]

Panorama

• Oferece uma experiência única de ver controles, dados e serviços usando uma tela horizontal.

• Não fica limitado ao tamanho da tela do Windows Phone.• O usuário tem a liberdade de navegar para esquerda ou direita.

Page 45: Desenvolvendo com Silverlight para WP7 Mango [Update]

Panorama

Page 46: Desenvolvendo com Silverlight para WP7 Mango [Update]

Panorama

• PanoramaItem é o controle secundário que serve como contêiner para o conteúdo de um Panorama.

Page 47: Desenvolvendo com Silverlight para WP7 Mango [Update]

Pivot

• Uma forma rápida de gerenciar layout ou páginas.• O usuário tem a liberdade de navegar para esquerda ou

direita, mas não tem um pré-visualização da parte direita.

Page 48: Desenvolvendo com Silverlight para WP7 Mango [Update]

Pivot

Page 49: Desenvolvendo com Silverlight para WP7 Mango [Update]

Pivot

• PivotItem é o controle secundário que serve como contêiner para o conteúdo de um Pivot.

Também é possível navegar tocandonos títulos das páginas

Page 50: Desenvolvendo com Silverlight para WP7 Mango [Update]

Acelerometro

Page 51: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 52: Desenvolvendo com Silverlight para WP7 Mango [Update]

Camera

Page 53: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 54: Desenvolvendo com Silverlight para WP7 Mango [Update]

Photo

Page 55: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 56: Desenvolvendo com Silverlight para WP7 Mango [Update]

GeoCoordinateWatcher

Page 57: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 58: Desenvolvendo com Silverlight para WP7 Mango [Update]

WebBrowserTask

Page 59: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 60: Desenvolvendo com Silverlight para WP7 Mango [Update]

SearchTask

Page 61: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 62: Desenvolvendo com Silverlight para WP7 Mango [Update]

SmsComposeTask

Page 63: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 64: Desenvolvendo com Silverlight para WP7 Mango [Update]

PhoneNumberChooserTask

Page 65: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 66: Desenvolvendo com Silverlight para WP7 Mango [Update]

MediaPlayerLauncher

Page 67: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 68: Desenvolvendo com Silverlight para WP7 Mango [Update]

Orientation

Page 69: Desenvolvendo com Silverlight para WP7 Mango [Update]
Page 70: Desenvolvendo com Silverlight para WP7 Mango [Update]

CICLO DE VIDA

Page 71: Desenvolvendo com Silverlight para WP7 Mango [Update]

Ciclo de Vida

running

deactivated

dormantTombstoned

activated

Page 72: Desenvolvendo com Silverlight para WP7 Mango [Update]

Ciclo de Vida

• OnNavigatedTo– Chamado quando o usuário navega para a página.

• OnNavigatedFrom– Chamado quando o usuário sai da página.

Page 73: Desenvolvendo com Silverlight para WP7 Mango [Update]

Ciclo de Vida

• Desactived– Chamado quando o usuário:

• Pressiona o botão Start• Muda para outro aplicativo.

• Actived– Chamado quando o aplicativo retorna do estado:

• Dormant.• Tombstoned.

Page 74: Desenvolvendo com Silverlight para WP7 Mango [Update]

Ciclo de Vida

• Launching– Chamado quando o usuário:

• Abre o programa pela lista de aplicativos• Abre o programa via Tile.• Recebe uma notificação pedindo para abrir o aplicativo e ele aceita.

• Closing– Chamado quando o usuário aperta o botão “Back” do Windows

Phone para sair do aplicativo.

Page 75: Desenvolvendo com Silverlight para WP7 Mango [Update]

Ciclo de VidaQuando o usuário aperta em “Back” saindo do aplicativo.

Quando o aplicativo é aberto via lista, Tite ou Notification

Quando o usuário volta ao aplicativo apertando “Back” ou quando retorna de Tombstoned ou Dormant.

Quando o usuário aperta em Start ou seleciona outro aplicativo aberto.

Page 76: Desenvolvendo com Silverlight para WP7 Mango [Update]

ISOLATED STORAGE

Page 77: Desenvolvendo com Silverlight para WP7 Mango [Update]

Isolated Storage

• Permite a armazenar dados no próprio Windows Phone.

• Toda ação de armazenamento e leitura de dados locais está restrita ao Isolated Storage.

• É mais seguro, reduz as chances de acessos não autorizados e erros.

Page 78: Desenvolvendo com Silverlight para WP7 Mango [Update]

Opções de armazenamento

• É possível armazenar:– Configurações: Gravar dados como

key/value (chave/valor) usando a classe IsolatedStorageSettings.

– Arquivos e Pastas: Gravar arquivos e pastas usando a classe IsolatedStorageFile.

– Dados relacionais: Gravar dados em um banco de dados local usando LINQ to SQL.

Page 79: Desenvolvendo com Silverlight para WP7 Mango [Update]

Opções de armazenamento

• É possível armazenar:– Chave/Valor: Gravar dados com o par

key/value usando a classe IsolatedStorageSettings.

– Arquivos e Pastas: Gravar arquivos e pastas usando a classe IsolatedStorageFile.

– Dados relacionais: Gravar dados em um banco de dados local usando LINQ to SQL.

Page 80: Desenvolvendo com Silverlight para WP7 Mango [Update]

Opções de armazenamento

Page 81: Desenvolvendo com Silverlight para WP7 Mango [Update]

Opções de armazenamento

• Chave/Valor (IsolatedStorageSettings):

string NomeUsuario;

if( IsolatedStorageSettings.ApplicationSettings.TryGetValue<string>("NomeUsuario", out NomeUsuario)){ IsolatedStorageSettings.ApplicationSettings.Add("NomeUsuario", "José");

}

Código

Page 82: Desenvolvendo com Silverlight para WP7 Mango [Update]

Opções de armazenamento

• Arquivos/Pastas (IsolatedStorageSettings):Código

var store = IsolatedStorageFile.GetUserStoreForApplication()

store.CreateDirectory("MyApp1"); IsolatedStorageFileStream rootFile = store.CreateFile("InTheRoot.txt"); rootFile.Close();

if (store.FileExists(filePath)) { StreamWriter sw = new StreamWriter(

store.OpenFile( "InTheRoot.txt”, FileMode.Open, . . FileAccess.Write)); }

Page 83: Desenvolvendo com Silverlight para WP7 Mango [Update]

Opções de armazenamento

• LINQ to SQL:Código

var toDoItemsInDB = from ToDoItem todo in toDoDB.ToDoItems select todo; ToDoItems = new ObservableCollection<ToDoItem>(toDoItemsInDB);

Page 84: Desenvolvendo com Silverlight para WP7 Mango [Update]

SERVIÇOS?

Page 85: Desenvolvendo com Silverlight para WP7 Mango [Update]

WINDOWS PHONE 7Silverlight