Skip to content

Commit 452f4fb

Browse files
authored
Update hello_world.md
1 parent d17e789 commit 452f4fb

1 file changed

Lines changed: 40 additions & 40 deletions

File tree

docs/get_started/hello_world.md

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ outline: [2, 4]
55

66
Just copy the following class into your system:
77

8-
Build a class:
98
```abap
109
CLASS zcl_app_hello_world DEFINITION PUBLIC.
1110
PUBLIC SECTION.
@@ -24,7 +23,27 @@ Go back to the landing page in your browser and enter `ZCL_APP_HELLO_WORLD` to l
2423
While the HTTP handler has to distinguish between Standard ABAP and ABAP for Cloud, the apps themselves are independent. You're free to choose whether to build your apps with ABAP Cloud compatibility.
2524
:::
2625

27-
### Idea
26+
### View Display
27+
Let's add a view to show some text:
28+
```abap
29+
CLASS zcl_app_hello_world DEFINITION PUBLIC.
30+
PUBLIC SECTION.
31+
INTERFACES z2ui5_if_app.
32+
ENDCLASS.
33+
34+
CLASS zcl_app_hello_world IMPLEMENTATION.
35+
METHOD z2ui5_if_app~main.
36+
37+
DATA(view) = z2ui5_cl_xml_view=>factory(
38+
)->page( `abap2UI5 - Hello World`
39+
)->text( `My Text` ).
40+
client->view_display( view->stringify( ) ).
41+
42+
ENDMETHOD.
43+
ENDCLASS.
44+
```
45+
46+
### Info
2847
abap2UI5 follows a thin-frontend model: the browser only renders UI5 views, while all logic, state, and data handling stay in ABAP on the server. Three ideas to keep in mind before writing code:
2948

3049
- **One method, many calls.** The framework calls your app's `main` method on every roundtrip — on the initial start *and* after every user interaction (button press, input change, navigation).
@@ -43,8 +62,9 @@ The `client` object is your only entry point into the framework. Use it to show
4362

4463
*For a deeper look at the lifecycle and framework internals, see [How It All Works](/technical/how_it_all_works) and [Concept](/technical/concept).*
4564

46-
### View Display
47-
Let's add a view to show some text:
65+
### Events
66+
67+
Let's extend the code with some event handling:
4868
```abap
4969
CLASS zcl_app_hello_world DEFINITION PUBLIC.
5070
PUBLIC SECTION.
@@ -54,16 +74,25 @@ ENDCLASS.
5474
CLASS zcl_app_hello_world IMPLEMENTATION.
5575
METHOD z2ui5_if_app~main.
5676
57-
DATA(view) = z2ui5_cl_xml_view=>factory(
58-
)->page( `abap2UI5 - Hello World`
59-
)->text( `My Text` ).
60-
client->view_display( view->stringify( ) ).
77+
IF client->check_on_init( ).
78+
79+
DATA(view) = z2ui5_cl_xml_view=>factory(
80+
)->page( `abap2UI5 - Hello World`
81+
)->text( `My Text`
82+
)->button( text = `post` press = client->_event( `POST` ) ).
83+
client->view_display( view->stringify( ) ).
84+
85+
ELSEIF client->check_on_event( `POST` ).
86+
87+
client->message_box_display( `Hello World!` ).
88+
89+
ENDIF.
6190
6291
ENDMETHOD.
6392
ENDCLASS.
6493
```
6594

66-
### Event Handler
95+
### Info
6796
The framework calls the `main` method on every roundtrip — on initialization and after every user interaction (button press, input submit, etc.):
6897

6998
```text
@@ -78,41 +107,12 @@ The framework calls the `main` method on every roundtrip — on initialization a
78107
└─────────┘ └──────────┘ └──────────┘
79108
```
80109

81-
To distinguish between lifecycle events, use `CASE abap_true`:
110+
To distinguish between lifecycle events, check for the following events:
82111

83112
- `client->check_on_init( )` — first call when the app starts
84113
- `client->check_on_event( )` — user triggered an event (e.g., button press)
85-
- `client->check_on_navigated( )` — returned from another app via navigation
86-
87-
Each `check_*` method returns `abap_true` only for its specific phase, so `CASE abap_true` acts as a dispatcher:
88-
```abap
89-
CLASS zcl_app_hello_world DEFINITION PUBLIC.
90-
PUBLIC SECTION.
91-
INTERFACES z2ui5_if_app.
92-
ENDCLASS.
93-
94-
CLASS zcl_app_hello_world IMPLEMENTATION.
95-
METHOD z2ui5_if_app~main.
96-
97-
CASE abap_true.
98-
99-
WHEN client->check_on_init( ).
100-
101-
DATA(view) = z2ui5_cl_xml_view=>factory(
102-
)->page( `abap2UI5 - Hello World`
103-
)->text( `My Text`
104-
)->button( text = `post` press = client->_event( `POST` ) ).
105-
client->view_display( view->stringify( ) ).
106-
107-
WHEN client->check_on_event( `POST` ).
108-
109-
client->message_box_display( `Hello World!` ).
110-
111-
ENDCASE.
112114

113-
ENDMETHOD.
114-
ENDCLASS.
115-
```
115+
Each `check_*` method returns `abap_true` only for its specific phase, so is acts as a dispatcher:
116116

117117
### Data Flow
118118
Finally, add a public attribute to send data to the backend:

0 commit comments

Comments
 (0)