How To: Design of togglePanel as vertical toggle panel !

[allforjava]

Hi,

I want to use the rich:togglePanel as verticalTogglePanel.

Instead of image, how can I use the header/facet pane/panel similar to rich:simpleTogglePanel (vertically and with scrollers)?

I want to use it as docable windows/panels to display menu/tree.

Thank you in advance.

Regards

[nbelaevski]

Hello,

So do you need to build togglePanel that looks like simpleTogglePanel? Have I got that right?

[allforjava]

Hello nbelaevski (its difficult to pronounce)!

Yes! However vertical toggle panel with vertical facet (with any other features as borderless, hideable, animating stuff).

Thank you in advance.

[nbelaevski]

You can put rich:togglePanel as content of rich:panel and put toggle controls inside header. However I'm confused by vertical facet, not sure how it looks and behaves. Can you please post example, e.g. HTML markup illustrating the feature?

[allforjava]

Hi nbelaevski,

I dont know how to represent my expectation in in HTML mark-up. However, please visit at http://extjs.com/deploy/dev/examples/layout/complex.html for example.

I just need to implemet the docable panels as (east and west vertically) using rich:togglepanel. Kindly assist.

Last week end I was not available, so there's delay to reply. Regret for it.

[nbelaevski]

Hello,

Works pretty well for fixed size:

<h:panelGrid columns="2" style="border: 1px solid navy; width: 600px;">
 <rich:togglePanel switchType="ajax" stateOrder="open, closed" initialState="open">
 <f:facet name="open">
 <rich:panel style="height: 300px; width: 200px;">
 <f:facet name="header">Header <rich:toggleControl switchToState="closed">close</rich:toggleControl></f:facet>

 Content
 </rich:panel>
 </f:facet>
 <f:facet name="closed">
 <rich:toggleControl switchToState="open" style="height: 300px; width: 20px; display: block; background-color: aqua; padding: 1px; border: 1px solid aqua;">
 </rich:toggleControl>
 </f:facet>
 </rich:togglePanel>

 Another panel
 </h:panelGrid>

but sizing in percent is a problem.

[allforjava]

Thank you for the code sample. I will experiement with your code sample.

Note: I need the resizable docable panels, as simpleTogglePanel works and colours as per skin.

[allforjava]

Hi Nick/replier,

I have worked with the above given code. However, I'm expecting the facet rendered vertically, instead of horizontally (the header facet) and not with any static image.

Further, I wanted to define the toggle/docable direction e.g. top-to-bottom and bottom-to-top.

Therefore, can I have the way/implementation of the rich:simpleTogglePanel from rich:togglePanel?

Warm regards,

[spiritfox26]

Just i needed , how can add a effect to show and hide rich:toggleControl?

Thanks in advanced