1. Domino UI
  2. Components
  3. Collapsible
Top Strategies Accordion Multi open Letters Selectable Docs

Collapsible

A component to show and hide element

Collapsible component can wrap any element to provide functionality to show and hide the wrapped element also it allows attaching callbacks when the element is shown/hidden

Accordion

A drawer like component that allow you to show and hide content.

Accordion component can work in different mode to give the user the ability to show and hide content, accordions can have multiple AccordionPanel when the user clicks on a panel to show/hide its content, there will be only one panel opened at a time by default, the other panels will be closed unless the multi open flag is set which will allow opening more than one panel at the same time

See also :

Accordion Panel

A component used with the Accordion component to host part of the content that needs to be collapsed/expanded when the user clicks on the panel header

See also :

Anatomy

alerts-anatomy.
  1. Accordion panel header, the header is a NavBar.
  2. Accordion panel content header, this is also a NavBar.
  3. Accordion panel body.
  4. Accordion panel footer. this is also a NavBar.
  5. Collapsed accordion panel.

Examples

Collapse strategies Different ways to expand/collapse an element.

Accordion Group collapsed panels

Accordion Multi-open Accordion can have multiple panels open at the same time.

API Docs: Collapsible

Constructors

public void Collapsible(Element element)
Creates a collapsible wrapping the element

element

HTMLElement to be wrapped in a collapsible

Static methods

public static Collapsible create(Element element)
A factory to create a collapsible wrapping the element

element

HTMLElement to be wrapped in a collapsible



Returns:

a Collapsible object

public static Collapsible create(IsElement<?> isElement)
A factory to create a collapsible wrapping the element

isElement

IsElement to be wrapped in a collapsible



Returns:

a Collapsible object

Public methods

public boolean isForceCollapsed()
isForceCollapsed.

Returns:

boolean, if true the element is hidden and will not be shown even if we call expand

public Collapsible setForceCollapsed(boolean forceHidden)
Disable/Enable force hidden

forceHidden

boolean, if true it will hide the element if it is visible and will not allow the element to be shown unless it is turned off, when turned off the element will remain hidden until we call expand



Returns:

same instance

public Collapsible expand()
Check super implementation documentation.

Make the element visible and call any attached show handlers

public Collapsible collapse()
Check super implementation documentation.

Make the element hidden and call any attached hide handlers

public boolean isCollapsed()
Check super implementation documentation.

checks if the wrapped element is collapsed

public Collapsible toggleCollapse()
Check super implementation documentation.

toggle the element visibility, if its visible it hides it, otherwise it make it visible

public Collapsible toggleCollapse(boolean state)
Check super implementation documentation.

toggle the element visibility based on the flag.

public Collapsible addCollapseHandler(CollapseHandler handler)
Add handler to be called when ever the element changed state to hidden

handler

CollapseHandler



Returns:

same Collapsible instance

public Collapsible addBeforeCollapseHandler(CollapseHandler handler)
Add handler to be called when ever the element changed state to hidden before the hide operation started

handler

CollapseHandler



Returns:

same Collapsible instance

public void removeCollapseHandler(CollapseHandler handler)
removes the hide handler

handler

CollapseHandler

public void removeBeforeCollapseHandler(CollapseHandler handler)
removes the before hide handler

handler

CollapseHandler

public Collapsible addExpandHandler(ExpandHandler handler)
Add handler to be called when ever the element changed state to visible

handler

ExpandHandler



Returns:

same Collapsible instance

public Collapsible addBeforeExpandHandler(ExpandHandler handler)
Add handler to be called when ever the element changed state to visible, before the show operation is completed

handler

ExpandHandler



Returns:

same Collapsible instance

public void removeExpandHandler(ExpandHandler handler)
removes the show handler

handler

ExpandHandler

public void removeBeforeExpandHandler(ExpandHandler handler)
removes the before show handler

handler

ExpandHandler

public CollapseStrategy getStrategy()
Getter for the field strategy .

Returns:

a CollapseStrategy object

public Collapsible setStrategy(CollapseStrategy strategy)
Setter for the field strategy .

strategy

CollapseStrategy to be used with this collapsible



Returns:

same Collapsible instance

public Element element()
Check super implementation documentation.

API Docs: CollapsibleHandlers

Public methods

public abstract Runnable onBeforeExpand()
onBeforeExpand.

Returns:

a Runnable object

public abstract Runnable onExpandCompleted()
onExpandCompleted.

Returns:

a Runnable object

public abstract Runnable onBeforeCollapse()
onBeforeCollapse.

Returns:

a Runnable object

public abstract Runnable onCollapseCompleted()
onCollapseCompleted.

Returns:

a Runnable object

API Docs: CollapsibleStrategy

Public methods

public default void init(Element element, CollapsibleHandlers handlers)
Implement this method to provide any initialization required for the collapse strategy

element

The collapsible Element

handlers

a CollapsibleHandlers object

public abstract void expand(Element element)
Implement this method to show a collapsible element

element

The collapsible Element

public abstract void collapse(Element element)
Implement this method to hide a collapsible element

element

The collapsible Element

public default void cleanup(Element element)
Implement this method to clean up any attributes or styles added the strategy when we switch to a different one.

element

The collapsible Element

API Docs: AnimationCollapseOptions

Public methods

public Transition getShowTransition()


Returns:

The Transition used to animation the element when it is being shown/expanded

public AnimationCollapseOptions setShowTransition(Transition showTransition)
The Transition to be used to animation the element when it is being shown/expanded

showTransition

a Transition



Returns:

Same AnimationCollapseOptions instance

public Transition getHideTransition()


Returns:

The Transition used to animation the element when it is being hidden/collapsed

public AnimationCollapseOptions setHideTransition(Transition hideTransition)
The Transition to be used to animation the element when it is being hidden/collapsed

hideTransition

a Transition



Returns:

Same AnimationCollapseOptions instance

public CollapsibleDuration getShowDuration()


Returns:

The show/expand animation duration, CollapsibleDuration

public AnimationCollapseOptions setShowDuration(CollapsibleDuration showDuration)
Sets the show/expand animation duration

showDuration

The duration, one of enums provided byt CollapsibleDuration



Returns:

Same AnimationCollapseOptions instance

public CollapsibleDuration getHideDuration()


Returns:

The hide/collapse animation duration, CollapsibleDuration

public AnimationCollapseOptions setHideDuration(CollapsibleDuration hideDuration)
Sets the hide/collapse animation duration

hideDuration

The duration, one of enums provided byt CollapsibleDuration



Returns:

Same AnimationCollapseOptions instance

public int getShowDelay()


Returns:

An int number representing the delay in milliseconds to wait before show/expand animation is started after we show/expand the element.

public AnimationCollapseOptions setShowDelay(int showDelay)
Sets the delay in milliseconds to wait before show/expand animation is started after we show/expand the element.

showDelay

The delay in milliseconds



Returns:

Same AnimationCollapseOptions instance

API Docs: Accordion

Constructors

public void Accordion()
Creates an empty accordion

Static methods

public static Accordion create()
Factory method to create an empty accordion

Returns:

new Accordion instance

Public methods

public Accordion appendChild(AccordionPanel panel)
Adds an accordion panel to the accordion

panel

The AccordionPanel to be added



Returns:

same accordion instance

public Accordion appendChild(AccordionPanel[] panels)
Adds multiple accordion panels to the accordion

panels

The AccordionPanel s to be added



Returns:

same accordion instance

public Accordion insertChild(int index, AccordionPanel panel)
Inserts an accordion panel at the specified index in the accordion

index

The index to insert the panel at, if the index is less than 0 or greater than the number of panels it will be appended to the end of the accordion

panel

The AccordionPanel to be inserted



Returns:

same accordion instance

public Accordion togglePanel(AccordionPanel panel)
Only if the provided AccordionPanel is one of the panels in this accordion toggle the Accordion panel open state. if it is open it will be closed and if closed it will open

panel

The AccordionPanel to be toggled



Returns:

same accordion instance

public Accordion collapseAll()
Collapse all the accordion panels, this will only work if the accordion is set to allow multiple open panels, otherwise it will not have any effect.

Returns:

same accordion instance

public Accordion expandAll()
Expand all the accordion panels, this will only work if the accordion is set to allow multiple open panels, otherwise it will not have any effect.

Returns:

same accordion instance

public Accordion multiOpen()
Set the Accordion to allow multiple open AccordionPanels

Returns:

same accordion instance

public boolean isMultiOpen()
Use to check if this accordion allows multiple opened accordion panels.

Returns:

a boolean, true if multiple opened panels enabled, false if multiple opened panel is disabled

public Accordion setMultiOpen(boolean multiOpen)
Enable/Disable open multiple panels based on the provided flag

multiOpen

a boolean, true enables open multiple panels, false disable open multiple panel.



Returns:

a Accordion object

public Accordion setPanelCollapseStrategy(Supplier<CollapseStrategy> strategy)
Sets the collapse/expand strategy for the accordion panels.

strategy

The CollapseStrategy to use when the accordion panels are collapsed/expaned



Returns:

Same accordion instance

public List<AccordionPanel> getPanels()


Returns:

A List of the AccordionPanel s in this added to this accordion instance

API Docs: AccordionPanel

Constructors

public void AccordionPanel()
Creates an empty AccordionPanel
public void AccordionPanel(String title)
Creates an accordion panel with a title in the header

title

The title text

Static methods

public static AccordionPanel create(String title)
Factory method to create an accordion panel with a title

title

The title text



Returns:

new Accordion instance

Public methods

public AccordionPanel appendChild(PostfixAddOn<?> element)
Appends a component or element to the right side of the panel header. This will initialize and append the panel header if not yet initialized.

element

The element or component wrapped as a postfix.



Returns:

Same AccordionPanel instance

See also :

public AccordionPanel appendChild(HeaderContent<?> element)
Appends a component or element to the content body header section This will initialize and append the content header section if not yet initialized.

element

The component or element wrapped as a HeaderContent



Returns:

Same AccordionPanel instance

See also :

public AccordionPanel appendChild(FooterContent<?> element)
Appends a component or element to the content body footer section This will initialize and append the content footer section if not yet initialized.

element

The component or element wrapped as a FooterContent



Returns:

Same AccordionPanel instance

See also :

public AccordionPanel setTitle(String title)
Sets the panel header title. This will initialize and append the header element if not yet initialized.

title

The accordion panel header title



Returns:

same AccordionPanel instance

public AccordionPanel withTitle(String title)
Sets the panel header title. This will initialize and append the header element if not yet initialized.

title

The accordion panel header title



Returns:

same AccordionPanel instance

public AccordionPanel withHeader(ChildHandler<AccordionPanel, NavBar> handler)
Use to customize the header element of this AccordionPanel instance without breaking the fluent API chain. This will initialize and append header if not yet initialized

handler

The ChildHandler applying the customizations



Returns:

same AccordionPanel instance

See also :

public NavBar getHeader()
This will initialize and append the header element if not yet initialized.

Returns:

The NavBar representing the panel header

public AccordionPanel setIcon(Icon<?> icon)
Sets the icon in the panel header. This will initialize and append the header element if not yet initialized

icon

The Icon to be used in the panel header



Returns:

Same AccordionPanel instance

public AccordionPanel withIcon(Icon<?> icon)
Sets the icon in the panel header. This will initialize and append the header element if not yet initialized

icon

The Icon to be used in the panel header



Returns:

Same AccordionPanel instance

public DivElement getContentBody()


Returns:

The DivElement that host the panel content

public AccordionPanel withContentBody(ChildHandler<AccordionPanel, DivElement> handler)
Use to customize the content body element of this AccordionPanel instance without breaking the fluent API chain.

handler

The ChildHandler applying the customizations



Returns:

same AccordionPanel instance

See also :

public DivElement getContent()


Returns:

The DivElement representing the panel content element

public AccordionPanel withContent(ChildHandler<AccordionPanel, DivElement> handler)
Use to customize the content element of this AccordionPanel instance without breaking the fluent API chain. This will initialize and append content if not yet initialized

handler

The ChildHandler applying the customizations



Returns:

same AccordionPanel instance

See also :

public NavBar getContentHeader()


Returns:

The NavBar representing the panel content header.

public AccordionPanel withContentHeader(ChildHandler<AccordionPanel, NavBar> handler)
Use to customize the content header element of this AccordionPanel instance without breaking the fluent API chain. This will initialize and append content header if not yet initialized

handler

The ChildHandler applying the customizations



Returns:

same AccordionPanel instance

See also :

public AccordionPanel withContentHeader()
Initialize and append the content header element if not yet initialized.

Returns:

Same AccordionPanel instance

public NavBar getContentFooter()


Returns:

The NavBar representing the content footer element

public AccordionPanel withContentFooter(ChildHandler<AccordionPanel, NavBar> handler)
Use to customize the content footer element of this AccordionPanel instance without breaking the fluent API chain. This will initialize and append content footer if not yet initialized

handler

The ChildHandler applying the customizations



Returns:

same AccordionPanel instance

See also :

public AccordionPanel withContentFooter()
Initialize and append the content footer element if not yet initialized.

Returns:

Same AccordionPanel instance

We are a group of passionate people who love what we do

Donate & Support Us