How to make a card layout collapsable?

That's not a feature of a!cardLayout().  You could potentially accomplish a similar effect with a!boxLayout(), though.

Also note: there's nothing keeping you from implementing something like this in a!cardLayout() - manually, for yourself.  You could have a Rich Text Icon in your card somewhere which, when clicked, hides all contents of the card (other than a "reopen" icon).  That wouldn't be very difficult to do, wouldn't require any unusual workarounds, but isn't a built-in feature.

That's not a feature of a!cardLayout().  You could potentially accomplish a similar effect with a!boxLayout(), though.

Also note: there's nothing keeping you from implementing something like this in a!cardLayout() - manually, for yourself.  You could have a Rich Text Icon in your card somewhere which, when clicked, hides all contents of the card (other than a "reopen" icon).  That wouldn't be very difficult to do, wouldn't require any unusual workarounds, but isn't a built-in feature.

Yes, we can make a box layout using two card layouts and by clicking on the one card we can hide or show the another card.

box layouts now have built-in collapsibility, so this workaround should no longer be needed, fyi.

Yes you are right Mike but Faraz wanted to know "How to make a card layout collapsable?".

I have a paragraphtext inside that card layout will it hide that too?

Can you use box layout as Mike explained above?

If you build this functionality manually, as I'd suggest if you *absolutely* need a Card Layout instead of a Box Layout, then you can hide or show whatever you want inside your card when collapsed.  As I said, you'd just need to do any hiding manually.

Edit: here's a portable example of such a thing:

a!localVariables(
  local!collapsed: false(),
  a!cardLayout(
    contents: {
      a!richTextDisplayField(
        labelPosition: "COLLAPSED",
        align: "RIGHT",
        value: {
          a!richTextIcon(
            icon: "angle-down-bold",
            showWhen: not(local!collapsed),
            size: "MEDIUM",
            linkStyle: "STANDALONE",
            link: a!dynamicLink(
              saveInto: a!save(local!collapsed, true())
            )
          ),
          a!richTextIcon(
            icon: "angle-right-bold",
            showWhen: local!collapsed,
            size: "MEDIUM",
            linkStyle: "STANDALONE",
            link: a!dynamicLink(
              saveInto: a!save(local!collapsed, false())
            )
          )
        }
      ),
      a!sectionLayout(
        label: "Card Contents",
        showWhen: not(local!collapsed),
        contents: {
          a!paragraphField(
            value: "paragraph" & char(10) & "text" & char(10) & "goes" & char(10) & "here",
            readOnly: true()
          )
        }
      )
    }
  )
)

Exactly.