Design & Layout
      Zurück zur Startseite
      1. Knowledge Base
      2. Komponenten & Funktionalitäten
      3. Design & Layout

      Panel

      Über die Panel-Komponente können Unterelemente in horizontaler oder vertikaler Richtung angeordnet werden. Durch verschachteln mehrerer Panels lassen sich komplexe Positionierungen der Komponenten darstellen.

      In diesem Artikel lesen Sie folgende Inhalte:

      Panel Properties

      Panel Funktionalitäten

      Tipp! In unserer Demo sehen Sie mehr von der Komponente.

      1. Panel Properties

      Properties

      Beschreibung

      ID

      Bezeichnung / Benamung der Headline

      Color scheme

      Initiale Farbschemen:

      • Normal: schwarz

      • Default: blau

      • Success: grün

      • Danger: rot

      Konfiguriert in Color Schemes

      CSS class

      Elemente einer Gruppe/Klasse zuordnen, für die dann bestimmte Formatierungen gelten

      Option 1: in Properties bestehende Bootstrap-Klassen einfügen

      Option 2: über Hauptmenü in den Page Templates (für “alles verfügbar”)

      Option 3: Page definitions (nur für diese Seite)

      Header / Footer

      Show header / Show footer:
      Checkbox steuert ob der Text angezeigt wird.

      Display:
      Option 1: Use Text (Text wird ohne Formatierung ausgegeben.
      Option 2: Use HTML (Im Text kann HTML verwendet werden)

      Text: Text der ausgegeben wird.

      TD_FT_Panel

      Orientation

      Horizontal (left to right): Enthaltene Komponenten werden nebeneinander dargestellt.

      Vertical (top to bottom): Enthaltene Komponenten werden untereinander dargestellt.

      Size

      Expand bottom: Wenn aktiviert, wird das Panel in voller Höhe der Row dargestellt in der es platziert ist

      Item spacing (px)

      Abstand in Pixel um jede im Panel enthaltene Kompnente.

      Item (nur horizontal)

      Im Panel (Horizontal) werden alle enhaltenen Komponenten in gleicher Breite dargestellt. Durch Auswahl einer enthaltenen Komponente, kann dieser durch Angaben bei Weight, mehr Breite zugewiesen werden.

      Weight (nur horizontal)

      Der bei Item ausgewählten Komponente kann durch Angabe einer Verhältniszahl mehr Breite zugewiesen werden. z.B. Angabe von 2 bedeutet, dass die Komponente doppelt so breit dargestellt wird.

      Vertical align (nur horizontal)

      Optionen:

      • Top

      • Center

      • Bottom

      2. Panel Funktionalitäten 

      Events 

      Notiz! Die Komponente Panel verfügt über keine Events.

      Actions

      Kategorisierung

      Action

      Beschreibung

      State

      show()

      Shows the panel.

      hide()

      Hides the panel.

      setVisible(visible)

      Show/hide the panel.
      visible: Flag to indicate shown or hidden.

      Appearance

      setTitle(title)

      Set the title of the panel.
      title: The title to set.

      setTitleText(title)

      Set the title of the panel.
      title: The text title to set.

      setTitleHtml(title)

      Set the title of the panel.
      title: The html title to set.

      setFooter(footer)

      Set the footer of the panel.
      footer: The footer to set.

      setFooterText(footer)

      Set the footer of the panel.
      footer: The footer text to set.

      setFooterHtml(footer)

      Set the footer of the panel.
      footer: The html footer to set.