Mário Pimentel
  Severino
  Http://mozit.tv


@MarioPimentel



MarioPimentelJr



mariopimentel@mozit.tv
O que veremos nesse curso?
FOCO DO CURSO
• Silverlight
   – XAML
   – Binding
   – Controles
   – Blend e Visual Studio 2010
FOCO DO CURSO
• WP7
  – Criando uma aplicação com Silverlight
     •   Layouts
     •   Recursos do Aparelho
     •   Armazenamento local
     •   Ciclo de vida
     •   Serviços
  – Publicação no Market
Introdução ao
Windows phone 7 “Mango”
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.
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
Arquitetura do Windows Phone
Ciclo de Vida de Desenvolvimento
Introdução ao xaml
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
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.
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>
Sintaxe do XAML
   • Atributos (Propriedades)
       – Propriedades podem ser declaradas como
         atributos no XAML.

   <Button Background="Blue" Foreground="Red" Content="This is a button"/>
Elementos Contêiner
   • 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.
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>
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>
Elementos Contêiner
    • Grid
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>
Data binding
Data Binding
    • Disponibiliza uma forma simples para exibir
      dados no layout.
    • Estabelece uma conexão entre o UI e um
      objeto de dados.
       – Exemplo: Um usuário edita um TextBlock. O valor
         atribuido a esse elemento é automaticamente
         atualizado no objeto de origem também.
Data Binding
    • Exemplo:
     XAML
     <TextBox x:Name="MyTextBox" Text="Text"
     Foreground="{Binding Brush1, Mode=TwoWay}"/>


     Código

     MyColors textcolor = new MyColors();
     textcolor.Brush1 = new SolidColorBrush(Colors.Red);
     MyTextBox.DataContext = textcolor;
PANORAMA E PIVOT
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.
Panorama
Panorama
    • PanoramaItem é o controle secundário que
      serve como contêiner para o conteúdo de
      um Panorama.
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.
Pivot
Pivot
   • PivotItem é o controle secundário que serve como
     contêiner para o conteúdo de um Pivot.




                 Também é possível navegar tocando
                      nos títulos das páginas
CICLO DE VIDA
Ciclo de Vida
                              running




                  activated             deactivated




     Tombstoned               dormant
Ciclo de Vida
   • OnNavigatedTo
     – Chamado quando o usuário navega para a página.

   • OnNavigatedFrom
     – Chamado quando o usuário sai da página.
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.
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.
Quando o
usuário
                 Ciclo de Vida   Quando o
                                 aplicativo é
aperta em                        aberto via
“Back” saindo                    lista, Tite ou
do aplicativo.                   Notification

                                  Quando o
                                  usuário
Quando o                          aperta em
usuário volta                     Start ou
ao aplicativo                     seleciona
apertando                         outro
“Back” ou                         aplicativo
quando                            aberto.
retorna de
Tombstoned
ou Dormant.
ISOLATED STORAGE
Isolated Storage
   • Permite 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.
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.
Opções de armazenamento
Opções de armazenamento
• Chave/Valor (IsolatedStorageSettings):
    Código

string NomeUsuario;

if( IsolatedStorageSettings.ApplicationSettings.TryGetValue<string>
("NomeUsuario", out NomeUsuario))
{

IsolatedStorageSettings.ApplicationSettings.Add("NomeUsuario",
"José");

}
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));
}
Opções de armazenamento

    • LINQ to SQL:


     Código

     var toDoItemsInDB = from ToDoItem todo in toDoDB.ToDoItems select todo;

     ToDoItems = new ObservableCollection<ToDoItem>(toDoItemsInDB);
DEMO
Mário Pimentel
                    Severino
                    Http://mozit.tv


                  @MarioPimentel



                  MarioPimentelJr



                  mariopimentel@mozit.tv
WINDOWS PHONE 7

Treinamento Windows Phone

  • 2.
    Mário Pimentel Severino Http://mozit.tv @MarioPimentel MarioPimentelJr mariopimentel@mozit.tv
  • 3.
    O que veremosnesse curso?
  • 4.
    FOCO DO CURSO •Silverlight – XAML – Binding – Controles – Blend e Visual Studio 2010
  • 5.
    FOCO DO CURSO •WP7 – Criando uma aplicação com Silverlight • Layouts • Recursos do Aparelho • Armazenamento local • Ciclo de vida • Serviços – Publicação no Market
  • 7.
  • 8.
    Visão geral doWindows 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.
  • 9.
    Hardware do WindowsPhone 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
  • 10.
  • 11.
    Ciclo de Vidade Desenvolvimento
  • 12.
  • 13.
    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
  • 14.
    Poderes e limitaçõesdo 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.
  • 15.
    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>
  • 16.
    Sintaxe do XAML • Atributos (Propriedades) – Propriedades podem ser declaradas como atributos no XAML. <Button Background="Blue" Foreground="Red" Content="This is a button"/>
  • 17.
    Elementos Contêiner • 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.
  • 18.
    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>
  • 19.
    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>
  • 20.
  • 21.
    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>
  • 22.
  • 23.
    Data Binding • Disponibiliza uma forma simples para exibir dados no layout. • Estabelece uma conexão entre o UI e um objeto de dados. – Exemplo: Um usuário edita um TextBlock. O valor atribuido a esse elemento é automaticamente atualizado no objeto de origem também.
  • 24.
    Data Binding • Exemplo: XAML <TextBox x:Name="MyTextBox" Text="Text" Foreground="{Binding Brush1, Mode=TwoWay}"/> Código MyColors textcolor = new MyColors(); textcolor.Brush1 = new SolidColorBrush(Colors.Red); MyTextBox.DataContext = textcolor;
  • 25.
  • 26.
    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.
  • 27.
  • 28.
    Panorama • PanoramaItem é o controle secundário que serve como contêiner para o conteúdo de um Panorama.
  • 29.
    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.
  • 30.
  • 31.
    Pivot • PivotItem é o controle secundário que serve como contêiner para o conteúdo de um Pivot. Também é possível navegar tocando nos títulos das páginas
  • 32.
  • 33.
    Ciclo de Vida running activated deactivated Tombstoned dormant
  • 34.
    Ciclo de Vida • OnNavigatedTo – Chamado quando o usuário navega para a página. • OnNavigatedFrom – Chamado quando o usuário sai da página.
  • 35.
    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.
  • 36.
    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.
  • 37.
    Quando o usuário Ciclo de Vida Quando o aplicativo é aperta em aberto via “Back” saindo lista, Tite ou do aplicativo. Notification Quando o usuário Quando o aperta em usuário volta Start ou ao aplicativo seleciona apertando outro “Back” ou aplicativo quando aberto. retorna de Tombstoned ou Dormant.
  • 38.
  • 39.
    Isolated Storage • Permite 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.
  • 40.
    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.
  • 41.
  • 42.
    Opções de armazenamento •Chave/Valor (IsolatedStorageSettings): Código string NomeUsuario; if( IsolatedStorageSettings.ApplicationSettings.TryGetValue<string> ("NomeUsuario", out NomeUsuario)) { IsolatedStorageSettings.ApplicationSettings.Add("NomeUsuario", "José"); }
  • 43.
    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)); }
  • 44.
    Opções de armazenamento • LINQ to SQL: Código var toDoItemsInDB = from ToDoItem todo in toDoDB.ToDoItems select todo; ToDoItems = new ObservableCollection<ToDoItem>(toDoItemsInDB);
  • 45.
  • 46.
    Mário Pimentel Severino Http://mozit.tv @MarioPimentel MarioPimentelJr mariopimentel@mozit.tv WINDOWS PHONE 7