2. Setup

297 September 12, 2023

Canvas:

To get started, add either the Canvas Default or Canvas Scroll View prefab from Assets/Saari.Tech/StatusNavigation/Prefabs/ to your scene. Don’t forget to include the EventSystem as well.

You can find the Mobile Status Navigation Bar component within the hierarchy of either Canvas Default/Safe Zone or Canvas Scroll View/Safe Zone

The Mobile Status Navigation Bar component looks like this:

The component provides the following features:

  1. Linked RectTransforms: Connected status bar and navigation bar.
  2. Dark Mode: Set the background color for the bars to dark mode.
  3. Light Mode: Set the background color for the bars to light mode.
  4. Display Status & Navigation: Enable this option to show both or one of the bars in your application.
  5. Start Light Mode: Disable this option to start in dark mode.
  6. Editor Preview Status Label: By default, it displays “Editor”.
  7. Back Button On Click: Define the code to be executed when the mobile back button is clicked.
  8. Debug Mode: Gives a log of what actually happened, useful for debugging.

Remove In-Device Debug Code (Optional):

To improve device performance, insert NODEBUG into the Scripting Define Symbols in the Player Settings. With this setting, it will not compile the debug code into the mobile devices but they still run in Unity Editor.

Improve the User Experience at Startup (Optional):

To ensure the smooth display of the status and navigation bar from the outset of your app, without any abrupt appearance after the splash screen, follow these steps:

  1. Android: In the Android Player Settings, navigate to the Resolution and Presentation section. Make sure that the Hide Navigation Bar option is unchecked.
  2. iOS: For iOS devices, access the iOS Player Settings and proceed to the Resolution and Presentation settings. Confirm that the Status Bar Hidden option is also unchecked.

By configuring these settings appropriately, you’ll be able to establish your desired status and navigation bar appearance right from the splash screen’s commencement. With these settings, you will able to set up your Status & Navigation bar during Splash Screen later in the C# Code Part 2.

These features combine to create a versatile and customizable for your application. Next, let’s integrate the code to access additional functions and unlock more capabilities.