Create Muk Bottom Bar #
To create Muk Bottom Bar, right-click in the Hierarchy > Muk > Bottom Bar. You will see a new object(MukBottomBarCanvas) created in the Hierarchy. since Bottom Bar needs to be on top of all other UI and iOS may have a blur effect on the BottmBar. MukBottomBar is rendering in Screen Space – Overlay render mode.
Bottom Bar Notidication Badge #
You can show a red notification badge on the bottom bar items. To show the badge either set it in the properties setting or use the code as below.
using Muk;
public class MyClass {
[SerializeField] private MukBottomBar bottomBar;
private void Start()
{
// Set the first item has 9 unread message
bottomBar.SetBadge(1, 9);
}
}
Muk Bottom Bar Canvas - Properties #
Property | Desciption | Value |
|---|---|---|
Canvas Type | What kind of canvas is this. (Botton Bar) *Do not change this value, as it will affect the scene animation. | |
Show With Navigation | This show with the scene animation. | If you wish to show the scene with the platform scene animation. tick this option. *For the first scene, you should untick this, as it will not show anything if you ticked it. |
Muk Bottom Bar - Properties #
Go to MukBottomBarCanvas > Container > MukBottomBar, You can edit all the settings in Inspector > MukBottomBar. For details go througth the properties table below.
Property | Desciption | Value |
|---|---|---|
Platform Type | Which UI Platform should Muk Components display. | Device - Base on device. iOS UI for iOS device, Material design for others. iOS - iOS design. Material - Material design. |
Dark Mode | Use Dark mode or light mode. You can set color for each mode in theme settings. | Dark - Dark Mode. Light - Light Mode. |
SelectedIndex | The default selected index of the buttons. | |
Override Background Color | Should override the background color of the bottom bar? | If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings. |
Override Idle color | Should override the button color that's not selected? | If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings. |
Overrider Selected color | Should override the selected button color? | If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings. |
OnSelected | UnityEvent<int> for callback when user click the button, will pass the index to the function. | |
BottomBarItems | Array of BottomBarItem(Max can have 5). Can set the title and icon for each button here. |