I am building a Business App with Corona SDK. Things are going quite well so far. I have been mocking up my UI in Photoshop and would like to include a sidebar similar to what you see in the Facebook mobile app or others. Here is an example: http://inspired-ui.com/page/9 look at the second row, first image. Has anyone attempted to create this in corona. I have been looking through the widget info and didn’t see anything. Any info would help. Thanks [import]uid: 75071 topic_id: 36414 reply_id: 336414[/import]
If you mean this http://25.media.tumblr.com/a36cf0fe8d371f941a0540c273cbac7b/tumblr_mhf8b066jT1r71i1jo1_500.png
then it is very simple. You should have 2 display groups. group1 is at x=0, group2 is at x=-displayWidth. When you click on menu button you should use a transition to move group1 to x=displayWidth and the group2 to x=0 [import]uid: 138389 topic_id: 36414 reply_id: 144573[/import]
Yes that is it! Thanks [import]uid: 75071 topic_id: 36414 reply_id: 144574[/import]
pemanuel, I have a business app that uses that type UI and my approach was similar to vovasoft. Its working surprisingly well and was easy to implement. I keep my first displaygroup on the screen and place the 2nd on top, that way you can slide the 2nd to the right and this exposes the first below it. This mimics the facebook app behavior and always leaves group 1(main navigation) below the 2nd group so navigation is just a swipe away. I used the storyboard events as a blueprint so I knew what events (enter scene, exit…) I would need in my implementation. Hope this helps out. [import]uid: 58885 topic_id: 36414 reply_id: 144619[/import]
Is there any sample code for what you are describing?
[import]uid: 75071 topic_id: 36414 reply_id: 144622[/import]
My code isn’t cleaned up enough to share, I’m in the final stretch of development now so time is sparse. If I have time this weekend I’ll try and clean up the code and make a sample project for you to see and possibly put it in the Code Exchange so others can help make it better and expand upon it.
Here is a short vid of it (iPad skin on corona simulator and screen cropped to hide parts):
http://youtu.be/z1z3cEwYgTk
Is this what you had in mind? [import]uid: 58885 topic_id: 36414 reply_id: 144625[/import]
Thats very beautiful and impressive. That is exactly what I am looking to do. You have done a solid job and i would be willing to purchase some code from you for you time if you like. [import]uid: 75071 topic_id: 36414 reply_id: 144626[/import]
I agree with pemanuel. It’s a great outcome - good work. I’d be interested to study or purchase your code also. [import]uid: 54747 topic_id: 36414 reply_id: 144627[/import]
Thanks guys! I’ll do my best to get some code examples so you guys can see my approach. [import]uid: 58885 topic_id: 36414 reply_id: 144628[/import]
Ok, I had a couple hours to put this together. It’s not finished code so don’t complain about the code quality 
It was meant to just show the basic concept that I am using in an app to mimic that UI.
Code Exchange:
http://developer.coronalabs.com/code/sidebar-ui-example
Code at BitBucket:
http://bitbucket.org/chevoldavis/corona-sidebar-ui [import]uid: 58885 topic_id: 36414 reply_id: 144844[/import]
Thanks alot chevol for taking the time to prepare & share your code. [import]uid: 54747 topic_id: 36414 reply_id: 144845[/import]
No problem msydenham, just happy I could give back to the community 
[import]uid: 58885 topic_id: 36414 reply_id: 144846[/import]
very cool, thanks [import]uid: 11860 topic_id: 36414 reply_id: 144903[/import]
If you mean this http://25.media.tumblr.com/a36cf0fe8d371f941a0540c273cbac7b/tumblr_mhf8b066jT1r71i1jo1_500.png
then it is very simple. You should have 2 display groups. group1 is at x=0, group2 is at x=-displayWidth. When you click on menu button you should use a transition to move group1 to x=displayWidth and the group2 to x=0 [import]uid: 138389 topic_id: 36414 reply_id: 144573[/import]
Yes that is it! Thanks [import]uid: 75071 topic_id: 36414 reply_id: 144574[/import]
pemanuel, I have a business app that uses that type UI and my approach was similar to vovasoft. Its working surprisingly well and was easy to implement. I keep my first displaygroup on the screen and place the 2nd on top, that way you can slide the 2nd to the right and this exposes the first below it. This mimics the facebook app behavior and always leaves group 1(main navigation) below the 2nd group so navigation is just a swipe away. I used the storyboard events as a blueprint so I knew what events (enter scene, exit…) I would need in my implementation. Hope this helps out. [import]uid: 58885 topic_id: 36414 reply_id: 144619[/import]
Is there any sample code for what you are describing?
[import]uid: 75071 topic_id: 36414 reply_id: 144622[/import]
My code isn’t cleaned up enough to share, I’m in the final stretch of development now so time is sparse. If I have time this weekend I’ll try and clean up the code and make a sample project for you to see and possibly put it in the Code Exchange so others can help make it better and expand upon it.
Here is a short vid of it (iPad skin on corona simulator and screen cropped to hide parts):
http://youtu.be/z1z3cEwYgTk
Is this what you had in mind? [import]uid: 58885 topic_id: 36414 reply_id: 144625[/import]
Thats very beautiful and impressive. That is exactly what I am looking to do. You have done a solid job and i would be willing to purchase some code from you for you time if you like. [import]uid: 75071 topic_id: 36414 reply_id: 144626[/import]
I agree with pemanuel. It’s a great outcome - good work. I’d be interested to study or purchase your code also. [import]uid: 54747 topic_id: 36414 reply_id: 144627[/import]