Skip to content

Commit 2105812

Browse files
oblomov-devclaude
andauthored
Add 01/02 samples for toggleBy, expandInlineIcons and MessageManager (#688)
Three minimalist demos, one per recent abap2UI5 framework addition: - app 465 (More - Popover Toggle): toggles a Popover open/closed via follow_up_action with cs_event-control_by_id and the new whitelisted toggleBy method, anchored to the pressed button's DOM ref ($event.oSource.sId) - the controller pattern oPopover.openBy(oButton) / oPopover.close(). - app 466 (More - MessageStrip Inline Icons): requires the curated formatter module and binds a plain string with %%icon:sap-icon://...%% placeholders through Formatter.expandInlineIcons, rendered by a MessageStrip with enableFormattedText. - app 467 (More - Message Manager): drives an ABAP message table into the central message model via the invisible z2ui5.cc.MessageManager companion control; the app-authored Error targets the Name field and the collected messages show in a List bound to the message> model. Regenerated the basic overview catalog (npm run launchpad); abaplint 0 issues, check-agents-structure clean. Claude-Session: https://claude.ai/code/session_01M4yuDTkJkCrG37W7tpPL6s Co-authored-by: Claude <noreply@anthropic.com>
1 parent b3ba885 commit 2105812

7 files changed

Lines changed: 311 additions & 0 deletions
Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
CLASS z2ui5_cl_demo_app_465 DEFINITION PUBLIC.
2+
3+
PUBLIC SECTION.
4+
INTERFACES z2ui5_if_app.
5+
6+
PROTECTED SECTION.
7+
DATA client TYPE REF TO z2ui5_if_client.
8+
9+
METHODS view_display.
10+
METHODS on_event.
11+
12+
PRIVATE SECTION.
13+
ENDCLASS.
14+
15+
16+
CLASS z2ui5_cl_demo_app_465 IMPLEMENTATION.
17+
18+
METHOD z2ui5_if_app~main.
19+
20+
me->client = client.
21+
IF client->check_on_init( ).
22+
view_display( ).
23+
ELSE.
24+
on_event( ).
25+
ENDIF.
26+
27+
ENDMETHOD.
28+
29+
30+
METHOD on_event.
31+
32+
CASE client->get( )-event.
33+
34+
WHEN `TOGGLE`.
35+
" toggle the popover open/closed, anchored to the pressed button's DOM
36+
" ref - the whitelisted toggleBy opens it if closed, closes it if open
37+
" (the controller pattern oPopover.openBy(oButton) / oPopover.close()).
38+
" t_arg is positional: id, view (`` = global lookup), method, anchor id
39+
client->follow_up_action( val = z2ui5_if_client=>cs_event-control_by_id
40+
t_arg = VALUE #( ( `demoPopover` )
41+
( `` )
42+
( `toggleBy` )
43+
( client->get_event_arg( ) ) ) ).
44+
45+
ENDCASE.
46+
47+
ENDMETHOD.
48+
49+
50+
METHOD view_display.
51+
52+
DATA(view) = z2ui5_cl_xml_view=>factory( ).
53+
54+
DATA(page) = view->shell(
55+
)->page(
56+
title = `abap2UI5 - Popover - Toggle via CONTROL_BY_ID`
57+
navbuttonpress = client->_event_nav_app_leave( )
58+
shownavbutton = client->check_app_prev_stack( ) ).
59+
60+
" the popover kept as a dependent of the page; opened and closed
61+
" imperatively from the backend, anchored to the button that fired
62+
page->dependents(
63+
)->popover( id = `demoPopover`
64+
title = `Details`
65+
placement = `Bottom`
66+
contentwidth = `18rem`
67+
)->text( `Toggled open and closed from the backend - the same button opens ` &&
68+
`it when closed and closes it when open, no view rebuild and no payload.`
69+
)->get_parent( ).
70+
71+
page->message_strip(
72+
text = `The button toggles the popover via the whitelisted toggleBy method ` &&
73+
`(follow_up_action with cs_event-control_by_id), anchored to the button's DOM ref ` &&
74+
`passed as $event.oSource.sId - open-if-closed, close-if-open, client-side after render.`
75+
type = `Information`
76+
showicon = abap_true
77+
class = `sapUiSmallMargin` ).
78+
79+
page->vbox( `sapUiSmallMargin`
80+
)->button( text = `Toggle popover`
81+
icon = `sap-icon://email`
82+
press = client->_event( val = `TOGGLE`
83+
t_arg = VALUE #( ( `$event.oSource.sId` ) ) ) ).
84+
85+
client->view_display( view->stringify( ) ).
86+
87+
ENDMETHOD.
88+
89+
ENDCLASS.
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<abapGit version="v1.0.0" serializer="LCL_OBJECT_CLAS" serializer_version="v1.0.0">
3+
<asx:abap xmlns:asx="http://www.sap.com/abapxml" version="1.0">
4+
<asx:values>
5+
<VSEOCLASS>
6+
<CLSNAME>Z2UI5_CL_DEMO_APP_465</CLSNAME>
7+
<LANGU>E</LANGU>
8+
<DESCRIPT>More - Popover Toggle (A)</DESCRIPT>
9+
<STATE>1</STATE>
10+
<CLSCCINCL>X</CLSCCINCL>
11+
<FIXPT>X</FIXPT>
12+
<UNICODE>X</UNICODE>
13+
</VSEOCLASS>
14+
</asx:values>
15+
</asx:abap>
16+
</abapGit>
Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
CLASS z2ui5_cl_demo_app_466 DEFINITION PUBLIC.
2+
3+
PUBLIC SECTION.
4+
INTERFACES z2ui5_if_app.
5+
6+
DATA status_text TYPE string.
7+
8+
PROTECTED SECTION.
9+
DATA client TYPE REF TO z2ui5_if_client.
10+
11+
METHODS view_display.
12+
13+
PRIVATE SECTION.
14+
ENDCLASS.
15+
16+
17+
CLASS z2ui5_cl_demo_app_466 IMPLEMENTATION.
18+
19+
METHOD z2ui5_if_app~main.
20+
21+
me->client = client.
22+
IF client->check_on_init( ).
23+
24+
status_text = `<strong>Deployment successful!</strong> %%icon:sap-icon://message-success%% All services ` &&
25+
`%%icon:sap-icon://sys-enter-2%% are running. <em>Check status</em> ` &&
26+
`%%icon:sap-icon://stethoscope%%`.
27+
28+
view_display( ).
29+
30+
ENDIF.
31+
32+
ENDMETHOD.
33+
34+
35+
METHOD view_display.
36+
37+
DATA(view) = z2ui5_cl_xml_view=>factory( ).
38+
39+
" require the framework's curated formatter module into the view -
40+
" expandInlineIcons is the sap.m.MessageStripUtilities.getInlineIcon()
41+
" equivalent: a whole-string formatter that replaces every
42+
" %%icon:sap-icon://<name>%% placeholder with inline-icon markup (the
43+
" glyph resolved via IconPool), so the app never hardcodes icon-font
44+
" codepoints. Rendered by MessageStrip with enableFormattedText.
45+
view->_generic_property( VALUE #( n = `core:require`
46+
v = `{Formatter: 'z2ui5/model/formatter'}` ) ).
47+
48+
DATA(page) = view->shell(
49+
)->page(
50+
title = `abap2UI5 - MessageStrip - inline icons via Formatter`
51+
navbuttonpress = client->_event_nav_app_leave( )
52+
shownavbutton = client->check_app_prev_stack( ) ).
53+
54+
page->message_strip(
55+
text = `The status line below binds a plain string carrying %%icon:sap-icon://...%% placeholders ` &&
56+
`through Formatter.expandInlineIcons - each placeholder becomes an inline icon glyph, ` &&
57+
`no codepoints in the app.`
58+
type = `Information`
59+
showicon = abap_true
60+
class = `sapUiSmallMargin` ).
61+
62+
page->message_strip(
63+
text = |\{ path: '{ client->_bind( val = status_text path = abap_true ) }', | &&
64+
|formatter: 'Formatter.expandInlineIcons' \}|
65+
type = `Success`
66+
enableformattedtext = abap_true
67+
showicon = abap_true
68+
class = `sapUiSmallMargin` ).
69+
70+
client->view_display( view->stringify( ) ).
71+
72+
ENDMETHOD.
73+
74+
ENDCLASS.
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<abapGit version="v1.0.0" serializer="LCL_OBJECT_CLAS" serializer_version="v1.0.0">
3+
<asx:abap xmlns:asx="http://www.sap.com/abapxml" version="1.0">
4+
<asx:values>
5+
<VSEOCLASS>
6+
<CLSNAME>Z2UI5_CL_DEMO_APP_466</CLSNAME>
7+
<LANGU>E</LANGU>
8+
<DESCRIPT>More - MessageStrip Inline Icons</DESCRIPT>
9+
<STATE>1</STATE>
10+
<CLSCCINCL>X</CLSCCINCL>
11+
<FIXPT>X</FIXPT>
12+
<UNICODE>X</UNICODE>
13+
</VSEOCLASS>
14+
</asx:values>
15+
</asx:abap>
16+
</abapGit>
Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
CLASS z2ui5_cl_demo_app_467 DEFINITION PUBLIC.
2+
3+
PUBLIC SECTION.
4+
INTERFACES z2ui5_if_app.
5+
6+
TYPES:
7+
BEGIN OF ty_s_message,
8+
message TYPE string,
9+
description TYPE string,
10+
type TYPE string,
11+
target TYPE string,
12+
additionaltext TYPE string,
13+
END OF ty_s_message.
14+
DATA t_messages TYPE STANDARD TABLE OF ty_s_message WITH EMPTY KEY.
15+
DATA name TYPE string.
16+
17+
PROTECTED SECTION.
18+
DATA client TYPE REF TO z2ui5_if_client.
19+
20+
METHODS view_display.
21+
22+
PRIVATE SECTION.
23+
ENDCLASS.
24+
25+
26+
CLASS z2ui5_cl_demo_app_467 IMPLEMENTATION.
27+
28+
METHOD z2ui5_if_app~main.
29+
30+
me->client = client.
31+
IF client->check_on_init( ).
32+
33+
" app-authored messages - the controller's MessageManager.addMessages
34+
" equivalent. The z2ui5.cc.MessageManager companion reconciles this
35+
" table into the central message manager: each row becomes a
36+
" sap.ui.core.message.Message with the view's model as processor, so a
37+
" row with a target sets that field's valueState too.
38+
t_messages = VALUE #(
39+
( message = `Please enter a valid name`
40+
type = `Error`
41+
additionaltext = `Name`
42+
target = `/NAME` )
43+
( message = `Draft saved automatically`
44+
type = `Information`
45+
additionaltext = `Autosave` ) ).
46+
47+
view_display( ).
48+
49+
ENDIF.
50+
51+
ENDMETHOD.
52+
53+
54+
METHOD view_display.
55+
56+
DATA(view) = z2ui5_cl_xml_view=>factory( ).
57+
58+
DATA(page) = view->shell(
59+
)->page(
60+
title = `abap2UI5 - Messages - app-authored via z2ui5.cc.MessageManager`
61+
navbuttonpress = client->_event_nav_app_leave( )
62+
shownavbutton = client->check_app_prev_stack( ) ).
63+
64+
page->message_strip(
65+
text = `The messages below are authored by the app (not collected from control validation) ` &&
66+
`and pushed into the central message model by the invisible z2ui5.cc.MessageManager ` &&
67+
`companion bound to an ABAP table - the Error targets the Name field and colours it.`
68+
type = `Information`
69+
showicon = abap_true
70+
class = `sapUiSmallMargin` ).
71+
72+
" invisible companion control: reconciles /T_MESSAGES into the message
73+
" manager (adds the app's messages, removes its own when they drop out,
74+
" leaves auto-collected validation untouched)
75+
page->_generic( name = `MessageManager`
76+
ns = `z2ui5`
77+
t_prop = VALUE #( ( n = `items` v = client->_bind( t_messages ) ) ) ).
78+
79+
page->simple_form( title = `Registration`
80+
editable = abap_true
81+
class = `sapUiSmallMargin`
82+
)->content(
83+
)->label( `Name`
84+
)->input( client->_bind_edit( name ) ).
85+
86+
page->list( headertext = `Collected messages (message> model)`
87+
items = `{message>/}`
88+
class = `sapUiSmallMargin`
89+
)->standard_list_item( title = `{message>message}`
90+
description = `{message>additionalText}`
91+
info = `{message>type}` ).
92+
93+
client->view_display( view->stringify( ) ).
94+
95+
ENDMETHOD.
96+
97+
ENDCLASS.
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<abapGit version="v1.0.0" serializer="LCL_OBJECT_CLAS" serializer_version="v1.0.0">
3+
<asx:abap xmlns:asx="http://www.sap.com/abapxml" version="1.0">
4+
<asx:values>
5+
<VSEOCLASS>
6+
<CLSNAME>Z2UI5_CL_DEMO_APP_467</CLSNAME>
7+
<LANGU>E</LANGU>
8+
<DESCRIPT>More - Message Manager (C)</DESCRIPT>
9+
<STATE>1</STATE>
10+
<CLSCCINCL>X</CLSCCINCL>
11+
<FIXPT>X</FIXPT>
12+
<UNICODE>X</UNICODE>
13+
</VSEOCLASS>
14+
</asx:values>
15+
</asx:abap>
16+
</abapGit>

src/01/z2ui5_cl_demo_app_g00.clas.abap

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -260,9 +260,12 @@ CLASS z2ui5_cl_demo_app_g00 IMPLEMENTATION.
260260
( group = `Basic II` header = `More` sub = `Data Loss Protection (C)` app = `z2ui5_cl_demo_app_279` )
261261
( group = `Basic II` header = `More` sub = `File Uploader (C)` app = `z2ui5_cl_demo_app_074` )
262262
( group = `Basic II` header = `More` sub = `Geoloaction (C)` app = `z2ui5_cl_demo_app_120` )
263+
( group = `Basic II` header = `More` sub = `Message Manager (C)` app = `z2ui5_cl_demo_app_467` )
264+
( group = `Basic II` header = `More` sub = `MessageStrip Inline Icons` app = `z2ui5_cl_demo_app_466` )
263265
( group = `Basic II` header = `More` sub = `Multi Input (C)` app = `z2ui5_cl_demo_app_078` )
264266
( group = `Basic II` header = `More` sub = `Panel, setExpanded (A)` app = `z2ui5_cl_demo_app_448` )
265267
( group = `Basic II` header = `More` sub = `PDF Viewer Display (A)` app = `z2ui5_cl_demo_app_449` )
268+
( group = `Basic II` header = `More` sub = `Popover Toggle (A)` app = `z2ui5_cl_demo_app_465` )
266269
( group = `Basic II` header = `More` sub = `Wizard Control (A)` app = `z2ui5_cl_demo_app_202` )
267270
( group = `Basic II` header = `NavContainer` sub = `Popup (A)` app = `z2ui5_cl_demo_app_170` )
268271
( group = `Basic II` header = `NavContainer` sub = `Simple (A)` app = `z2ui5_cl_demo_app_088` )

0 commit comments

Comments
 (0)