Dialog plugin – New Carousel (1.8 released)

Greeting to all,

mockupCarousel.jpg

A carousel dialog is now available. The API let you create 4 types of carousel pages, including a custom one.

 

I am proud to say that the plugin now support 5 type of dialog; popup dialog, information dialog, calendar dialog, sliding menu and now carousel.

 

View Documentation 

View Marketplace 

 

If some features are missing, please ask :wink:

 

best
Nick

Very cool!

-dev

Awesome.

Being able to launch another listener from within a screen would be helpful. In particular the Carousel. Effectively this does make it less like a dialog, and more like a Menu, but it was a Menu that I had anticipated on creating. So being able to tap ‘option 3’ in the carousel and go off and run a function would be great. 

Somewhat similar to the callback function in the example code.

If its available, I missed it :slight_smile: if it’s not, this can also go under the ‘feature request’ section.

Hi graham07,

Just to make sure I understand, if the Carousel had 4 pages for example and the user click on the close button while being page 3, you would like to know on which page the user was when clicking on it ? In this case 3 !

Really I want to be able to create an image button on page 3, or treat all of page 3 as a button (without the close) if thats the only doable option.

So, for example, if you click the cat on page 4, you can email it OR you click CLOSE to close the dialog and return. Really, one per page and a close option would be sufficient for a menu.

**Edit: Like taking your slide menu, and putting it onto the carousel

Got it. Let me look at this. should be easy to do something to accommodate this scenario.

Hi graham07, a new version of the plugin is now available with the following added functionnalities :

  • A close button callback is now available, so you are notified when the user click on it. You receive the page number the user was on.
     
  • An image callback is now available for the template “image”. You will receive the page number as well in case you want to reuse the same callback.
     
  • an icon callback is now available for the template “icon+title+text” You will receive the page number as well in case you want to reuse the same callback.
     

Please look at the updated documentation and sample to see how it works.

Hope this help and if you need other things, don’t hesitate to ask, will see what I can do.

Nick

That sounds awesome, I’ll take a look later today and have a think too! Thank you.

Great do far. Question. Can we have a transparent background instead of forcing a color. The default is black, but transparent might be nice.

Yes its possible. Ensure that the parameter bkColor = { 0,0,0,0 } of the main table as the alpha set to 0 (this is the main background of the carousel) Then for each item in your list that you would like to have a transparent background  make sure also that the param bkColor is also transparent (this is the background of the item)

Then it will work :wink:

Will try that - here’s a couple more feature requests…

  1. Allow the Close button to be an image instead of text only. Eg: A nice |X| icon.

  2. Allow the carousel to be vertical instead of horizontal. Same kind of movement, but up/down instead of left/right.

Feedback - Great job, about 10 minutes and I had a nice carousel menu, sliding professionally, processing each click as it should. Just fabulous. For a quick menu it was a piece of cake.

Many thanks for the great plugin!

For your point 1, this would be relatively easy. However, I will expose a full button widget in the plugin and will reuse it in the carousel. You will therefore be able to use this new button in your own project. Button will be quite powerful…

For point 2, you are the second person asking for it. Let me check how easy it is…

Hi Graham07, I’ve completed the button widget class. Here is an animated gif of some the possibilities :

buttonTest.gif

You will be able to add this type of button as the close button of the carousel. This button support text, icon and icon+text, with left, right, center, in circle, rectangle and rounded rect. You can also have different label if the button is in normal state or selected. The button support also a disable state that you can customize completely.The button work also as a 2 states buttons as shown for the play/pause example. Its also possible to have a 3rd icon for the disable state…

I am integrating this in the carousel, doing a few test, then checkin this over the weekend.

best

Nick

These are awesome. Keep up the good work!

Hi Graham07, 

It is now possible to have an icon as a close button in the carousel. In fact you now have access to the full uiButtonclass available to customize the close button of the carousel. As an example :

updatedCloseButtonCarousel.jpg

Hi Graham07, I am doing a follow up on the icon button to see if its working well for you ?

Nick

Haven’t had a chance to follow it up yet, although one question… can I disable the close button so it can’t be seen/used?

Yes,  making sure the “closeButtonLabel” parmeter is not defined and the close button will never be shown.

Ran into an issue with “icon+title+text” not working with the imgCloseCallback = imgCallBack

It works fine with “image”, but doesn’t get called with this one (or custom)

This works…

            { template = “image”, imageDisplay=“bestFit”, imageFileName = “images/email.png”, bkColor = {0,0,0,0}, imgCloseCallback = imgCallBack }, – imageFileNameBaseDir

This does not

                { template = “icon+title+text”, title=“Social Media”, text=“Check Various Feeds”,bkColor = {0,0,0,0}, titlePHeight = 0, titleFontSize = 24, textFontSize = 16, textPHeight = 25, padding = 20, iconPHeight = 80, iconFileName = “images/iconSocialMedia.png” , iconWidth = 300, iconHeight = 150,imgCloseCallback = imgCallBack}, – iconFileNameBaseDir

Hi Graham07,

When you use the template icon, you must use  iconCloseCallback =yourCallback.

Best,
Nick