Hi Team, just got this Requirement So when i click the Collaspe all button The box layout which is below should get Collapsed.
Any one can help me with this
I made like after clicking this button a local variable is changed to true and after that i wrote that in iscollapsible condition but not working
Discussion posts and replies are publicly visible
Hi, FYI
You can create a custom card layout similar to the box layout and use that to achieve this.
a!localVariables( local!isInitiallyCollapsed: false(),/*can not be null*/ { a!buttonArrayLayout( buttons: a!buttonWidget( label: if( local!isInitiallyCollapsed, "SHOW ALL", "COLLAPSE ALL" ), saveInto: a!save( local!isInitiallyCollapsed, not(local!isInitiallyCollapsed) ) ) ), a!cardLayout( contents: { a!sideBySideLayout( items: { a!sideBySideItem( item: a!richTextDisplayField( labelPosition: "COLLAPSED", align: "LEFT", value: { a!richTextItem(text: "BOX 1", ) } ) ), a!sideBySideItem( showWhen: not( rule!BCT_IsBlank(value: local!isInitiallyCollapsed) ), item: a!richTextDisplayField( align: "RIGHT", labelPosition: "COLLAPSED", value: { a!richTextIcon( showWhen: local!isInitiallyCollapsed = false, icon: "minus-square", caption: "Collapse", color: "ACCENT", size: "MEDIUM", linkStyle: "STANDALONE", link: a!dynamicLink( saveInto: { a!save(local!isInitiallyCollapsed, true) } ) ), a!richTextIcon( showWhen: local!isInitiallyCollapsed = true, icon: "plus-square", caption: "Expand", color: "ACCENT", size: "MEDIUM", linkStyle: "STANDALONE", link: a!dynamicLink( saveInto: { a!save(local!isInitiallyCollapsed, false) } ) ) } ) ) } ), if( local!isInitiallyCollapsed = true, {}, { a!sectionLayout(divider: "ABOVE", marginBelow: "NONE"), a!textField(label: "TEST"), /* Create a interface and resue it for the below code*/ a!cardLayout( contents: { a!sideBySideLayout( items: { a!sideBySideItem( item: a!richTextDisplayField( labelPosition: "COLLAPSED", align: "LEFT", value: { a!richTextItem(text: "BOX 2", ) } ) ), a!sideBySideItem( showWhen: not( rule!BCT_IsBlank(value: local!isInitiallyCollapsed) ), item: a!richTextDisplayField( align: "RIGHT", labelPosition: "COLLAPSED", value: { a!richTextIcon( showWhen: local!isInitiallyCollapsed = false, icon: "minus-square", caption: "Collapse", color: "ACCENT", size: "MEDIUM", linkStyle: "STANDALONE", link: a!dynamicLink( saveInto: { a!save(local!isInitiallyCollapsed, true) } ) ), a!richTextIcon( showWhen: local!isInitiallyCollapsed = true, icon: "plus-square", caption: "Expand", color: "ACCENT", size: "MEDIUM", linkStyle: "STANDALONE", link: a!dynamicLink( saveInto: { a!save(local!isInitiallyCollapsed, false) } ) ) } ) ) } ), if( local!isInitiallyCollapsed = true, {}, { a!sectionLayout(divider: "ABOVE", marginBelow: "NONE"), a!textField(label: "TEST") } ) }, ) } ) }, ) } )