Code Patterns

Copy-paste examples for common plugin tasks. Commands, events, ECS, GUI, and more.
All 225 Command 60 Damage 2 Ecs 27 Entity 5 Gui 75 Interaction 2 Inventory 4 Moderation 3 Permission 2 Player 9 Plugin 4 Storage 2 Teleport 3 Ui 22 Util 5
← Back to Patterns
gui
hytale-teleporter

Official Hytale UI: Teleporter - Container layout with buttons with text elements
Example Code

$C = "../Common.ui";

$C.@PageOverlay {
  LayoutMode: Middle;

  $C.@DecoratedContainer {
    Anchor: (Width: 532);

    #Title {
      $C.@Title {
        @Text = %server.customUI.teleporter.title;
      }
    }

    #Content {
      LayoutMode: Top;
      Padding: (Full: 16);

      Group #ErrorScreen {
        LayoutMode: Top;
        Visible: true;

        Label {
          Text: %teleporter.error;
          Anchor: (Bottom: 16);
          Style: (...$C.@DefaultLabelStyle, RenderBold: true);
        }
      }

      Group #FullSettings {
        LayoutMode: Top;
        Visible: true;

        Label {
          Text: %server.customUI.teleporter.location;
          Anchor: (Bottom: 16);
          Style: (...$C.@DefaultLabelStyle, RenderBold: true);
        }

        $C.@CheckBoxWithLabel #BlockRelative {
          @Text = %server.customUI.teleporter.blockRelative;
          TooltipText: %server.customUI.teleporter.blockRelative.tooltip;
        }

        Group {
          LayoutMode: Left;

          Group #X {
            LayoutMode: Top;
            Anchor: (Bottom: 16);

            Label {
              Text: "X";
              Anchor: (Top: 6, Left: 6, Right: 16);
              Style: $C.@DefaultLabelStyle;
            }

            $C.@NumberField #Input {
              @Anchor = (Width: 60, Left: 0, Right: 16, Bottom: 16);

              Format: (
                MaxDecimalPlaces: 2,
                Step: 0.5
              );
            }

            $C.@CheckBoxWithLabel {
              @Text = %server.customUI.teleporter.relative;
              TooltipText: %server.customUI.teleporter.relative.tooltip;
            }
          }

          Group #Y {
            LayoutMode: Top;
            Anchor: (Bottom: 16);

            Label {
              Text: "Y";
              Anchor: (Top: 6, Left: 6, Right: 16);
              Style: $C.@DefaultLabelStyle;
            }

            $C.@NumberField #Input {
              @Anchor = (Width: 60, Left: 0, Right: 16, Bottom: 16);

              Format: (
                MaxDecimalPlaces: 2,
                Step: 0.5
              );
            }

            $C.@CheckBoxWithLabel {
              @Text = %server.customUI.teleporter.relative;
              TooltipText: %server.customUI.teleporter.relative.tooltip;
            }
          }

          Group #Z {
            LayoutMode: Top;
            Anchor: (Bottom: 16);

            Label {
              Text: "Z";
              Anchor: (Top: 6, Left: 6, Right: 16);
              Style: $C.@DefaultLabelStyle;
            }

            $C.@NumberField #Input {
              @Anchor = (Width: 60, Left: 0, Right: 16, Bottom: 16);

              Format: (
                MaxDecimalPlaces: 2,
                Step: 0.5
              );
            }

            $C.@CheckBoxWithLabel {
              @Text = %server.customUI.teleporter.relative;
              TooltipText: %server.customUI.teleporter.relative.tooltip;
            }
          }
        }

        Label {
          Text: %server.customUI.teleporter.rotation;
          Anchor: (Bottom: 16);
          Style: (...$C.@DefaultLabelStyle, RenderBold: true);
        }

        Group {
          LayoutMode: Left;

          Group #Yaw {
            LayoutMode: Top;
            Anchor: (Bottom: 16);

            Label {
              Text: "Yaw";
              Anchor: (Top: 6, Left: 6, Right: 16);
              Style: $C.@DefaultLabelStyle;
            }

            $C.@NumberField #Input {
              @Anchor = (Width: 60, Left: 0, Right: 16, Bottom: 16);

              Format: (
                MaxDecimalPlaces: 2,
                Step: 0.5
              );
            }

            $C.@CheckBoxWithLabel {
              @Text = %server.customUI.teleporter.relative;
              TooltipText: %server.customUI.teleporter.relative.tooltip;
            }
          }

          Group #Pitch {
            LayoutMode: Top;
            Anchor: (Bottom: 16);

            Label {
              Text: "Pitch";
              Anchor: (Top: 6, Left: 6, Right: 16);
              Style: $C.@DefaultLabelStyle;
            }

            $C.@NumberField #Input {
              @Anchor = (Width: 60, Left: 0, Right: 16, Bottom: 16);

              Format: (
                MaxDecimalPlaces: 2,
                Step: 0.5
              );
            }

            $C.@CheckBoxWithLabel {
              @Text = %server.customUI.teleporter.relative;
              TooltipText: %server.customUI.teleporter.relative.tooltip;
            }
          }

          Group #Roll {
            LayoutMode: Top;
            Anchor: (Bottom: 16);

            Label {
              Text: "Roll";
              Anchor: (Top: 6, Left: 6, Right: 16);
              Style: $C.@DefaultLabelStyle;
            }

            $C.@NumberField #Input {
              @Anchor = (Width: 60, Left: 0, Right: 16, Bottom: 16);

              Format: (
                MaxDecimalPlaces: 2,
                Step: 0.5
              );
            }

            $C.@CheckBoxWithLabel {
              @Text = %server.customUI.teleporter.relative;
              TooltipText: %server.customUI.teleporter.relative.tooltip;
            }
          }
        }

        Label {
          Text: %server.customUI.teleporter.world;
          Anchor: (Bottom: 7);
          Style: (...$C.@DefaultLabelStyle, RenderBold: true);
        }

        $C.@DropdownBox #WorldDropdown {
          @Anchor = (Bottom: 16, Left: 5);
        }
      }

      Group #WarpSettings {
        LayoutMode: Top;
        Anchor: (Bottom: 16);
        Visible: true;

        Label {
          Text: %server.customUI.teleporter.targetWarp;
          Anchor: (Bottom: 7);
          Style: (...$C.@DefaultLabelStyle, RenderBold: true);
        }

        $C.@DropdownBox #WarpDropdown {
          @Anchor = (Left: 5, Bottom: 16);
          NoItemsText: %server.customUI.dropdown.noItems;
        }

        Group {
          Anchor: (Vertical: 16, Height: 1);
          Background: #5e512c;
        }

        Label {
          Text: %server.customUI.teleporter.warpName;
          Anchor: (Bottom: 7);
          Style: (...$C.@DefaultLabelStyle, RenderBold: true);
        }

        $C.@TextField #NewWarp {
          @Anchor = (Width: 60, Left: 0, Right: 16);
          PlaceholderText: %server.customUI.teleporter.warpName;
        }

        Label #ErrorLabel {
          Text: "This is an error";
          Style: (FontSize: 18, TextColor: #bb3333, RenderBold: true);
          Anchor: (Top: 8);
          Visible:  false;
        }
      }

      Group #Buttons {
        LayoutMode: Top;
        Visible: true;

        Group {
          Anchor: (Bottom: 16, Height: 1);
          Background: #5e512c;
        }

        $C.@TextButton #SaveButton {
          Text: %server.customUI.saveChanges;
        }
      }
    }
  }
}

$C.@BackButton {}