Skip to content

demo updates #103

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jan 23, 2024
Merged

demo updates #103

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions src/z2ui5_cl_demo_app_000.clas.abap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,8 @@ ENDCLASS.



CLASS z2ui5_cl_demo_app_000 IMPLEMENTATION.
CLASS Z2UI5_CL_DEMO_APP_000 IMPLEMENTATION.


METHOD z2ui5_if_app~main.

Expand Down Expand Up @@ -1079,12 +1080,19 @@ CLASS z2ui5_cl_demo_app_000 IMPLEMENTATION.
).

panel->generic_tile(
header = 'Animate CSS '
header = 'Animate CSS'
press = client->_event( 'Z2UI5_CL_DEMO_APP_146' )
mode = 'LineMode'
class = 'sapUiTinyMarginEnd sapUiTinyMarginBottom'
).

panel->generic_tile(
header = 'Chart.JS'
press = client->_event( 'Z2UI5_CL_DEMO_APP_148' )
mode = 'LineMode'
class = 'sapUiTinyMarginEnd sapUiTinyMarginBottom'
).

panel = page->panel(
expandable = abap_false
expanded = abap_true
Expand Down
144 changes: 143 additions & 1 deletion src/z2ui5_cl_demo_app_148.clas.abap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,6 @@ CLASS Z2UI5_CL_DEMO_APP_148 IMPLEMENTATION.
METHOD z2ui5_on_init.

"bar

ms_chartjs_config_bar-type = 'bar'.
ms_chartjs_config_bar-data-labels = VALUE #( ( `Red` ) ( `Blue` ) ( `Yellow` ) ( `Green` ) ( `Purple` ) ( `Orange` ) ( `Black` ) ).

Expand Down Expand Up @@ -241,6 +240,120 @@ CLASS Z2UI5_CL_DEMO_APP_148 IMPLEMENTATION.
"disable datalabels
ms_chartjs_config_wordcloud-options-plugins-datalabels-display = '-'.


"line
ms_chartjs_config_line-type = 'line'.
ms_chartjs_config_line-data-labels = VALUE #( ( `Jan` ) ( `Feb` ) ( `Mar` ) ( `Apr` ) ( `May` ) ( `Jun` ) ( `Jul` ) ).

CLEAR ls_dataset.
ls_dataset-label = `Dataset 1`.
ls_dataset-data = VALUE #(
( `65` )
( `59` )
( `80` )
( `81` )
( `56` )
( `55` )
( `40` )
).
APPEND ls_dataset TO ms_chartjs_config_line-data-datasets.

CLEAR ls_dataset.
ls_dataset-label = `Dataset 2`.
ls_dataset-data = VALUE #(
( `100` )
( `33` )
( `22` )
( `19` )
( `11` )
( `49` )
( `30` )
).
APPEND ls_dataset TO ms_chartjs_config_line-data-datasets.


ms_chartjs_config_line-options-responsive = abap_true.
ms_chartjs_config_line-options-plugins-title-display = abap_true.
ms_chartjs_config_line-options-plugins-title-text = `Min and Max Settings`.

"bubble
ms_chartjs_config_bubble-type = 'bubble'.

CLEAR ls_dataset.
ls_dataset-label = `Dataset 1`.
ls_dataset-data_x_y_r = VALUE #( ( x = `26` y = `79` r = `12.3` )
( x = `37` y = `65` r = `13.8` )
( x = `27` y = `24` r = `5.8` )
( x = `38` y = `39` r = `5.8` )
( x = `47` y = `36` r = `8.4` )
( x = `77` y = `65` r = `9.5` )
( x = `87` y = `43` r = `6.66` )
).
APPEND ls_dataset TO ms_chartjs_config_bubble-data-datasets.

CLEAR ls_dataset.
ls_dataset-label = `Dataset 2`.
ls_dataset-data_x_y_r = VALUE #( ( x = `5` y = `18` r = `8.9` )
( x = `15` y = `88` r = `6.9` )
( x = `19` y = `56` r = `13.1` )
( x = `64` y = `31` r = `10.8` )
( x = `71` y = `13` r = `9.8` )
( x = `78` y = `70` r = `7.02` )
( x = `90` y = `72` r = `10.96` )
).
APPEND ls_dataset TO ms_chartjs_config_bubble-data-datasets.

ms_chartjs_config_bubble-options-responsive = abap_true.
ms_chartjs_config_bubble-options-plugins-legend-position = `top`.
ms_chartjs_config_bubble-options-plugins-title-display = abap_true.
ms_chartjs_config_bubble-options-plugins-title-text = `Bubble Chart`.

"doughnut
ms_chartjs_config_doughnut-type = `doughnut`.
ms_chartjs_config_doughnut-data-labels = VALUE #( ( `Red` ) ( `Orange` ) ( `Yellow` ) ( `Green` ) ( `Blue` ) ).

CLEAR ls_dataset.
ls_dataset-label = `Dataset 1`.

ls_dataset-data = VALUE #(
( `63.411` )
( `47.831` )
( `50.666` )
( `21.3` )
( `38.744` )
).

APPEND ls_dataset TO ms_chartjs_config_doughnut-data-datasets.

* ms_chartjs_config_doughnut-options-responsive = abap_true.
ms_chartjs_config_doughnut-options-plugins-legend-position = `bottom`.
ms_chartjs_config_doughnut-options-plugins-title-display = abap_false.
ms_chartjs_config_doughnut-options-plugins-title-text = `Doughnut Chart`.
ms_chartjs_config_doughnut-options-plugins-datalabels-text_align = `center`.

"pie
ms_chartjs_config_pie-type = `pie`.
ms_chartjs_config_pie-data-labels = VALUE #( ( `Red` ) ( `Orange` ) ( `Yellow` ) ( `Green` ) ( `Blue` ) ).

CLEAR ls_dataset.
ls_dataset-label = `Dataset 1`.

ls_dataset-data = VALUE #(
( `63.411` )
( `47.831` )
( `50.666` )
( `21.3` )
( `38.744` )
).

APPEND ls_dataset TO ms_chartjs_config_pie-data-datasets.

ms_chartjs_config_pie-options-plugins-legend-position = `bottom`.
ms_chartjs_config_pie-options-plugins-title-display = abap_false.
ms_chartjs_config_pie-options-plugins-title-text = `Pie Chart`.
ms_chartjs_config_pie-options-plugins-datalabels-text_align = `center`.


ENDMETHOD.


Expand Down Expand Up @@ -293,6 +406,35 @@ CLASS Z2UI5_CL_DEMO_APP_148 IMPLEMENTATION.
config = client->_bind_edit( val = ms_chartjs_config_wordcloud pretty_name = 'X' compress = client->cs_compress_mode-full )
).

DATA(vl11) = car->vertical_layout( width = `100%` ).
DATA(fb11) = vl11->flex_box( width = `100%` height = `50%` justifycontent = `SpaceAround` ).
DATA(fb22) = vl11->flex_box( width = `100%` height = `50%` justifycontent = `SpaceAround` ).
fb11->vbox( justifycontent = `Center`
)->_z2ui5( )->chartjs( canvas_id = `line`
height = `300`
width = `600`
config = client->_bind_edit( val = ms_chartjs_config_line pretty_name = 'X' compress = client->cs_compress_mode-full )
).
fb11->vbox( justifycontent = `Center`
)->_z2ui5( )->chartjs( canvas_id = `bubble`
height = `300`
width = `600`
config = client->_bind_edit( val = ms_chartjs_config_bubble pretty_name = 'X' compress = client->cs_compress_mode-full )
).

fb22->vbox( justifycontent = `Center`
)->_z2ui5( )->chartjs( canvas_id = `doughnut`
height = `300`
width = `300`
config = client->_bind_edit( val = ms_chartjs_config_doughnut pretty_name = 'X' compress = client->cs_compress_mode-full )
).

fb22->vbox( justifycontent = `Center`
)->_z2ui5( )->chartjs( canvas_id = `pie`
height = `300`
width = `300`
config = client->_bind_edit( val = ms_chartjs_config_pie pretty_name = 'X' compress = client->cs_compress_mode-full )
).

client->view_display( page->stringify( ) ).

Expand Down
95 changes: 95 additions & 0 deletions src/z2ui5_cl_demo_app_163.clas.abap
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
class Z2UI5_CL_DEMO_APP_163 definition
public
create public .

public section.

interfaces IF_SERIALIZABLE_OBJECT .
interfaces Z2UI5_IF_APP .

PROTECTED SECTION.
DATA client TYPE REF TO z2ui5_if_client.
DATA mv_check_initialized TYPE abap_bool.
METHODS on_event.
METHODS view_display.
METHODS view_action_sheet.

PRIVATE SECTION.
* DATA mt_range TYPE z2ui5_cl_util_func=>ty_t_sql_multi.
ENDCLASS.



CLASS Z2UI5_CL_DEMO_APP_163 IMPLEMENTATION.


METHOD ON_EVENT.

CASE client->get( )-event.

WHEN 'OPEN_ACTION_SHEET'.
view_action_sheet( ).
WHEN 'BACK'.
client->nav_app_leave( client->get_app( client->get( )-s_draft-id_prev_app_stack ) ).
ENDCASE.

ENDMETHOD.


METHOD view_action_sheet.

DATA(action_sheet_view) = z2ui5_cl_xml_view=>factory_popup( ).

action_sheet_view->_generic_property( VALUE #( n = `core:require` v = `{ MessageToast: 'sap/m/MessageToast' }` ) ).

action_sheet_view->action_sheet( placement = `Botton` showcancelbutton = abap_true title = `Choose Your Action`
)->button( text = `Accept` icon = `sap-icon://accept` press = `MessageToast.show('selected action is ' + ${$source>/text})`
)->button( text = `Reject` icon = `sap-icon://decline` press = `MessageToast.show('selected action is ' + ${$source>/text})`
)->button( text = `Email` icon = `sap-icon://email` press = `MessageToast.show('selected action is ' + ${$source>/text})`
)->button( text = `Forward` icon = `sap-icon://forward` press = `MessageToast.show('selected action is ' + ${$source>/text})`
)->button( text = `Delete` icon = `sap-icon://delete` press = `MessageToast.show('selected action is ' + ${$source>/text})`
)->button( text = `Other` press = `MessageToast.show('selected action is ' + ${$source>/text})`
).

client->popover_display( xml = action_sheet_view->stringify( ) by_id = `actionSheet` ).

ENDMETHOD.


METHOD VIEW_DISPLAY.

DATA(view) = z2ui5_cl_xml_view=>factory( ).

view = view->shell( )->page( id = `page_main`
title = 'abap2UI5 - Action Sheet'
navbuttonpress = client->_event( 'BACK' )
shownavbutton = abap_true
)->header_content(
)->link(
text = 'Source_Code' target = '_blank' href = z2ui5_cl_demo_utility=>factory( client )->app_get_url_source_code( )
)->get_parent( ).

DATA(vbox) = view->vbox( ).

vbox->button( text = 'Open Action Sheet' press = client->_event( 'OPEN_ACTION_SHEET' ) id = `actionSheet` class = `sapUiSmallMargin` ).

client->view_display( view->stringify( ) ).

ENDMETHOD.


METHOD Z2UI5_IF_APP~MAIN.

me->client = client.

IF mv_check_initialized = abap_false.
mv_check_initialized = abap_true.

view_display( ).
RETURN.
ENDIF.

on_event( ).

ENDMETHOD.
ENDCLASS.
16 changes: 16 additions & 0 deletions src/z2ui5_cl_demo_app_163.clas.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<?xml version="1.0" encoding="utf-8"?>
<abapGit version="v1.0.0" serializer="LCL_OBJECT_CLAS" serializer_version="v1.0.0">
<asx:abap xmlns:asx="http://www.sap.com/abapxml" version="1.0">
<asx:values>
<VSEOCLASS>
<CLSNAME>Z2UI5_CL_DEMO_APP_163</CLSNAME>
<LANGU>E</LANGU>
<DESCRIPT>popup - popop_get_range_multi</DESCRIPT>
<STATE>1</STATE>
<CLSCCINCL>X</CLSCCINCL>
<FIXPT>X</FIXPT>
<UNICODE>X</UNICODE>
</VSEOCLASS>
</asx:values>
</asx:abap>
</abapGit>