Dialog plugin – New Sliding Menu (1.3 released)

Greeting to all,

mockupSlidingMenu.jpg

A sliding menu (reference some time as navigation menu) is now available. The API let you customize a lot of parameters to tweak the visual to meet you app visual look and feel.

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

Another dialog type will be released around next week. Meanwhile, if some functionalities are missing or if you would like to see some specific type of dialog, please ask, I will see what I can do. My goal, ease your life.

View Documentation 

View Marketplace 

Here are some visual of what you can accomplish with the other type of dialog :

mockupCalendar.jpg mockupdialog.jpg infoDialogExample1.jpg

Best,

Nick

Just paid today. Really love it. Easy to use.

Thanks for the good word godsterk,

Everything is in place now, the new monthTextColor attribute will let you change the color of the month section.

Enjoy
Nick

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, 

                 overideBkInput = true, overideBkColor = {0,0,0,0.8},

                 templateStyle = “classic”, dateNumberFontSize = 20, 

                 dateSelectedAsCircle = true, weekEndNumberColor = {1,0,0},

                 selectDays = “2017-5-18,2017-4-19,2017-4-20,2017-4-21”, dateBkUnderlineSelected = {1,0,0,1},

                 buttonHandler = dateListener }

local datePicker = braintonikDialog.displayCalendarDialog( op )

I’m set date in ‘selectDays’ and want to show on calendarDialog. 

When the ‘calendarDiaglog’ to show it’s set to current date only.

Hi yutthanain,

Since you have set dateSelectedAsCircle = true, the dateBkUnderlineSelected has no effect as its only used for rectangle selection. In this case, you must set only the dateBkSelected as shown below based on your example :

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, overideBkInput = true, overideBkColor = {0,0,0,0.8}, templateStyle = "classic", dateNumberFontSize = 20, dateSelectedAsCircle = true, weekEndNumberColor = {1,0,0}, selectDays = "2017-5-18,2017-4-19,2017-4-20,2017-4-21", dateBkSelected = {1,0,0,1}, buttonHandler = onClickDate }

The dateBkUnderlineSelected is useful to a nicer selection visual when using the rectangle selection as it offer you 2 level of colors. Try the example below >>

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, overideBkInput = true, overideBkColor = {0,0,0,0.8}, templateStyle = "classic", dateNumberFontSize = 20, weekEndNumberColor = {1,0,0}, selectDays = "2017-5-18,2017-4-19,2017-4-20,2017-4-21", dateBkUnderlineSelected = {1,0,0,1}, dateBkSelected = {1,0,0,0.2}, buttonHandler = onClickDate }

You can also use some predefined color scheme like the grey one also for quicker result :

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, overideBkInput = true, overideBkColor = {0,0,0,0.8}, templateStyle = "classic", colorStyle = "grey", dateNumberFontSize = 20, selectDays = "2017-5-18,2017-4-19,2017-4-20,2017-4-21", buttonHandler = onClickDate }

I hope this help you,
Nick

Hi Nick

   Thank you for your support. But I don’t under stand.

   Why in ‘selectDays’ I set month to ‘2017-05-11’ (zero five) calendar not mark in the date? (must set to ‘2017-5-11’) 

thank you

Yut

Hi Yut,

Yes, you must not put the zero '0" when adding date. This being said. I will do an update soon that will accept them. But for the time being, remove them and it will work.

Nick

Ok Nick

   I will waiting for your update, because all date field in my database used format (yyyy-mm-dd).

   If possible can change the year in dialog header it’s perfect…!!

Yut

Hi yutthanain,

What do you mean by changing the year in header  ?

Nick

Hi Yut,

I have added support for yyyy-mm-dd, therefore you can now use it directly from your database format.

I have also added a new template called “classic-3”. As shown in the image below, you can now change also the year very quickly by clicking on either << or >>.

templateStyle = "classic-3"

calendarClassic31.jpg

Enjoy

Nick

Hi Nick That’s perfect and enjoy to used. Thank you very much for your support. Yut

Purchased this plugin today for the carousel feature.

I appreciate the ‘displayCarouselDialog’ is ‘alpha’, but do you have a working example that I can play with. (Eg: The options used)

Having example options for each of the functions would be a great help in the documentation.

(I managed a slide menu by the examples on Git, but this one has no code listed that I could find)

Hi graham07,

I am currently out of town. The carrousel dialog will be live around mid-July with 4 display mode, including support for image (local/online). Docs will be updated soon as well.

Best,
​Nick

Following up to see if the carousel will make it in an update?

Hi graham07, yes the official release of the carousel is schedule for next Monday with examples of how to use it. Others enhancement will also be part of this update for the other dialogs.

Best,

Nick

Hi Graham07, its going to be available soon. Check the upcoming post.

Just paid today. Really love it. Easy to use.

Thanks for the good word godsterk,

Everything is in place now, the new monthTextColor attribute will let you change the color of the month section.

Enjoy
Nick

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, 

                 overideBkInput = true, overideBkColor = {0,0,0,0.8},

                 templateStyle = “classic”, dateNumberFontSize = 20, 

                 dateSelectedAsCircle = true, weekEndNumberColor = {1,0,0},

                 selectDays = “2017-5-18,2017-4-19,2017-4-20,2017-4-21”, dateBkUnderlineSelected = {1,0,0,1},

                 buttonHandler = dateListener }

local datePicker = braintonikDialog.displayCalendarDialog( op )

I’m set date in ‘selectDays’ and want to show on calendarDialog. 

When the ‘calendarDiaglog’ to show it’s set to current date only.

Hi yutthanain,

Since you have set dateSelectedAsCircle = true, the dateBkUnderlineSelected has no effect as its only used for rectangle selection. In this case, you must set only the dateBkSelected as shown below based on your example :

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, overideBkInput = true, overideBkColor = {0,0,0,0.8}, templateStyle = "classic", dateNumberFontSize = 20, dateSelectedAsCircle = true, weekEndNumberColor = {1,0,0}, selectDays = "2017-5-18,2017-4-19,2017-4-20,2017-4-21", dateBkSelected = {1,0,0,1}, buttonHandler = onClickDate }

The dateBkUnderlineSelected is useful to a nicer selection visual when using the rectangle selection as it offer you 2 level of colors. Try the example below >>

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, overideBkInput = true, overideBkColor = {0,0,0,0.8}, templateStyle = "classic", dateNumberFontSize = 20, weekEndNumberColor = {1,0,0}, selectDays = "2017-5-18,2017-4-19,2017-4-20,2017-4-21", dateBkUnderlineSelected = {1,0,0,1}, dateBkSelected = {1,0,0,0.2}, buttonHandler = onClickDate }

You can also use some predefined color scheme like the grey one also for quicker result :

local op = { top = 100, left = 10, wDialog = display.contentWidth-20, hDialog = 400, overideBkInput = true, overideBkColor = {0,0,0,0.8}, templateStyle = "classic", colorStyle = "grey", dateNumberFontSize = 20, selectDays = "2017-5-18,2017-4-19,2017-4-20,2017-4-21", buttonHandler = onClickDate }

I hope this help you,
Nick