Design Studio 1.6 – View on Action Sheet Technical Component
The action sheet technical component – available only in the new main mode – will allow you to create custom context based action lists.
Example
an example of Action Sheet connected to a button.
Content
The action sheet gives in this case 3 options to execute. The available items can be defined in properties. Each item can have key, text and icon.property.
Position
It is bound to a button component, by this the position can be defined in relation to the assigned component.
In the component event you have to place this script (exampe on Button):
ACTION_SHEET_1.open(BUTTON_1);Events
There is one event available, you can use it to react on the chosen action by the user. with scripting you can access the selected key or text and with IF statements you can execute corresponding function. The scripting is then as usual.
An example of Event implementation
Where to Find?
In the technical components you can see following components. Action Sheet is one of them. Pay attention that this one is available only in the new main mode.
Summary
In cases you have previously created such action lists on your own by placing panels and buttons / labels together – this component is a good improvement fro your application.
SCN Community Content
This component relates also to the SCN community package Action Sheet Button component – Action Sheet Button 2.0 – SCN Design Studio Community. There difference between those components is in the available scripts and other properties. You can chose the one which is better fitting for you.
Hi Karol,
is it correct to launch the Action Sheet from the Button's "On Click" Event with the following script?
The action sheet opens this way, but if it's open and I decide not to click any of the options, I intuively click the button again to close the menu. However, on click the menu opens again (new open animation). Maybe it'd make sense to implement .setOpen() and .isOpen() functions, so a button click event like
would be possible.
Cheers,
Moritz
Hi Moritz,
I would say it is correct to launch the Action Sheet from the "On Click" event of the button. If you don't make a selection, normally the Action Sheet should be dismissed by clicking anywhere outside the Action Sheet (except on the button).
Regards,
Mustafa.
Hi Mustafa,
This works just fine. 🙂 My post was just meant as a suggestion for further scripting functionality, as I expected the button to work differently when working with the application.
Thanks for your input, best regards,
Moritz
Hi Moritz,
It's interesting though that you've observed a new open animation of the Action Sheet when you click the button again without making a selection. The standard UI5 behaviour is no new animation if the Action Sheet is already open, as per the UI5 Explored ActionSheet example. Perhaps this behaviour is a quirk of the Design Studio implementation.
Regards,
Mustafa.
HI ,
I have some Query on this component in on select you mentioned
if(Action Sheet_1.getselectedvalue()== Action 1 ) .
In above line of code Action 1 is the first item and action 2 is second item and so on..?
Please correct me if i am Wrong
And may i know what is the purpose of component .how it varies from other components
Thanks,
Varun
Good afternoon,
I noticed (bug) incorrect behavior of Action Sheet Button component.
To reproduce:
1. Create new Design Studio application.
2. Add Action Sheet Button component (configuration is not needed)
3. Add Input Field (standard) component (configuration is not needed)
4. Start application, click inside Input component, press Enter button on keyboard, then menu (of ASB) will appear (It shouldn't be). I attach screenshot.
Tested with stable version 3.0.0.201607151206. (Design Studio 1.6 SP2, local mode)
I have been added issue on GitHub.
Thanks for the post Karol Kalisz .
But I was facing a issue hoping you can help.
How can we control the positioning of the Action List placement option is not helping here.
All the list populated are hidden and going outside the window for some of the values of the same dimension where as others are fine.
p.s :Â I was trying to change the dimension of a info chart from populating Action List.
Regards,
Raven