Collapse

Certified Associate Developer

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.

  Discussion posts and replies are publicly visible

Parents
  • 0
    Certified Senior Developer

    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"
        )
      }
    )

  • 0
    Certified Associate Developer
    in reply to Stefan Helzle

    Thank you stefen

    But I can not share my code.

  • 0
    Certified Associate Developer
    in reply to deeptis0004

    That's why I did not insert here

Reply Children
No Data