Padres de Interao com o

Usurio

Granularidade dos Padres

Padres esto relacionados a 3 elementos:

Contexto

ocorre

Problema

resolve

Soluo

Problemas e Solues podem ser observados em

diferentes nveis de granularidade

Padro de Projeto: Classes, Objetos e suas relaes

Relaes: associaes, herana, dependncia, ...

Padro Arquitetural: Partes do Sistema e suas relaes

Viso de alto nvel

Idiom: considera o padro na linguagem de programao

Implementaes especficas
Anlise e Projeto OO com UML e Padres| 2

Recapitulando
Padro Camada
Problema

Como organizar os elementos?

Camada de
Apresentao

Soluo

Organizar pela suas

responsabilidades em comum
Promovendo
Encapsulamento
Desacoplamento
Coeso

Camada de
Negcio

Camada de
Dados

Anlise e Projeto OO com UML e Padres| 3

Exemplos de Padres
Arquiteturais
Padres POSA (Pattern Oriented Software Architecture)
Categoria: From Mud to Structure

ajuda a evitar a proliferao exacerbada de componentes

Ex.: Layers Diviso em Camadas

Categoria: Distributed systems

J Vimos

Suporte estruturao de sistemas com componentes distribudos

Ex.: Broker Separa servios remotos de forma transparente
Frameworks (Implementaes): Corba, COM, etc.

Categoria: Interactive systems

Facilidade de adaptao de interface do usurio

Ex.: MVC: Controla diferentes vises da modelagem do sistema

Focaremos o restante desta aula na categoria Interactive Systems

Anlise e Projeto OO com UML e Padres| 4

Padres de
Interao com o Usurio
O objetivo promover duas separaes:

Separao Viso-Modelo
Boa Prtica de projeto de software!
Separa as classes que descrevem o modelo e a lgica de
negcios das classes que realizam a interface com o usurio,
permitindo que ambas evoluam de forma independente.

Separao Viso-Controle (Viso-Apresentador)

Separa a responsabilidade, facilita testes e manuteno
Mais difcil de ser plenamente implementada em algumas
tecnologias.
Em algumas GUI, regras de controle so associadas viso.

Apresentador
Vises

Dados
Anlise e Projeto OO com UML e Padres| 5

Padres Camadas e MVC

Distino:

Camadas preocupam-se principalmente com a diviso da estrutura

MVC preocupa-se com interao entre partes do sistema.

MVC foi criado, e continua largamente sendo utilizado,

para definir as interaes da camada de apresentao.
VIEW
CONTROLLER
MODEL

Camada
Apresentao
Camada
Negcio

Anlise e Projeto OO com UML e Padres| 6

Padro MVC
MVC: Model-View-Controller

Um dos padres mais conhecidos para interao com o usurio

Divide a aplicao em trs partes fundamentais

Model Representa os dados da aplicao e as regras de negcio

View Representa a interpretao visual do modelo pelo usurio
Controller - Responsvel por mediar a interao usurio-aplicao

O padro foi originalmente criado em 1978

Desde ento diversas variaes foram criadas para acompanhar

novas demandas na iterao com o usurio (UI)

Anlise e Projeto OO com UML e Padres| 7

MVC Original
Controller

View

Model
associao indireta

associao direta

Responsabilidades:

Controller: Recebe dados de Usurio (ex.: teclado) e possui

lgica de apresentao
View: mostra projees (sada) sobre os dados do modelo
Modelo: representao dos dados e regras de negcio

Em geral para cada elemento viso existe um controlador

Anlise e Projeto OO com UML e Padres| 8

Variaes
Duas variaes do padro podem ser identificados mais
comumente:

Passiva (chamada Passsive View)

View

Desacopladas

Model

Ativa (chamada Supervising Controller)

View

Model
Sincronizao
com Observer
Anlise e Projeto OO com UML e Padres| 9

Variao
Modelo de Negcio e Apresentao
Em muitos casos necessria a criao de entidades na
camada de apresentao para representar entidades de
negcio

Ex.: Em aplicaes Web, as linguagens de viso nem sempre

conseguem distinguir polimorfismo de tipo (herana)

Mas importante no utilizar este mecanismo (criao de duas

representaes) em excesso

Anlise e Projeto OO com UML e Padres| 10

Interao [em Camadas]

output

View
4

input

notificao

Presentation
Model

1
Controller

C. Apresentao

3
notificao

2
Business
Model

Anlise e Projeto OO com UML e Padres| 11

C. Negcio

Descrio:
1. O usurio faz requisies por dados
ou aes sobre os dados do modelo
ao Controller.
2. O Controller recebe as requisies
e repassa para o objeto apropriado
do B. Model para atend-la.
3. O B. Model faz as operaes sobre
os dados e retorna algum tipo de
informao ao Controller,que por
sua vez devolve informaes para
objetos na camada de
apresentao.
4. Atualizaes no P. Model so
avisadas ao View.

Variao MVP
Outros padres (como o MVP) foram criados para resolver as
insuficincias do MVC quando aplicado a algumas tecnologias
de interface grfica
Qual a diferena do MVP (Model-View-Presenter)?
Em algumas GUI:

View responsvel pela entrada de dados do usurio

Presenter apenas media a View e o Model.

Anlise e Projeto OO com UML e Padres| 12

Dolphin MVP Original

Utilizado em diversas
aplicaes GUI Desktop

Presenter

View

foco do
padro

Model
associao indireta

associao direta

Responsabilidades:

Presenter: media View e Model

View: realiza toda a interao com o usurio, possui lgica
de apresentao.
Modelo: representao dos dados e regras de negcio.
Mltiplas vises podem estar associadas ao mesmo presenter
Anlise e Projeto OO com UML e Padres| 13

Interao [em Camadas]

1
View
notificao

4
Presentation
Model

Presenter

C. Apresentao

3
notificao

Business
Model

Anlise e Projeto OO com UML e Padres| 14

C. Negcio

Descrio:
1. O usurio faz requisies por
dados ou aes sobre os dados do
modelo View.
2. O Presenter recebe as requisies
e repassa para o objeto
apropriado do B. Model para
atend-la.
3. O B. Model faz as operaes sobre
os dados e retorna algum tipo de
informao ao Presenter,que por
sua vez devolve informaes para
objetos na camada de
apresentao.
4. Atualizaes no P. Model so
avisadas ao View.

Discusso
MVC ou no MVC?
Atualmente, so classificados como padres MVC (ou variantes)
aqueles padres que obedecem seguinte condio:

Controller responsvel pela entrada de dados do usurio

Caso a View seja responsvel pela entrada do usurio,

assumiremos estar utilizando uma variao MVP

Anlise e Projeto OO com UML e Padres| 15

Variaes MVP e MVC

Por conveno mostraremos verses ativas e
passivas para o Padro MVP

Passive MVP
Supervising Presenter

De fato, segundo
Fowler, o supervising
presenter segue um
estilo de controller.

Indicaes de uso em aplicaes GUI

Ativa: mais indicadas para aplicaes ricas (desktop)

Passiva: Mais indicadas para aplicaes com acoplamento
fraco entre a viso e o modelo
necessitam de uma menor sincronizao Model-View

Anlise e Projeto OO com UML e Padres| 16

Passive MVP
Utilizado em diversas
aplicaes Web

Presenter

View

foco do
padro

Model
associao indireta

Model tem papel

perifrico no padro

associao direta

Responsabilidades:

Presenter: Media View e Model

View: realiza toda a interao com o usurio, possui lgica
de apresentao.
Modelo: representao dos dados e regras de negcio.

Anlise e Projeto OO com UML e Padres| 17

Interao
Descrio:
A View faz requisies por dados ou aes
sobre os dados do modelo.
2. O Presenter recebe as requisies e
repassa para o objeto apropriado do B.
Model para atend-la.
3. O B. Model faz as operaes sobre os
dados e retorna algum tipo de informao
ao Presenter,que por sua vez devolve
informaes para a View.
4. Objetos de modelo na camada de
apresentao (P. Model) podem ser
eventualmente utilizados para auxiliar a
comunicao entre Presenter e View
1.

P. Model 4

1
Presenter
2
Business
Model

Anlise e Projeto OO com UML e Padres| 18

C. Negcio

C. Apresentao

View

Supervising Presenter
foco do
padro

Utilizado em diversas
aplicaes GUI Desktop

Presenter

View

Model
associao indireta

associao direta

Responsabilidades:

Presenter: Media View e Model, possui lgica de

apresentao
View: realiza toda a interao com o usurio
Modelo: representao dos dados e regras de negcio

Similar ao Dolphin MVP, porm enfatiza que o Presenter deve

ter mais responsabilidades (lgica de apresentao)
Anlise e Projeto OO com UML e Padres| 19

Diagrama Sequencia
Supervising Presenter
:Main
inicializa
inicializa

:Model
:View
se cadastra

inicializa

Usuario

:Presenter
se cadastra
Observer

boto

Observer

notifica
atualiza'
modifica viso

processa
notifica
atualiza

Anlise e Projeto OO com UML e Padres| 20

Exerccio
Dado:

A arquitetura do sistema modelada no exerccio anterior

Modelar a camada de Apresentao para uma

aplicao GUI Desktop, utilizando MVP.

Observe que nem todas as interfaces precisam de um

supervising presenter

Anlise e Projeto OO com UML e Padres| 21

Arquitetura Cliente-Servidor

Cliente Web
(Browser)
Internet
Servidor Web

Cliente Web
A comunicao entre cliente e servidor na web feita
utilizando o protocolo HTTP.
Anlise e Projeto OO com UML e Padres| 22

Arquitetura Cliente-Servidor
Via get de uma URL

Cliente Web

Parametros:
- Get (explicitamente)
- Post (implicitamente)

pgina
HTML

Servidor Web

Cliente Web
Anlise e Projeto OO com UML e Padres| 23

Aplicaes Web
Caractersticas

Requisies simples (http)

Pginas dinmicas, sem sincronizao com o Model

Que padro usar?

Anlise e Projeto OO com UML e Padres| 24

Passive View [MVC]

Utilizado em diversas
aplicaes Web

Controller

View

foco do
padro

Model
associao indireta

Model tem papel

perifrico no padro

associao direta

Responsabilidades:

Controller: Media View e Model, possui lgica de

apresentao.
View: realiza toda a interao com o usurio
Modelo: representao dos dados e regras de negcio.

Anlise e Projeto OO com UML e Padres| 25

MVC 2
A aplicao do padro MVC em Aplicaes
Corporativas (web) requer algumas mudanas

MVC 2 = Passive View+ Front Controller

Padro FrontController [Martin Fowler]

Baseado no padro Command (mesma estrutura)

Aplicao especfica camada de Apresentao
Utiliza um controlador como um ponto inicial para todas
requisies. O controlador responsvel por delegar
processamentos, gerenciar vises, etc.

Anlise e Projeto OO com UML e Padres| 26

Diagrama Sequencia
MVC 2
Cliente

Servidor

:Front
Controller

Browser

:Fabrica
Helpers

:Model
Command

servio 1
obter(1)

:Helper1

comando

v2 :View
HttpResponse

servio 2

gera

processa

html
obter(2)

:Helper2
comando

processa

Anlise e Projeto OO com UML e Padres| 27

Exerccio
Dado:

A arquitetura do sistema modelada no exerccio anterior

Modelar a camada de Apresentao para uma

aplicao Web, utilizando MVC 2.

Anlise e Projeto OO com UML e Padres| 28

Frameworks MVC
Existem Diversos frameworks que auxiliam o
desenvolvimento Web de acordo com o padro MVC
Os frameworks Java mais conhecidos so:

JSF
Struts
Spring MVC

Todos provem implementaes para o Front Controller e

indicam formas para a representao dos demais papeis
(View e Model)
Realizao de interfaces do Framework
Arquivos de Configurao

Anlise e Projeto OO com UML e Padres| 29

Struts e JSF
Struts e JSF possuem diversas similaridades

Views -> Pginas JSP

Controller -> Servlet (provido pelo framework)
Presentation Model -> Objetos Java, cujos atributos
representam campos de formulrios

Principais diferenas existem apenas na definio do

Helper-Model

No Struts, eles so representados por duas classes

Helper > Action
P. Model > ActionForm

No JSF, eles so representados em um nica classe

Helper + P. Model -> Managed Bean
Anlise e Projeto OO com UML e Padres| 30

No curso ...
Vamos usar o Play

Baseado no princpio Convention over configuration (ou

coding by convention)
No atrelado ao J2EE
Ser apresentado em detalhes na prxima aula

Anlise e Projeto OO com UML e Padres| 31