2 ‐ Creating own sections

What is a section?

A section in ModernTabs is just a sub part of the tab. These sections also have a banner assigned to them, so they can be located easier. By defining a section you can for instance split your items in different categories.

How to create a section?

In order for the creative tab sections to work properly, you need to create one JSON file for each creative tab section you want to have.
These json files have to be in the location: assets/mymod/moderntabs/sections/example_section.json and the defined section in your code has to match one json file in this location.

Example JSON file:

{
  "priority": 0,
  "sectionToggle": {
    "defaultState": "expanded",
    "orientation": "right"
  },
  "title": {
    "text": { "translate": "itemGroup.examplemod.basics" },
    "color": "#FFFFFF",
    "background": "#AA000000"
  },
  "banner": {
    "sprite": "examplemod:example_banner",
    "animation_mode": "play_on_hover",
    "color": "#D1FF03"
  },
  "overlay": {
    "sprite": "moderntabs:overlay/default_banner_overlay",
    "animation_mode": "not_animated",
    "color": "#D1FF03"
  }
}

Field	Type	Default	Notes
priority	positive int	0 (optional)	Lower values are drawn first (higher up in the tab).
sectionToggle.defaultState	TabButtonState	expanded (optional)	Defines the default state of the section - possible options are: expanded or collapsed
sectionToggle.orientation	ElementOrientation	right (optional)	Defines if the toggle button that shows the state of the section gets placed left, centered or right on the banner
title.text	Component	no default (required)	Any normal text/translatable component.
title.color	any html color code: "#RRGGBB" / "#AARRGGBB"	#FFFFFFFF (optional)	Primary text fill color.
title.secondary_color	any html color code: "#RRGGBB" / "#AARRGGBB"	20% darker than title.color (optional)	Outline/"aura" color.
title.background	any html color code: "#RRGGBB" / "#AARRGGBB"	#AA000000 (optional)	Background color of the pill behind the text.
title.orientation	ElementOrientation	left (optional)	Defines if the text gets placed left, centered or right on the banner
banner.sprite	sprite ID as a string	moderntabs:colored_banner or moderntabs:missing_banner (optional if a color is defined`	A texture under textures/gui/sprites/, 162×18 px per animation frame. If a color is defined the default is: "moderntabs:colored_banner" and if the color is not defined "moderntabs:missing_banner"
banner.color	any html color code: "#RRGGBB" / "#AARRGGBB"	#FFFFFFFF (optional)	Defines a color that the rendered sprite should be rendered in
banner.animation_mode	BannerAnimationMode	not_animated (optional)	Defines how the banner animation gets treated. Possible inputs are: not_animated, play_on_hover, play_continuously
overlay.sprite	sprite ID as a string	moderntabs:overlay/default_banner_overlay (optional)	A texture under textures/gui/sprites/, 162×18 px per animation frame. This is different to the banner as this sprite gets rendered on top of the main banner sprite/image
overlay.color	any html color code: "#RRGGBB" / "#AARRGGBB"	"#FFFFFFFF" (optional)	Defines a color that the rendered sprite should be rendered in
overlay.animation_mode	BannerAnimationMode	not_animated (optional)	Defines how the banner animation gets treated. Possible inputs are: not_animated, play_on_hover, play_continuously