Create Muk Nav Bar #
To create Muk Nav Bar, right-click in the Hierarchy > Muk > Nav Bar. You will see a new object(MukNavBarCanvas) created in the Hierarchy. since Navbar needs to be on top of all other Ui and iOS may have a blur effect on the Navbar. MukNavbar is rendering in Screen Space – Overlay render mode.
Muk Nav Bar Canvas - Properties #
Property | Desciption | Value |
|---|---|---|
Canvas Type | What kind of canvas is this. (Nav 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 Nav Bar - Properties #
Go to MukNavBarCanvas > Container > MukNavBar, You can edit all the settings in Inspector > MukNavBar. 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. |
Title | The title text for the center text in nav bar | |
Override NavBar Color | Should override the background color of the nav 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 Title color | Should override the title text color of the nav 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. |
Overrider Underline color (iOS only) | Should override the underline color of the nav 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 shadow color (Material only) | Should override the shadow color of the nav 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. |
Right Icons | Array of icon data for the right buttons (Max can have 3) |
Customizing Muk Nav Bar #
Go to MukNavBarCanvas > Container > MukNavBar, you will see there are two objects inside MukNavBar (ios_nav_bar for iOS UI & material_nav_bar for material design). Both objects have a child called Content, and inside Content, you will see three objects (Left, Center & Right). You can add/delete anything inside Content.
Left #
The Left object is for the back button. For iOS, it will have a back button title that is saved as previous scenes’ titles (if there are any). And it will have the native like back animation. You can delete this object and add anything you like. But note custom objects will only have fade animation when a scene is loading/removing.
Center #
The Center object is for the title. You can delete the title and add anything you like.
Right #
The right object is for the trail buttons. You can set up to three buttons in MukNavBar. You can delete the buttons and add anything you like.