Hi
I have been trying to replicate some of the cool UX features in Sean Devlins Servoy 8.4 demo V1 and have found some challenges as follows:
I can not see how you get the responsive form to expand when the sidenav is closed with the burger menu.
I have tried adding it to the responsive form and this fails
I have tried a separate form with a responsive tab panel on the right hand side and the sideNav on the left this also fails
Finally I have tried incorporating the sideNav in a cssPositionContainer and also this fails
SO If anyone has this working and better still an example I would be very interested
Previously Sean also demo’d a version of the sidenav with large icon buttons down the left side ie it did not close fully leaving approximately 50px showing with a large icon. When the mouse hovered over the icon the sideNav expanded to show the relevant menu position. I am principally interested to know how the left icon is displayed when the sideNav is closed and separately it would ideal if there was a way show either a single menu name or the whole menu on hover
I’d also very much like to know how this was done.
Maybe Sean could pop up a sample template made in 8.4 with the new CSS Positioning with a NavBar across top, SideNav down the side and a main area to hold a list & detail view, with the main area expanding when SideNav is collapsed??
sean:
OK Thanks for the feedback. I will try to make a sample soon
hey Sean can I bump this one, I am lucky enough to have had a months holiday and I am now back on the case
To be honest you actually did the sample in your video demo, the thing I am most interested in is how you got the SideNav to slide the rest of the content when exposes and collapse it back in when not - this sort of thing :
Thanks Sean.
I actually had these set on my ‘sidenav’ but I had some
s that were stopping it from working as I’d wanted, which I have now removed, so it is working!
However, when I change the window size (width), eventually the sidenav goes to icon only view, but doesn’t actually collapse as it would if I had clicked on the ‘burger’ icon
Here is my outline/settings for the form
[attachment=0]MySideNav_400x650.png[/attachment]
with the ‘tablesspanel’ having a styleClass of ‘svy-sidenav-tablesspanel’ (thinking that might help…)
Any ideas?
Thanks
Rafi
when you look at the properties of the sidenav component, the 2nd property is ‘containedForm’
There you need to link the ‘body form’.
The sidenav panel should be set to the full width of the form and probable also anchored top-left-right-bottom (a bit depending on your design)
mboegem:
when you look at the properties of the sidenav component, the 2nd property is ‘containedForm’
There you need to link the ‘body form’.
The sidenav panel should be set to the full width of the form and probable also anchored top-left-right-bottom (a bit depending on your design)
Hope that helps
hadn’t really paid attention to that property, but tried that out (and didn’t change width, it seemed to work, and there was no anchoring as it was a responsive form) and it still did the same thing as before (i.e. sidenav menu didn’t collapse).
But thanks for pointing that out to me.
Maybe Sean knows the answer
