Collapse

Question

Hii, is there any way to collapse in cardlayout section. I have a requirement like inside cardlayout section we have four selected tab again in cardlayout one by one that tab enable after approve after enable last one how can we collapse by default.

Rishikesh Raj · Answer

As we know cardlayout don't have collapsable property as that of boxLayout. But as per your requirement you can try below code, feel free to modify according to you. This is a custom collapsable cardlayout. 
 a!localVariables(
 local!isOpen: true,
 {
 a!cardLayout(
 contents: a!cardLayout(
 contents: {
 a!sideBySideLayout(
 items: {
 a!sideBySideItem(
 item: a!richTextDisplayField(
 labelPosition: "COLLAPSED",
 value: {
 a!richTextItem(text: "Attachments", size: "MEDIUM")
 }
 )
 ),
 a!sideBySideItem(
 item: a!buttonArrayLayout(
 buttons: {
 a!buttonWidget(
 icon: if(
 local!isOpen,
 "angle-down-bold",
 "angle-right-bold"
 ),
 saveInto: a!save(local!isOpen, not(local!isOpen)),
 size: "SMALL",
 style: "LINK"
 )
 },
 align: "END",
 marginAbove: "NONE",
 marginBelow: "NONE"
 ),
 width: "MINIMIZE"
 )
 },
 alignVertical: "MIDDLE"
 )
 },
 style: "STANDARD",
 showBorder: false,
 showShadow: false,
 decorativeBarPosition: "END",
 decorativeBarColor: "#F0F0F0"
 ),
 style: "STANDARD",
 padding: "NONE",
 marginBelow: if(local!isOpen, "NONE", "STANDARD"),
 showShadow: true,
 decorativeBarPosition: "TOP",
 decorativeBarColor: "ACCENT"
 ),
 a!columnsLayout(
 columns: {
 a!columnLayout(width: "EXTRA_NARROW"),
 a!columnLayout(
 contents: {
 a!cardLayout(
 contents: a!richTextDisplayField(
 value: a!richTextBulletedList(
 items: a!richTextListItem(
 text: {
 a!richTextItem(text: "Document 1"),
 char(10),
 char(10),
 a!richTextItem(text: "Document 2"),
 char(10),
 char(10),
 a!richTextItem(text: "Document 3")
 }
 )
 )
 ),
 padding: "NONE",
 showBorder: false,
 showShadow: false,
 decorativeBarPosition: "START",
 decorativeBarColor: "ACCENT"
 )
 }
 )
 },
 showWhen: local!isOpen,
 marginBelow: "STANDARD"
 )
 }
)

Stefan Helzle · Answer

I am not sure I understand what you want to achieve, but you can hide and shoe any component based on any logic. That should allow you to implement what you are looking for. 
 For more tips, we need way more details.

Mike Schmitt · Answer

Unknown said: we need way more details. 
 and... like... maybe just a smidge of punctuation?

Collapse

Top Replies