Bottom bar customization - GluedIn
Introduction
This document shares detailed integration steps to customized the Bottom Navigation Bar of the GluedIn SDK.
Steps to Integrate
Below are the define steps to follow if you want to customized the Bottom Navigation Bar of the GluedIn SDK.
Note:Currently only No Code GluedIn SDK have this support.
  • Integrate the GluedIn No Code GluedIn SDK into your app by following the steps mentioned in the Link.
  • Set the below configuration in GluedInConfiguration class to customise the bottom bar.
    
    .enableBottomBar(boolean) // Make true if you wish to enable bottom bar in the SDK
    
  • Customised the bottom bar theme colour:
    
    {
      "themeConfig": {
        "appColor": {
          ..............
          "bottomBarBackgroundColor": "",
          "bottomBarTextColor": "",
          "bottomBarSelectedColor": ""
        },
        "appFont": {
          .............
        }
      }
    }
    
  • Customised bottom bar tab name: You can create custom menu using below method to customise the menu name and icons
    
    {
      .setCustomNavigationMenu(getMenuItem())
    
    private fun getMenuItem(): MutableMap {
            val map = mutableMapOf()
            map[BottomBarItemType.CUSTOMISED.name] = getHomeItem()
            map[BottomBarItemType.DISCOVER.name] = getDiscoverItem()
            map[BottomBarItemType.CREATOR.name] = getCreatorItem()
            map[BottomBarItemType.FEED.name] = getFeedItem()
            map[BottomBarItemType.PROFILE.name] = getProfileItem()
            map[BottomBarItemType.NOTIFICATION.name] = getNotificationItem()        
            return map
    }
    
    private fun getHomeItem(): MenuItem {
        return MenuItem(
            title = "Custom Home",
            icon = R.drawable.ic_custom,
            type = BottomBarItemType.CUSTOMISED,
            uriAction = "https://www.gluedin.io/"
        )
    }
    
    private fun getDiscoverItem(): MenuItem {
        return MenuItem(
            title = "Discover", icon = R.drawable.ic_discover, type = BottomBarItemType.DISCOVER
        )
    }
    
    private fun getCreatorItem(): MenuItem {
        return MenuItem(
            title = "Exp", icon = R.drawable.ic_mi, type = BottomBarItemType.CREATOR
        )
    }
    
    private fun getFeedItem(): MenuItem {
        return MenuItem(
            title = "Feed", icon = R.drawable.ic_feed, type = BottomBarItemType.FEED
        )
    }
    
    private fun getProfileItem(): MenuItem {
        return MenuItem(
            title = "Profile", icon = R.drawable.ic_profile, type = BottomBarItemType.PROFILE
        )
    }
    
    private fun getNotificationItem(): MenuItem {
        return MenuItem(
            title = "Notification", icon = R.drawable.ic_notification, type = BottomBarItemType.NOTIFICATION
        )
    }
    
Limitations
  • You can add only one menu of your own choice.
  • You can only customise the Icon & Name of the default menus.