Padrões de Interação com o Usuário

1. Padrões de Interação com o Usuário

2. Granularidade dos Padrões • Padrões estão relacionados a 3 elementos: • Problemas e Soluções podem ser observados em diferentes níveis de granularidade • Padrão de Projeto: Classes, Objetos e suas relações • Relações: associações, herança, dependência, ... • Padrão Arquitetural: Partes do Sistema e suas relações • Visão de alto nível • Idiom: considera o padrão na linguagem de programação • Implementações específicas resolve ocorre Contexto Problema Solução Análise e Projeto OO com UML e Padrões| 2

3. Camada de Apresentação Camada de Negócio Camada de Dados RecapitulandoPadrão Camadas • Problema • Como organizar os elementos? • Solução • Organizar pela suas responsabilidades em comum • Promovendo • Encapsulamento • Desacoplamento • Coesão Análise e Projeto OO com UML e Padrões| 3

4. Exemplos de Padrões Arquiteturais Padrões POSA (Pattern Oriented Software Architecture) • Categoria: From Mud to Structure • ajuda a evitar a proliferação exacerbada de componentes • Ex.: Layers – Divisão em Camadas • Categoria: Distributed systems • Suporte à estruturação de sistemas com componentes distribuídos • Ex.: Broker – Separa serviços remotos de forma transparente • Frameworks (Implementações): Corba, COM, etc. • Categoria: Interactive systems • Facilidade de adaptação da interface do usuário • Ex.: MVC: Controla diferentes visões da modelagem do sistema Focaremos o restante desta aula na categoria Interactive Systems Análise e Projeto OO com UML e Padrões| 4

5. Padrões de Interação com o Usuário • O objetivo é promover duas separações: • Separação Visão-Modelo • Boa Prática de projeto de software! “Separa as classes que descrevem o modelo e a lógica de negócios das classes que realizam a interface com o usuário, permitindo que ambas evoluam de forma independente.” • Separação Visão-Controle (Visão-Apresentador) • Separa a responsabilidade, facilita testes e manutenção • Mais difícil de ser plenamente implementada em algumas tecnologias. • Em algumas GUI, regras de controle são associadas à visão. Apresentador Visões Dados Análise e Projeto OO com UML e Padrões| 5

6. MODEL Padrões Camadas e MVC • Distinção: • Camadas preocupam-se principalmente com a divisão da estrutura • MVC preocupa-se com interação entre partes do sistema. • MVC foi criado, e continua largamente sendo utilizado, para definir as interações da camada de apresentação. VIEW Camada Apresentação CONTROLLER Camada Negócio Análise e Projeto OO com UML e Padrões| 6

7. Padrão MVC • MVC: Model-View-Controller • Um dos padrões mais conhecidos para interação com o usuário • Divide a aplicação em três partes fundamentais • Model – Representa os dados da aplicação e as regras de negócio • View – Representa a interpretação visual do modelo pelo usuário • Controller - Responsável por mediar a interação usuário-aplicação • O padrão foi originalmente criado em 1978 • Desde então diversas variações foram criadas para acompanhar novas demandas na iteração com o usuário (UI) Análise e Projeto OO com UML e Padrões| 7

8. View Model MVC Original Controller associação indireta associação direta • Responsabilidades: • Controller: Recebe dados de Usuário (ex.: teclado) e possui lógica de apresentação • View: mostra projeções (saída) sobre os dados do modelo • Modelo: representação dos dados e regras de negócio Em geral para cada elemento visão existe um controlador Análise e Projeto OO com UML e Padrões| 8

9. View Model View Model Variações • Duas variações do padrão podem ser identificados mais comumente: • Passiva (chamada Passive View) • Ativa (chamada Supervising Controller) Desacopladas Sincronização com Observer Análise e Projeto OO com UML e Padrões| 9

10. View Presentation Model Business Model Interação [em Camadas] no MVC Descrição: • O usuário faz requisições por dados ou ações sobre os dados do modelo ao Controller. • O Controller recebe as requisições e repassa para o objeto apropriado do Model para atendê-la. • O Model faz as operações sobre os dados e retorna algum tipo de informação ao Controller,que por sua vez devolve informações para objetos na camada de apresentação. • Atualizações no Model são avisadas ao View. output input notificação C. Apresentação 1 4 Controller 3 notificação 2 C. Negócio Análise e Projeto OO com UML e Padrões| 10

11. Variação MVP • Outros padrões (como o MVP) foram criados para resolver as insuficiências do MVC quando aplicado a algumas tecnologias de interface gráfica • Qual a diferença do MVP (Model-View-Presenter)? • Em algumas GUI: • View é responsável pela entrada de dados do usuário • Presenter apenas media a View e o Model. Análise e Projeto OO com UML e Padrões| 11

12. Cliente Web (Browser) Internet HTTP HTTP ClienteWeb Arquitetura Cliente-Servidor HTTP Servidor Web A comunicação entre cliente e servidor na web é feita utilizando o protocolo HTTP. Análise e Projeto OO com UML e Padrões| 12

13. ClienteWeb ClienteWeb Arquitetura Cliente-Servidor Via get de uma URL Parametros: - Get (explicitamente) - Post (implicitamente) requisição HTTP página HTML resposta HTTP (conteúdo HTML) ServidorWeb Análise e Projeto OO com UML e Padrões| 13

14. Aplicações Web • Características • Requisições simples (http) • Páginas dinâmicas, sem sincronização com o Model • Que padrão usar? Análise e Projeto OO com UML e Padrões| 14

15. Frameworks MVC • Existem Diversos frameworks que auxiliam o desenvolvimento Web de acordo com o padrão MVC • Os frameworks Java mais conhecidos são: • JSF • Struts • Spring MVC • Todos provêem implementações para o Front Controller e indicam formas para a representação dos demais papeis (View e Model) • Realização de interfaces do Framework • Arquivos de Configuração Análise e Projeto OO com UML e Padrões| 15

16. Struts e JSF • Struts e JSF possuem diversas similaridades • Views -> Páginas JSP • Controller -> Servlet (provido pelo framework) • Presentation Model -> Objetos Java, cujos atributos representam campos de formulários Análise e Projeto OO com UML e Padrões| 16