Web Dynpro

for ABAP
Elaborada por Roberto Felipe Gritenas

Incluir logo
do cliente

22 de Maio de 2007
 Dados para Logon

• Estaremos utilizando durante este treinamento o ambiente abaixo

mencionado:

• Usuário: TREINA01
• Senha: 123456

2
Diagrama

RFC:
View_Main
LISTA_MATERIAIS

MAKT

ECC 5.0 R/3 – 4.7

3
 Criando Componente Web Dynpro

• Execute a Transação SE80, selecionar o objeto “Web Dynpro

Comp./Inrf.” e escolha um nome para sua aplicação
ZTREINAMENTO_XX.

• Pressione “Enter”
.
4
 Criando Componente Web Dynpro

• Confirme a criação do objeto.

• Preencha os dados referentes a criação da nova Window (janela

composta por Views).

5
 Criando Componente Web Dynpro

• Pode-se observar que foi criada uma estrutura de projeto contendo:

– WINDOW_MAIN – Interface Views
– WINDOW_MAIN – Windows

6
 Importando RFC

• Clicar com o botão direito do mouse sobre nosso projeto e escolha

a opção conforme figura abaixo.

• Clicar sobre o Ícone

7
 Importando RFC

• Selecionar a opção para importar a RFC para uma Controller já

existente.

• Clique sobre o botão Continue.

8
 Importando RFC

• Confirmar opção para importar RFC.

9
 Importando RFC

• Selecionar a função criada.

O Destinantion indica onde a RFC está, caso ela esteja em outro

ambiente.
10
 Importando RFC

• Marque os campos conforme figura abaixo para importar todos os

parâmetros.

• Clique em Continue.

11
 Importando RFC

• Preencha o campo método conforme abaixo, esse será o método

para execução da RFC.
• Clique em Continue

• Clique em

12
 Importando RFC

• A RFC foi importada com sucesso.

• Ative os objetos inerentes ao seu projeto.

13
Criando uma View

14
 Importando RFC para sua View

• Clique duas vezes na View em que usaremos a RFC.

15
Importando RFC

1. Clique na
aba Context

2. Arraste
nossa RFC
para o
Context da
View

Confirme a Copia.

16
Importando RFC

1. Clique na
aba Layout

17
Montando o Layout de sua View

Nome do grupo que organizará seus

componentes de tela

18
Montando o Layout de sua View

Escolha a opção
GridLayout

Preencha com o valor

2

19
Utilizando a RFC em nossa View

Agora estaremos
utilizando a RFC
importada em nossa
View.
Clique com o botão
direito sobre o grupo e
escolha o item
conforme a figura ao
lado.

20
 Utilizando a RFC em nossa View

• Clique em

21
 Utilizando a RFC em nossa View

• Passagem de parâmetros para RFC.

Duplo clique

Confirme a
Criação

22
Montando o Layout de sua View

Clique sobre as
Labels.

Digite o texto
relativo a cada
Label

23
Utilizando a RFC em nossa View

24
Criando a tabela de retorno na View

Clique sobre o
elemento e
arraste para a tela
de layout

25
Criando a tabela de retorno na View

Clique com o
botão direito e
escolha a
opção “Create
Binding” para
ligar nossa
tabela da
View com o
retorno da
RFC

26
 Criando a tabela de retorno na View

• Clique em

Duplo
Clique

27
 Criando a tabela de retorno na View

• Confirme a Criação.

28
Criando um botão de ação

Arraste o componente
botão para tela
29
Criando um botão de ação

Clique no botão
e digite um texto
para exibição

30
Criando Action para o botão criado

Clique no ícone para

criar ação para o clique
no novo botão

31
 Associando clique no botão a execução
da RFC

• Clique sobre a aba “Methods” da View.

• Clique duas vezes sobre o método referente a ação criada.

32
Associando clique no botão a execução
da RFC

33
 Associando clique no botão a execução
da RFC

• Clique sobre o botão .

• Clique sobre a ajuda de pesquisa do item “Componente Name”

34
Associando clique no botão a execução
da RFC

Escolha o
Controller
principal

35
Associando clique no botão a execução
da RFC

Clique

Escolha o método criado

para Execução da RFC

36
 Associando clique no botão a execução
da RFC
• Foi criada uma linha de código no método para execução da RFC.

• Ative seu projeto

37
Incluindo View na janela principal

Clique na Windows
principal

38
Incluindo View na janela principal

Arraste a View
para a Windows
principal.

39
Criando aplicação (URL) para acessar
o projeto.

40
 Criando aplicação (URL) para acessar
o projeto.

• Confirme a criação .

41
 Ativando o projeto/objeto

• Ative seu projeto

42
URL para a aplicação

43
 Testando a aplicação

• Clique com o botão direito sobre a aplicação e em seguida escolha

a opção “Test”.

44
Resultado

45