Interface DynamicBottomBarConfig

Shape of the eitriConfig.dynamicBottomBar node in the eitri environment configs — the initial description of the dynamic bottom bar, applied when the bar first appears.

This node is the bar's source of truth: everything visible — how many tabs there are, their icons and titles, the colors, fonts and layout — is defined here. Editing it is how the bar is configured, and the change reaches users without a new app release.

The node splits in two: layout holds everything visual, and eitriApps holds the tabs (navigation). Once the app is running, DynamicBottomBar.updateStyle can restyle the live bar and DynamicBottomBar.resetStyle restores it to exactly this config.

The example below shows the node fully filled in, to illustrate where each field sits. Only eitriApps is required — every other field can be omitted and falls back to its default.

"eitriConfig": {
  "dynamicBottomBar": {
    "layout": {
      "theme": "classic",
      "backgroundColor": "#FFFFFF",
      "selectedColor": "#373737",
      "unselectedColor": "#8B8D98",
      "fontFamily": { "android": "opensans_regular", "ios": "OpenSans-Regular" },
      "selectedFontFamily": { "android": "opensans_bold", "ios": "OpenSans-Bold" },
      "themeCustomizations": {
        "classic": {
          "labels": "shown",
          "topBorder": { "thickness": 1, "color": "#DBDDE0" },
          "iconSize": 24,
          "labelFontSize": 12,
          "iconLabelSpacing": 2,
          "paddingTop": 6,
          "paddingBottom": 6
        }
      }
    },
    "eitriApps": [
      {
        "slug": "eitri-home",
        "title": "Home",
        "icon": "https://media-eitri-content.eitri.tech/brand/icon_home.png",
        "initParams": { "tabIndex": 0 }
      },
      {
        "slug": "eitri-cart",
        "title": "Sacola",
        "icon": "https://media-eitri-content.eitri.tech/brand/icon_bag.png",
        "initParams": { "tabIndex": 1 },
        "badge": "3"
      }
    ]
  }
}
Copy