Toggle button

I want to use the toggle button (highlighted below) in my user interface - similar to that used in the Profile Settings --> Email notifications interface.

Is this available anywhere or on the Appmarket?

Thanks!

  Discussion posts and replies are publicly visible

Parents
  • That seems to be one of the components they keep for behind-the-hood use within the Appian UI itself (though in this case i'm not sure why).  However you could definitely build a component that does something similar in functionality (minus any cool animations anyway), using a Rich Text Display Field containing a Rich Text Icon using the "toggle-on" / "toggle-off" icons.

    a!localVariables(
      local!value: "on",
      
      a!richTextDisplayField(
        value: {
          a!richTextItem(
            size: "MEDIUM_PLUS",
            text: {
              a!richTextIcon(
                icon: "toggle-on",
                showWhen: local!value = "on",
                link: a!dynamicLink(
                  saveInto: {
                    a!save(local!value, "off")
                  }
                ),
                linkStyle: "STANDALONE"
              ),
              a!richTextIcon(
                icon: "toggle-off",
                showWhen: local!value = "off",
                link: a!dynamicLink(
                  saveInto: {
                    a!save(local!value, "on")
                  }
                ),
                linkStyle: "STANDALONE"
              )
            }
          )
        }
      )
    )

Reply
  • That seems to be one of the components they keep for behind-the-hood use within the Appian UI itself (though in this case i'm not sure why).  However you could definitely build a component that does something similar in functionality (minus any cool animations anyway), using a Rich Text Display Field containing a Rich Text Icon using the "toggle-on" / "toggle-off" icons.

    a!localVariables(
      local!value: "on",
      
      a!richTextDisplayField(
        value: {
          a!richTextItem(
            size: "MEDIUM_PLUS",
            text: {
              a!richTextIcon(
                icon: "toggle-on",
                showWhen: local!value = "on",
                link: a!dynamicLink(
                  saveInto: {
                    a!save(local!value, "off")
                  }
                ),
                linkStyle: "STANDALONE"
              ),
              a!richTextIcon(
                icon: "toggle-off",
                showWhen: local!value = "off",
                link: a!dynamicLink(
                  saveInto: {
                    a!save(local!value, "on")
                  }
                ),
                linkStyle: "STANDALONE"
              )
            }
          )
        }
      )
    )

Children