TAW12_2 - 07 - Web dynpro - introdução

5/9/2018 TAW12_2 - 07 - Web dynpro - introduo

1/25

Web Dynpro: introducaoVlsao geral do capituloo Web Oynpro e um modele de programacao fornecido pela SAP. Ele eimplernentado em Java e ABAP. Ele e adequado para gerar interfaces de usuario(IUs) standard usando uma abordagem declarativa que permite a implernentacaode aplicacoes Web em um periodo minimo de tempo.As vantagens de utilizar 0modelo de programacao Web Dynpro (cornparadoa outros modelos de prograrnacao Web estabelecidos) serao explicadas nestaunidade. Neste contexto, a arquitetura basica e as funcoes-chave do Web Dynproserao resumidas.

Objetivos do capituloNo final deste capitulo, voce devera estar apto a:

Oescrever a abordagem de programacao declarativa utilizada para erial'aplicacoes Web DynproExpliear as vantagens dessa abordagem de metadadosListar os elementos mais importantes que fazern parte de lima aplicucao WebDynpro e que poc1em ser definidos de forma declarariva

Conteudo do capituloLiC;30: Web Dynpro: introducao 206

Exercfcio 13: Web Dynpro: introducao 225

12-11-2009 2009 SAP AG. Todos os direitos reservados. 205~


2/25

Capitulo 7: Web Dynpro: introducao TAW12 2

Licao: Web Dynpro: introducaoVisao geral da lic;aoEsta licao co nte rn urna sintese das funcoes do Web Dynpro. Sao discutidas asprincipais vantagens da utilizacao do Web Dynpro para criar aplicacoes Web.

Objetivos da llcaoNo final desta licao, voce devera estar apro a:

Descrever a abordagem de programacao declarativa utilizada para criaraplicacoes Web DynproExplicar as vantagens dessa abordagem de metadadosListar os elementos mais importantes que fazem parte de uma aplicacao WebDynpro e que podern ser definidos de [01111adeclarativa

Cenario de neg6ciosVoce quer cncontrar a tecnologia que melhor se adapte ao desenvolvimento deaplicacoes Web baseadas em ABAP. Os requisitos para seus projetos sao altavelocidade. baixo custo e IUs padronizaclas. Voce decidiu que ABAP WebDynpro satisfaz suas necessidades. POl' isso, voce quer obter uma sintese inicialdas funcoes do Web Dynpro.

o que e 0Web Oynpro?Do ponto de vista tecnico, SAP Web Dynpro para Java e ABAP e um passorevolucionario no desenvolvimento de interfaces de usuario baseadas na Web. Ecompleramente diferente de qualquer paradigma de design utilizado anteriormentepela SAP c rcprcscnta um grande progresso no desenvolvimento de aplicacoes degestae emprexarial (ERP) baseadas na Web.As aplicacoes Web Dynpro sao criadas com tecnicas de prograrnacao declarativasbaseadas no paradigma do Model View Controller (MVC). Ou seja, voce especificaos elementos de interface do usuario que quer ter no client e de on de esseselementos recuperarao seus dados. Voce tambem define os possiveis caminhos denavegacao de forma declarariva em sua aplicacao. 0 c6digo inteiro para criar ainterface do usuario e , entao. gerado automaticamente em l1l11 framework de tempode execucao standard. Isso 0 libera de tarefas de codificacao repetitivas envolvidasna escrita HTML, tornando-a interativa com JavaScript.o ABAP Web Dynpro esta disponivel desde 0 SAP NetWeaver 2004s (SAPNetWeaver Application Server 7.0). Para desenvolver as entidades da aplicacaoWeb Dynpro, 0 Object ~lavigator (c6digo de transacao SE80) foi ampliado.

~206 2009 SAP AG. Todos os direitos reservados. 12-11-2009


3/25

TAW12 2 Li~ao: Web Dynpro: introducao

o Web Dynpro foi concebido para suportar desenvolvimento estruturado. Asunidades de modularizacao de software sao componentes Web Dynpro que podemser combinadas para criar aplicacoes complexas.

Declaracoes de metamodelo versus codificacaopersonalizadaUma aplicacao Web Dynpro e desenvolvida, utilizando uma abordagem deprogramacao declarativa. Dentro do ABAP Workbench, existem ferramentasespeciais que permitem que voce erie urna representacao abstrata da sua aplicacaoem forma de um metamodelo Web Dynpro. 0 texto fonte necessario e depoisgerado autornaticamente e se ajusta a uma arquitetura standard conhecida porWeb Dynpro Framework.o Web Dynpro Framework permite que voce ins ira 0 texto fonte personalizadoem uma posicao predefinida dentro do codigo gerado.Todas as aplicacoes Web Dynpro sao construidas com base nas mesmas unidadesbasicas. No entanto, mediante a utilizacao de codificacao personalizada, 0framework standard pode ser ampliado para fornecer qualquer 1 ' U I 1 < ; : 3 0 empresarialnecessaria.Nao e necessario tomar todas as decisoes de implementacao no momenta dodesign. E possivel implernentar uma aplicacao Web Dynpro na qual 0 aspectodo. interface do usuario e decidido no momenta da execucao. Isso permite queuma aplicacao altamente flexivel seja escrita sem que seja necessario escreverdiretamente qualquer HTML ou JavaScript.



4/25


C6digogerado

Garante design de apllcacaostandard Garante universalidade

Apropriadas para suporte aferramentas Estrutura da tela e aninhamento

Apropriada para aplicacoesdlnamlcas, orientadas por dados lrnplernentacao de regras comerciais

Naveqacao e tratamento de erros Modificacoes dinarnicas na tela Acesso a services (arquivos, etc.) Fluxo de dados Eventos de portal Dividido em componentes

Figura 134: Declaracoes de metamodelo versus codlficacao personalizada

Cenarios de apllcacao com Web DynproASAP c-~Servidor 1 [\a,-,;~

~ ~ ~ ~ _ _ .__ l c o : _ e l r C l a i ~ /Web Modulos de runcaoService nabilitados o a r a RFC

s ; ; ; ; ' w l L . ~ _ w " _ " _ " " --,RFC

Web service

Tempo de

HTTP

execuyaoASAP Web Dynpro

I3~a,'+Acncacao lV'lIXC

Web ':)'yTI.""Iro

ASAPWorkbench

Apilca9ao WebDynpro s l \p N e I W e a v e rPortal

Figura 135: Cenarios de aplicacao com Web Oynpro



5/25

TAW12 2 Licao: Web Dynpro: introducao

As aplicacoes Web Dynpro podem acessar diferentes tipos de fontes de dados:

A partir de uma aplicacao ABAP Web Dynpro, todos os tipos decomponentes reuti I izaveis podem ser tratados diretamente (por exemplo,m6dulos de funcao ou metodos). E ate meSl110possivel acessar 0 banco dedados mediante ABAP SELECT. No entanto. isso leva a urna confusao entrea logica de processamento e a 16gica empresarial que deve ser evitada.Os Web Services podem ser utilizados logo que um Web Service ClientObject tenha sido gerado.o SAP Java Connector pode ser utilizado para chamar metodos de EnterpriseJavaBeans localizados no SAP nEE Engine.

Os objetos-modelo ainda nao sao suportados no ABAP Web Dynpro. A melhorforma de entidades reutilizaveis encapsularem urna logica empresarial e por meioda criacao de classes ABAP que contenharn 0 texto fonte. Tambern e possiveldesenvolver componentes Web Dynpro sern interface cle usuario que oferecarnsomente funcoes reutilizaveis. Esses componentes podem clepois ser acessadospor outros componentes Web Dynpro, mediante a reutilizacao do componente.

Vantagens do Web Oynproo objetivo principal do Web Dynpro e permitir que os desenvolvedores deaplicacao criem aplicacoes Web eficazes com 0 minimo esforco. utilizandoferramentas clescritivas em lim processo cle clesenvolvimento estruturado.Uma das diretrizes cla filosofia Web Dynpro e: quanta menos linhas cle c6digoescritas a mao, melhor, 0 Web Dynpro busca esse objetivo de duas f01111as.

o Web Dynpro utiliza um metamoclelo declarativo e de linguagem neutrapara definir interfaces do usuario. 0 ambiente de desenvolvimento gera 0texto fonte necessario com base nesta definicao abstrata. 0 codigo escrito amao aincla existe, mas esta restrito ao que e necessario para manipular dadoscornerciais, nao a interface do usuario.o Web Dynpro fornece caracteristicas tecnicas, como suporte parainternacionalizacao, interacao sem oscilacao de tela (flicker-free) e LImaseparacao clara entre a 16gica empresarial e a interface do usuario. Essaseparacao e alcancada por meio de lima implernentacao modificada doparadigma de design Model View Controller (MVe).

Uma vez que as tarefas repetitivas de codificacao de interface do usuario tenharnsido eliminaclas, 0 desenvolvedor pode concentrar sua atencao no fluxo de dadoscornerciais pela aplicacao.As aplicacoes Web Dynpro podem ser executadas em Lima serie de dispositivose em varies tipos cle redes - lima caracteristica importante para cenarioscolaborativos.



6/25

Capitulo 7: Web Dynpro: lntroducao TAW12 2

m Minimizar a codificacao, maximizar 0designIII Separar layout e Ioqicaiii! Suportar sistemas back-end arbitrariosm Suportar reutilizacao de componentesm Suportar Web Services e liqacao de dados

Ferramentas (Metadad~\hW e b O yn pro - 1 We b D y np ro , I~~~~./

m Executar em mLiltiplas plataformas

~ Atua!iza=:;:oes de tela sern recarregamentos depflg~na.

m Dinamlca do lado do client!m Perfoffnance rnodrants admuristracao de cachem : Suporte a acesaibilidade de accrco com a Secao

608 da legisla


7/25


Os componentes Web Dynpro sao containers para outras entidades relacionadasa interface do usuario e ao programa Web Dynpro.As entidades relacionadas a interface do usuario sao janelas e visoes. 0 layout deuma visao e a parte retangular de uma pagina exibida por um client (por exemplo,um browser). A visao contem elementos de interface do usuario, tais comocampos de entrada e botoes. A pagina completa enviada para 0 client pode serinstalada por somente uma visao, mas tambem pode ser uma cornbinacao dernultiplas visoes, As combinacoes possiveis de visoes e 0 fluxo entre visoes saodefinidas em uma janela. Uma janela pode conter qualquer numero de visoes.Uma visao pode ser incorporada em qualquer numero de janelas.o texto fonte Web Dynpro esta localizado nos controladores Web Dynpro. 0annazenamento hierarquico das variaveis globais de controladores e denominadocontexto.Os componentes Web Dynpro podem ser abordados de tres formas diferentes:

Utilizando LImaaplicacao Web Dynpro, lim componente Web Dynpro podeser relacionado a um URL, que pode ser chamado a partir de um Webbrowser ou de outro Web Dynpro Client.Ao reutilizar 0 componente Web Dynpro como um subcomponente, ainterface visual de um componente Web Dynpro pode ser combinada com asentidades visuais do componente principal para criar a IU.Ao reutilizar 0 componente Web Dynpro como um subcornponente, todos osmetodos e dados definidos na interface de programacao podem ser acessadospelo componente principal.



8/25


Mapeamento de contexte e liga~ao de dados

Figura 138: Contexto e transporte de dadosAs variaveis definidas em um contexto de controlador Web Dynpro podemser referenciadas a partir de outros controladores Web Dynpro. Isso se chamamapeamento de contexto. Permite que voce compartilhe atributos comuns entrediferentes control adores, de forma que nao seja necessario copiar esses atributosentre contextos.o valor de elementos de IU que perrnitem uma entrada do usuario devern serconectados aos atributos de contexto do controlador correspondenre. Isso se chamaligacao de dados. Mediante a ligacao de dados, estabelece-se lim transporte c1edaclos automatico entre os elementos c1e IU e os atri butos de contexte.Combinando esses dois conceitos, 0 transporte de dados entre elementos de IUlocal izados em diferentes visoes po de ser c1efin ido de modo rnerarncnte declarativo.



9/25

TAW12 2 t.icao: Web Dynpro: introducao

,4,CU\SS&. Dr~SSf-'J

rControl.~~.?r~e compo~n..e~n):.=s_~, " II ; . ..~: : : : : : : : : : . : . : : : : : : : : I I ~ ' : : " , : ' ; ' , i . . . ~ ~ , ( ,. . , , , ~ , ' ~ ~ ~ 'conte;; ' ,) " > i

.:: '.it RESERVASi:':;\'C"'-''-----~..L,f'';i '. BOOK'Di'.USTC

C.LASS

Controlador de visae

A . CARRID" ' ~ ' - - A .CON f'~D

Compone'nte Web Dy np r oc ~ J Colecao de nos mapeados ..................... ~Relac;ao de

rnapeamentoocolecao de nos da

origem do mapeamento

Figura 139: Mapeamento de contextoo mapeamento de contexto permite que lll11 no de contexto em um controladorseja fornccido automaticamente com dados de 11111 no de contexto correspondenteem Dutro controlador. Esse e 0 mecanisme primario para compartilhar dadosentre controladores.Quando dois controladores no meSI110 componente compartilham dados medianteuma relacao de mapearnento, isso e conhecido como rnapeamento interno.o no de contexte que funciona como fonte de dados e conhecido por no de origemde mapcamenro eo no de contexte que e mapeado e conhecido por no mapeado.() mupcamento entre contcxtos de controlador, localizados em diferentescomponcntcs Web Dynpro. c conhecido como mapeamento externo.

Observacao: 0 mapearnenro externo nao sera tratado nesta licao.Para que seja estabelecida urna relacao de mapeamento, e necessario executaras scg uinte s e tapas prim eiro :E nccessario que exista urn n6 no contexto do controlador que funcione

C0l110 a origem de mapeamento. Esse no na o precisa ter nos inferiores nernatributos declarados.o controlador da origem do mapeamento nao deve ser um controlador devisoes.o controlador que contern 0 no mapeado deve declarar a utilizacao docontrolaclor da origem de mapeamento como um controlador utilizado.



10/25


Contexto docontrolador decom ponentes

Contexto docontrolador de vis6es

A CU~::THJA CL_t~SS

~ f'!.' f,liZ..voos l ~ESERVAS

.A8('.)K":

.A CU,OTC

.A.CLY'~.A.::'1'.SS!;

.ACARc:.: ic .

..:~voos-,' RESERVAS,'A BC>()K:;'

---- Liga ..ao dedaaos ... ... .. Mapeamento de contexteFigura 140: Como colocar dados na tela: Ligac;:aode dadosA liga~ao de dados e 0meio pelo qual os dados sao transportados aurornaticamcntede urn contexto de controlador de visoes para um elemento de ]U no respectivelayout, e vice-versa.Voce nao deve vincular elementos de IU a n6s de contexto nem a atributosdefi nidos em outro controlador. Os elementos de IU sao exclusi vamente docontrolaclor de visoes em que estao declarados.o processo de ligacao de dados separa 0 objeto de e le rnento de interface dousuario do codigo de aplicacao no controlador de visoes. Par isso. para manipularcaracteristicas de elementos de interface do usuario. 0 c6digo cia aplicac.to 110controlaclor de visoes s6 necessita manipular os valores do no cle contexte eatributos, aos quais os elementos de interface do usuario estao vinculados. 0 \\"t'bDynpro Framework executa, entao, as duas tarefas seguintes:

o transporte de daclos do atributo de contexto para 0 elernento de IL duranteo processo de renderizacao de telas.A realimentacao de atributo de contexto a partir do elernento de IU apos aentrada dos dados pelo usuario e 0 circuito do servidor seguinre sao iniciados.Os valores inseridos pelo usuario sao automaticamente converr idos everificados quanta a conformidade de tipo. Se ocorrer urn erro. sera ex ibidauma mensa gem.



11/25

TAW12 2 Li1;30: Web Dynpro: mtroducao

A lig ac ao de dados e urn instrumento e ficaz. um a ve z que e p o ssiv e l vincular na oso 0 valor de um elernento de IU a um atributo de contexte, mas tarnbem outrascaracteristicas de IU, como a visibilidade. Assim, as caracteristicas do elementode IU podem ser manipuladas a partir do controlador de visoes. atuando ematributos de contexto.Naveqacao entre vis6es

FROM_START_VIEW

~ Ponto de saida

Link de naveqacao

Se voce quiser definir a naveqacao entre duas visoes, precise criarpontos de saida e pontos de entrada para cada visao.

Voce podera entao utilizar links de naveqacao para determinar 0processo de naveqacao,

Figura 141: Naveqacao entre vis6esA navegacao entre visoes e acionada pela ativacao de pontos de salda. Aativacao de Lim ponto de saida causa a criacao de urn evento cit? navegacao.Eventos de navegacao sao eventos especiais assincronos posicionados em umafila de navegacao. E possivel ativar varies pontos de saida a pan ir de uma visao.lsso pode ser utilizado para definir a [U seguinte. que c Iorm.nla por variasvisoes. A fila de navegacao e processada em detenninado momenta na Case deprocessamento Web Dynpro. Ate esse memento, a pilha de navegacao pode serampliada, ativando pontos de saida adicionais. Tambern e possive l eliminar a pilhade navegacao completa. Os pontos de saida devem ser denominados de acordocom a acao que causou a navegacao fora da visao atual.Pontes de entrada sao metodos de manipulador de evenios esr-eriais que assinarneventos de navegacao criados quando pontos de saida sao ativados. Metodos deponto de entrada so sao chamados se a fi la de navegacao e processada. lsso soacontece quando as visoes no conjunto atual de visoes ativarem sells POl1toS desaida e nao tenham ocorrido erros de validacao que causem 0 cancelamento danavegacao. Os pontos de entrada devem ser denorninados de acordo com 0motivode exibicao da visao.



12/25


Os pontos de saida e de entrada sao interligados utilizando links de navegacao.Em termos tecnicos, vincular um ponto de entrada a lim ponto de saida significaregistrar 0 metoda de manipulador de eventos do ponto de entrada no even to denavegacao, chamado mediante a ativacao de um ponto de saidaOs pontos de saida e os metodos de manipulador de eventos relativos aos pontos deentrada podem ter parametres, pennitindo que voce transfira dados entre as visoes.Janelas e vis6es embutidas

Janela

Uma janela e 0conjunto de todas as possiveis vis6es que podem cornpor umatela visivel.

Uma janela pode ter zero ou mais vis6es incorporadas. Uma visao contemelernentos de IU do tipo ViewContainerUlelement. 1550'permite vis6es de aninhamento em uma janela.

Urn ViewContainerUlelement 56 pode exibir uma visao de cada vez.Figura 142: Janelas e vis6es embutidasUma Janda define quais visoes sao exibidas elll qual cornbinacao e como acornbinacao de visces pode ser modificada, ativando pontos de saida. Portanto,quando voce cria uma janela, define tres coisas:

Todas as visoes possiveis que poderiam existir na interface visual docomponente devern ser incorporadas na janela.Se for necessario exibir varias visoes em paralelo, 0 layout e a posicaodessas visoes sao definidos mediante uma visao especial que C011temViewContainerUlelements em seu layout. Essa vi sao de containere incorporada na janela e, dentro de cada area definida pOI' umViewContainerUlelement, todas as visoes possiveis para essa area de visaoestao integradas (integracao embutida). Para cada ViewContainerUlelementexiste uma visao default na inicializacao.E necessario definir os links de navegacao entre as diferentes visoes.

~216 12-11-20092009 SAP AG. Todos as direitos reservados.


13/25

TAW12 2 Licao: Web Dynpro: lntroducao

S6 pode ser exibida LImavisao de cada vez na area de visao. Os links de navegacaodevem ser definidos entre visoes para que 0 conteudo de uma area de visao sejasubstituido.As areas de vi sao podem ser eliminadas, criando uma visao vazia, cujo ponto deentrada responda a U111 even to de navegacao apropriado.

Conjunto de vis6es1

Conjunto de vis6es2Janela Janela

IEMPTYVIEW II COMBI_RESUL T_VIEWli I I

Conjunto de vis6es3

Janela

.............................................................. _ - - _ ....COMBI_RESULT_VIEW:

0 subconjunto de vis6es visiveis em qualquer momenta e conhecido como A naveqacao faz com que vis6es especificas dentro de uma area de visao sejamsubstituidas ou pode fazer surgir todas as combinacoes de visao dentro dajanela.

Figura 143: Conjunto de vis6esOs pontos de saida sao acionadores que levam LIma area de visao a conter umavisao especifica.Para deterrninada definicao da janela em que varias visoes estao incorporadas emareas de visao, e possivel que muitas permutacoes de visoes estejam visiveis. Apermutacao visivel depende dos links de navegacao que 0 usuario segue.o subconjunto de visces visiveis em qualquer momenta e conhecido como umconjunto de visoes.



14/25


Arquitetura Web Dynpro: relacao entre entidades WebDynproMode! View ControHer (MVC)

Query

Une as camadas de interacaoempresarial e de usuario, Todoo processamento interrnediarioe executa do aqui.

Gera os dados deaplicacao sem considerarcomo serao exibidos.

Resposta

I Camada de lnteracao empresar ial1.---------------,I Camada de interacao de usuar!oIIIICamada de ligac;:ao

aplicacao sem considerarcomo estes foramgerados.

Exibe os dados da

Figura 144: Model View Controller (MVC)

o Web Dynpro da SAP e criado com base no paradigma de design ModelView Controller (MVC). 0MVC foi originalmente inventado pelo designer desoftware noruegues Trygve Reenskaug enquanto trabalbava para a Xerox PARCno final da decada de 70. A primeira implementacao desse paradigms de designfoi COIll a apresentacao da linguagem de prograrnacao Smalltalk-80.o MVC foi lim paradigma de design revolucionario porque foi 0 primeiro adescrever componentes de software em termos de:

responsabilidades funcionais que cada urn deve cumprirprotocolos de mensagem, aos quais cada componente deve responder

A SAP modificou e ampliou a especificacao MVC original para criar 0 set deferramentas Web Dynpro.



15/25

TAW12 2 t.lcao: Web Dynpro: introducao

Arquitetura do componente Web DynproVisivel

externamente- - - _ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - .. Visivel r ;~...:._~c:........ ~internarnente :

Contern

Pontos

; w~ ~~ w ~.:

; 1 ~ _ 1t I Janela ~~;;olltrol~L1or de !:I dnea\.: + ~.~~r~.=.contern A \ ( ; Declaracoes de utilizacaor , = i \ : ~ ~. .; r t " ]; , wt;ontro!ador I :: ' .Conlrolad;;"g:,% d ' . .J I: , . I '>


16/25


Visivelexternamente

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - _ - - - - - - - - - - - - - - - - - - - - - - - - - - _ - - - - _ -

Contern , .. , Controlador!c: 1 L , . . , . O ' de componentes .IiWbControlado[ r 1 @ L~I de janf'las i :. ~_t: ;';L._--,-~L--{MT....; /c ~ ~ ; ~ ~ . i l \ . t : : : . ; ~ : , ; ; ; , ' ; ; = ~ : : : : a , o e sr . . . : : . . .t4~(.. .i j de utllizacao

: q;nControlador;~I Layo~t ~ de vis6es I ;de visao r r--. io :

~--ii=---:~ ao A> :

____..Acessos

~.:pPontos@

Metodos

. . . . .. . .Contexte

Co L6gicaempresarialFigura 146: Entidades Web Oynpro visiveis internamente (2)o controlador de componentes funciona como urn controlador de todos oscomponentes. A logica do programa relacionada somente a determinada visao (porexemplo, a verificacao de entrada do usuario), deve ser codificada no controladorde visoes relaeionado. As declaracoes de utilizacao entre controladores permitemque voce acesse os dados de contexto e metodos do controlador declarado(controlador utilizado). Urn controlador de visoes nao pode ser declarado comocontrolador utilizado para outros control adores, uma vez que isso violaria as boaspraticas de programacao (paradigma de prograrnacao MVC).A logica empresarial nao cleve fazer patte do componente Web Dynpro, mas cleveser definida fora do componente para tel' uma alta capacidade de reutilizacao. Epreferivel que as classes ABAP sejam utilizadas para encapsular 0 texto fonterelacionado.



17/25


Visivelexternamente

- - - - - ~ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -VisivelinternamenteIiI I"Contem. - - - ~Acesso

Pontos

Metodos: : ' - : & .. . .

Contexte

_ w~ _&& ~ ~ ~ ~ ....... Ccntrolador-===~------c..:/ de componentes~ontrolad~r 1 ~ 1 f !

Janela ' , de JanGlcd : Ic ~ ~ ; ~ ; ; ; l ~ ~ ~ C : ; : ; L ~ 7 J : : ; : : : : 6 e s: . . . . . . l , t l . . . . . . . ; . . .+~.: de ullllzao;ao~. Layout ~ontr~lacior L . - . - ~ Controlado-

de v isao " " 1 1 " ~ vboe~.. personalizado~A ... .~ . . . " ~&"""""""""'"

L6gicaell1presarialc ; om po n en te Web 0 y n proFigura 147: Entidades Web Dynpro visiveis internamente (3)Custom controllers sao controladores opcionais que devern ser definidos pelodesenvolvedor. Esses controladores podem ser utilizados para modularizarconteudo do componente. Por exemplo, os custom controllers podern servir comocontroladores locais para algumas visoes ou podem ser utilizados para encapsulara iogica que pertence a deterrninada classe de modelo (lcgica ernpresarial). Issopermite que voce reduza 0 couteudo do controlador de componentes. alimentandosubfuncoes.

: , , ~Interface do c0ll1por:. ::.en"' t. ;:_2 - ,r--====::;--] Controlador

----------------~

Visivel ! . . _ ; ~ .J=~internamente :

Visivelexternamente

Contern, ._____.Acesso

~.

~0k'Pontos@

Metodos

: - - - a'-AContexto

de interface~""U"'~",I

Componentes

IL6gica Iempresarial

Figura 148: Entidades Web Dynpro visiveis externamente'C om po nen t e We bOy 1 1 pro'"-- _

12-11-2009 2009 SAP AG ..Todos os direitos reservados. 221~


18/25


Se lim componente Web Dynpro (componente externo) necessitar de acesso aoutro componente Web Dynpro (componente interne), 0 cornponente externopodera declarar a utilizacao do componente interno. Depois, e criada uma instanciade utilizacao do componente especifico e 0 componente externo aces sa as funcoesdo componente interno mediante 0 controlador de interface de componentes.As unicas partes de urn componente Web Dynpro que estao visiveis ao usuario saoo controlador de interface e as visoes de interface.

Todos os componentes Web Dynpro tern somente um controlador deinterface. Mediante um controlador de interface, dados, metodos emanipuladores de eventos podem ser expostos a outros componentes.As visoes de interface representam a interface visual de urn componente WebDynpro. Existe uma relacao urn para um entre uma janela e uma visao deinterface. Cada vez que uma janela e definida, e gerada aurornaticamenteLIma visao de interface relacionada que torn a a janela acessivel a partirdo exterior do componente. A visao de interface so mostra ao usuario docomponente os pontos de entrada e de saida para os quais a propriedadeinterface esta ativada. Os metodos e os dados de contexto da janela nao saoacessiveis da visao de interface relacionada.Se 0 cornponente nao tiver visoes, nao sera necessario ter janelas. Nessccaso, 0 cornponente nao implernentara uma visao de interface. Cornponentessem interface visual sao conhecidos como componentes sem interface .

Urna aplicacao e urn ponto de entrada a urn cornponente Web Dynpro . Urna aplicacao pode ser enderecada por urn URL.

Visivel

r;-Autom~tic~~e~cnad-;-com ~ u m pontOd~e--'-'-'1II entrada do tipo 'inicializacao', chamado P8drao.,II! Uma aplicacao e um URL associado a este

I ponto de entrada especial na visao de interfaceInteriace do cornoonente . ': . . = : = ~ ~ o : : : : =. ]visao ,nterface~cei de Interfacexternamente ........@ - - ~ - - - - - - - - - - - - - - - - - - ~ - - - - - - - -Visivel

internamente ;1 _!_ p~. . . m m . . . m m ' = i 1 . : : , : : : : !~j/j~

de componentel: .:tJ_.'@ ::Figura 149: Apllcacao Web OynproUrna aplicacao Web Dynpro e urn ponto de acesso a um componente Web Dynproe e a unica entidade Web Dynpro que po de ser acessada mediante um URL.



19/25

TAW12 2 l.icao: Web Oynpro: introducao

Muitas vezes (mas nao sempre) existe uma relacao LImpara urn entre uma visaode interface e uma aplicacao.Da mesrna forma que a funcionalidade em LImpool de modules ABAP pode seracessada por meio da definicao de varies codigos de transacao, tambem as funcoesde LImunico componente Web Dynpro podem ser acessadas definindo variasaplicacces, cada uma abordando uma visao de interface diferente e/ou 11111 pontode entrada diferente da vi sao de interface.Para definir LIma aplicacao Web Dynpro , voce deve especificar:

o cornponente a ser chamado. Esse componente e , entao, conhecido comocomponente raizA visao de interface do cornponentc raiz a ser usado. As visoes default destavisao de interface definern 0 conjunto de visoes default.Qual 0 ponto de entrada ira funcionar como 0 ponto de acesso para as visoesde interface nomeadas (esse ponto de entrada deve ser do tipo Inicializacaos.



20/25




21/25

TAW12 2 l.icao: Web Dynpro: introducao

Exercicio 13: Web Dynpro: introducaoObjetivo dos exerciciosNo final deste exercicio, devera estar apto a:

Criar um componente Web Dynpro com uma janela Web Dynpro que contemuma unica visao Web OynproPosicionar um elemento de interface do usuario simples no layout da ViS30 eprocessar as respectivas caracteristicasCriar LImaaplicacao Web Dynpro para tornar a visao disponivel aos usuaries

Cenario de neg6ciosVoce quer desenvolver lima aplicacao Web Dynpro. Voce comecara por criar asentidades Web Oynpro necessarias para uma aplicacao que mostra uma visao comum campo de texto simples.Modelo: NenhumSOiUI, '30: NET3 10 INTR STarefa 1:Crie lim pacote que contenha todos os objetos do rcpositorio que voce iradesenvolver.I. Crie 0 pacote ZNET310_##. Atribua 0 componente da aplicacao BC-WD e

o componente de software HOME.Tarefa 2:Crie lim componente Web Dynpro com 1I11lJ janela Web Dynpro.I. erie 0 cornponente Web Oynpro Z:\ET310_I'\TR_## ~:U1l1urna janela

principal MAIN_ \VINDOW.

Continua 110 proxima pagina



22/25


2. Quais outras entidades Web Dynpro foram criadas automaticamente nestaetapa?

T a r e f a 3 :erie LIma visao Web Dynpro com LImelemento TEXTVIEW simples e integreessa visao na janela principal.1 . erie lima visao Web Dynpro (nome proposto: MAIN_ VIEW) em seu

componente.2. erie um elemento de T U simples do tipo TEXTVIEW (nome proposto:

TEXT_VIEW _1) no layout da visao e processe as caracteristicas do mesmo.3. Atualize 0 texto a ser exibido no elemento TEXTVIEW. Voce pode querer

modificar algumas ourras caracteristicas do elemento ever 0 resultado navisualizacao de layout.

4. lniegre a visao Web Dynpro na janela Web Dynpro.

T a r e f a 4 :eric urna apl icacao Web Dynpro para acessar 0 sell componente Web Dynpro eteste a aplicacao.I. eric uma aplicacao Web Dynpro (nome proposto: ZNET310_INTR_##)

que acessa a janela principal do sell componente Web Dynpro.Ativc 0 componente Web Dynpro c tcste a aplicacao Web Oynpro.



23/25

TAW12 2 t.lcao: Web Dynpro: introducao

Solucac 13: Web Dynpro: introducaoTarefa 1:Crie 11111 pacote que contenha todos os objetos do reposit6rio que voce iradesenvolver.I. Crie 0 pacote ZNET310_##. Atribua 0 componente da aplicacao BC-WD e

o cornponente de software HOME.a) Execute essa etapa como ja tem feito tantas vezes antes (assim

esperamos).Tarefa 2:Crie lim componente Web Dynpro com lima janela Web Dynpro.1. Crie 0 componente Web Dynpro ZNET310_INTR_## com lima janela

principal MAIN_ WINDOW.a) Na area de navegacao, abra 0 menu de contexto para 0 pacote e

selecione Criar - WebDynpro - Componente Wel-Dynpro (interface).b) Na caixa de dialogo, ins ira 0 nome do componente, uma descricao e 0

nome da janela principal.2. Quais ourras entidades Web Dynpro foram criadas automaticamente nesta

etapa?Resposta:

Um controlador de componentesUrn controlador de interfaceUma visao de interface para a janela com a respectiva interface deABAP Objects ZIWCI_NET310_INTR_##

Tarefa 3:Crie uma visao Web Dynpro com urn elemento TEXTVIEW simples e integreessa visao na janela principal.I. erie lima visao Web Dynpro (nome proposto: MAIN _VIEW) em sellcomponente.

a) No menu de contexto para 0 componente Web Dynpro, selecione Criar- Visdo.

b) Insira 0 nome da visao e lima breve descricao.

Con! inua na proximo pagina



24/25

Capitulo 7: Web Dynpro: lntroducao TAWi2 2

2. Crie lim elemento de IU simples do tipo TEXTVIE\V (nome proposto:TEXT_ VIE\V_l) no layout da visao e processe as caracteristicas do mesmo.a) Processe a sua visao Web Dynpro MAIN _ VIEW e abra a ficha de

registro Layout.b) Na exibicao da hierarquia do elemento de IU (canto superior direito),

abra 0 menu do contexto para ROOTUIELEMENTCONTAINER eselecione Inserir elemento,

c) Insira 0 nome do elemento e 0 tipo de elemento: TEXTVIEW.3. Atualize 0 texto a ser exibido no elemento TEXTVIEW. Voce poc!e querer

modificar algumas outras caracteristicas do elemento ever 0 resultado navisualizacao de layout.a) Clique duas vezes no elemento TEXTVIEW na hierarquia de elementos

de IU.b) Na lista de caracteristicas (abaixo da hierarquia de elementos de IU),

atualize 0 texto no campo de texto.4. Integre a visao Web Dynpro najanela Web Dynpro.

a) Processe a janela Web Dynpro e abra a ficha de registro Jane/a.b) Na estrutura de janelas, abra 0 menu de contexto para a janela Web

Dynpro e selecione Incorporar visdo .c) Insira 0 nome da visao na caixa de dialogo.

Tarefa 4:Crie uma aplicacao Web Dynpro para acessar 0 seu componente Web Dynpro eteste a ap Iicacao.I. Crie uma aplicacao Web Oynpro (nome proposto: ZNET310_I\TR_##)

que acessa a janela principal do sell componente Web Dynpro.a) Na area de navegacao, abra 0 menu de contexto para () :-;ClI cornponente

Web Dynpro e selecione erial' - - - - > Aplicacao Web Dynpro.b) Na caixa cle dialogo, verifique 0 nome da aplicacao (0 mesmo do

componente) e insira uma descricao.2. Ative 0 componente Web Dynpro e teste a aplicacao Web D, npro.

a) Abra 0 Componente Web Dynpro e ative 0 mesmo.b) Abra a Aplicacao Web Dynpro e teste-a.



25/25

TAW12 2 l.icao: Web Dynpro: introducao

Resumo da li~aoVoce agora deve estar apro a:

Descrever a abordagem de programacao declarativa utilizada para criaraplicacoes Web DynproExplicar as vantagens dessa abordagern de metadadosListar os elementos mais importantes que fazern parte de 11l11aaplicacao 'NebDynpro e que podem ser definidos de forma declarative


Documents

TAW12_2 - 07 - Web dynpro - introdução