Desenvolvimento RIA com
Silverlight 4
do básico ao acabamento...
Rodrigo Kono
• MVP da Microsoft
• MCP – MCTS – MCPD – MCT
• Fundador do grupo de usuários DevGoiás .NET
• 7 anos de comuni...
Developer Evangelist, Pai e Gamer.
Foco em Ferramentas e Soluções Microsoft
Agenda
• First steps
• RIA
• Sketflow: Tudo começa com a Prototipação
• Padrão MVVM
• WCF RIA Services
Microsoft Silverlight é um runtime cross-
browser, cross-platform que permite
desenvolver aplicações ricas para
internet e...
Microsoft .NET Application Platform
Tecnologia e Ferramenta
DesignDevelop
Ferramentas &
Modelo de Aplicações
Deploy
Browse...
ALM
RIA
RIA – Rich Internet Applications
Back Button and Refresh
Visual Vocabulary
State management
Browser Sandbox Business Logic in UI
Component Level Logic
Anim...
App RIA
Blend + SketchFlow
Protótipos não lineares
Compatível com as principais ferramentas de criação
Presença de comportamentos
...
Sketchflow
Entendendo o Layout
• Essencial para a criação da sua UI
• Renderização/organização do conteúdo
• Panels são usados para r...
Controles
Controles são Faceless. Crie o seu!
Subset do WPF, porém muitos controles do
Silverlight não existem no WPF
Silv...
Expression Blend
Layout , Bind e Controles
Dica #1: Escolha um padrão e respeite-o
• Silverlight Line-of-Business (LOB) pode crescer
fora do controle e sem planejame...
O Padrão MVVM
• O Model-View-ViewModel (MVVM) funciona
muito bem com apps para Silverlight LOB:
– Fornece consistência em ...
• O padrão MVVM tem 3 elementos chaves:
• Model: domínio de negócio (regras de negócio,
acesso a dados, modelo de classes)...
Cenário MVVM: O que está envolvido?
Silverlight client
View
(Pessoa Master/Details)
XAML Code
Precisa ser desenhado
model
...
MVVM
View (Pessoa
Master/Details)
XAML
Code
puro
“Display”
Model
(PessoaModel/Pessoa)
puro
“Dados
ViewModel
ViewModel é o
...
Vinculando View com a ViewModel
MVVM
View (Pessoa
Master/Details)
XAML
Code
puro
“Display”
Model
(PessoaModel/Pessoa)
puro
“Dados
ViewModel
ViewModel é o
...
Camadas e camadas…
XAML
Code behind
ViewModel
Model
Data Access
Network client
Database
Network server
Model Server Valida...
Melhorando isto…
XAML
Code behind
ViewModel
Model
Data Access
Network client
Database
Network server
ModelModel Server Val...
A próxima grande onda
7
Plataforma
Consistente
Windows Phone
Hardware
Elementos de
Hardware
Foco na
Qualidade
Silverlight no Windows Phone 7
HTML 5 x Silverlight x Flash
Amigo ou inimigo?
• Spark’s
• DreamSpark
• WebSiteSpark
• BizSpark
• WebsiteSpark
• Software
• Visibilidade
• Suporte
• WebsiteSpark
• WebsiteSpark
• WebsiteSpark
www.microsoft.com/web/websitespark/
XAMLCast
Podcast sobre Silverlight, WPF e XAML
www.xamlcast.net
Links
• Cases: www.microsoft.com/silverlight/case-
studies/business
• Site oficial do produto
– www.microsoft.com/silverli...
Twitter:
@fernandomartin
@rodrigokono
Apoio
Agradecimentos
Patrocinadores
Realização
Próximos SlideShares
Carregando em…5
×

Desenvolvimento RIA com Silverlight 4

2.974 visualizações

Publicada em

Publicada em: Tecnologia
0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
2.974
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1.574
Ações
Compartilhamentos
0
Downloads
11
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide
  • Separation of Concerns (SoC): é o processo de agrupar códigos com características distintas, separando em blocos de códigos especialistas, responsáveis por interesses específicos.

    Separa Design/Apresentação da Logica de Negócios
    Data Binding via XAML
    Teste unitário
    Sinergia de trabalho entre Designer e Developer
  • Model: Objeto de Domínio, Properties, Entidades com RIA Services

    View: A Tela ou a Página ou Controle. Apresentação amigável da informação. Interação com o usuário em bindings, events, behaviors. Themes e Styles

    ViewModel: Cola, conecta a view na model. Ligação com a View através de properties, commands, methods. Contém o Model. Pode comunicar com o Serviço e ler/salvar o modelo.


  • Desenvolvimento RIA com Silverlight 4

    1. 1. Desenvolvimento RIA com Silverlight 4 do básico ao acabamento...
    2. 2. Rodrigo Kono • MVP da Microsoft • MCP – MCTS – MCPD – MCT • Fundador do grupo de usuários DevGoiás .NET • 7 anos de comunidade .NET • Mais de 12.000 pessoas nesse tempo • Pensou.NET Treinamentos e Consultoria • Torcedor do Goiás (Uhuu série B) • Bonitão • www.rodrigokono.net
    3. 3. Developer Evangelist, Pai e Gamer. Foco em Ferramentas e Soluções Microsoft
    4. 4. Agenda • First steps • RIA • Sketflow: Tudo começa com a Prototipação • Padrão MVVM • WCF RIA Services
    5. 5. Microsoft Silverlight é um runtime cross- browser, cross-platform que permite desenvolver aplicações ricas para internet e potencializar a experiência de media na Web, Desktop e Devices. Media e RIA
    6. 6. Microsoft .NET Application Platform Tecnologia e Ferramenta DesignDevelop Ferramentas & Modelo de Aplicações Deploy Browser ClientUser Experience
    7. 7. ALM
    8. 8. RIA
    9. 9. RIA – Rich Internet Applications
    10. 10. Back Button and Refresh Visual Vocabulary State management Browser Sandbox Business Logic in UI Component Level Logic Animation Desktop Developers Web Developer O que tem de diferente com RIA? Limited Runtime Service Orientation Non-text based layout Hype
    11. 11. App RIA
    12. 12. Blend + SketchFlow Protótipos não lineares Compatível com as principais ferramentas de criação Presença de comportamentos Padrão de wireframes Comportamentos extensíveis Solução Silverlight e WPF Reutilização de sketchs SketchFlow player Feedbacks Documentação +SketchFlow
    13. 13. Sketchflow
    14. 14. Entendendo o Layout • Essencial para a criação da sua UI • Renderização/organização do conteúdo • Panels são usados para receber conteúdo • Margin e Padding • Posicionamento Fixo (Canvas) é raramente usado
    15. 15. Controles Controles são Faceless. Crie o seu! Subset do WPF, porém muitos controles do Silverlight não existem no WPF Silverlight Toolkit possui vários controles Existem ótimos controles de terceiros
    16. 16. Expression Blend Layout , Bind e Controles
    17. 17. Dica #1: Escolha um padrão e respeite-o • Silverlight Line-of-Business (LOB) pode crescer fora do controle e sem planejamento adequado: – Normalmente muitas telas de código – Código de validação – Código para chamar serviços da aplicação – Código de Serviço – Código do Modelo – Código de acesso aos dados
    18. 18. O Padrão MVVM • O Model-View-ViewModel (MVVM) funciona muito bem com apps para Silverlight LOB: – Fornece consistência em código – Permite uma melhor reuso de código – Permite a separação de preocupações (SoC) – Suporta Testes Unitários – Usado como um tipo de controller para view – Silverlight 4 fornece suporte ICommand Code-behind não é ruim, mas minimiza o código que você adicionar
    19. 19. • O padrão MVVM tem 3 elementos chaves: • Model: domínio de negócio (regras de negócio, acesso a dados, modelo de classes) • View: Interface de usuário (telas Silverlight) • ViewModel: Elemento do meio. Fica entre a View e o Model – similar a um controller MVVM Pattern Players View ViewModel Model Presentation Layer Business Domain
    20. 20. Cenário MVVM: O que está envolvido? Silverlight client View (Pessoa Master/Details) XAML Code Precisa ser desenhado model Model (PessoaModel) Pessoa Camada Dados/ Serviço Camada de Negócios Precisa ser testável e sustentável
    21. 21. MVVM View (Pessoa Master/Details) XAML Code puro “Display” Model (PessoaModel/Pessoa) puro “Dados ViewModel ViewModel é o DataContext da View. Bind to data, commandsDesigners e Ferramenta s de Design como XAML para maximizar a utilização. Aberto para aplicar técnicas como injeção de dependência, testes, etc Difícil de testar este Código sem retirar/ Minimizar ele da UI Vincula a View com a ViewModel (ViewModelLoc ator) INotifyPropertyCh anged Envia para a View quando há mudanças de dados
    22. 22. Vinculando View com a ViewModel
    23. 23. MVVM View (Pessoa Master/Details) XAML Code puro “Display” Model (PessoaModel/Pessoa) puro “Dados ViewModel ViewModel é o DataContext da View. Bind to data, commands Designers e Ferramenta s de Design como XAML para maximizar a utilização. Aberto para aplicar técnicas como injeção de dependência, testes, etc Difícil de testar este Código sem retirar/ Minimizar ele da UI Vincula a View com a ViewModel (ViewModelLoc ator) INotifyPropertyCh anged Envia para a View quando há mudanças de dados + Services Services Fornece serviços para realizar operações como RetornaPessoa
    24. 24. Camadas e camadas… XAML Code behind ViewModel Model Data Access Network client Database Network server Model Server Validation rules Client Validation rules
    25. 25. Melhorando isto… XAML Code behind ViewModel Model Data Access Network client Database Network server ModelModel Server Validation rules Client Validation rules Data Access WCF RIA Services
    26. 26. A próxima grande onda 7 Plataforma Consistente Windows Phone Hardware Elementos de Hardware Foco na Qualidade
    27. 27. Silverlight no Windows Phone 7
    28. 28. HTML 5 x Silverlight x Flash Amigo ou inimigo?
    29. 29. • Spark’s • DreamSpark • WebSiteSpark • BizSpark
    30. 30. • WebsiteSpark • Software • Visibilidade • Suporte
    31. 31. • WebsiteSpark
    32. 32. • WebsiteSpark
    33. 33. • WebsiteSpark
    34. 34. www.microsoft.com/web/websitespark/
    35. 35. XAMLCast Podcast sobre Silverlight, WPF e XAML www.xamlcast.net
    36. 36. Links • Cases: www.microsoft.com/silverlight/case- studies/business • Site oficial do produto – www.microsoft.com/silverlight • Free Windows Phone Developer Tools – http://developer.windowsphone.com • Blog: Rodrigo Kono - www.rodrigokono.net • Blog do Kelps Sousa - blog.kelps.net
    37. 37. Twitter: @fernandomartin @rodrigokono
    38. 38. Apoio Agradecimentos Patrocinadores Realização

    ×