System Settings | App Config

12 | App Layout | Tabs

This article outlines the Tabs located in App Layout Settings. This will explain the Functionality of the Tabs settings.

This article outlines the Tabs located in App Layout Settings. This will explain the Functionality of the Tabs settings.

These tabs will be viewable at the bottom of the app screens

 


Prerequisite
  • To access and edit the "Tab" setting, the following Role Privileges will need to be enabled
    • Roles "Roles Maintenance" panel
      • Privilege Flags: "App Config"

 

Tabs
  • Tabs are the buttons that display along the bottom of the Myplace app
  • Each tab button can be configured from the back panel 
  • An app will have 3 - 5 tab buttons

 

  • Each row in the list is a setup of one tab button
  • The first row will always point to the Home page

 

Tab Button Configurations

 

Function  Description
Number of Buttons
  • Click the dropdown field under 'Tabs Buttons' and select the desired number of buttons to apply in the app

    • The list will self-adjust based on users' selection
Order Icon
  • The Order icon will allow users to change the order in which the buttons will appear.
  • It opens a new panel where users can drag and drop in the preferred order and then click SAVE AND EXIT to save 
Tab
  • A unique number that shows the order of the buttons. It will start from 1 and go in descending order.
  • On the app, #1 will appear on the far left

Page Name 
  • Input a display title that will appear along with the icon/image

Icon
  • A field to input the name of an icon from font awesome
  • If the user does not know any names of icons. follow this link https://fontawesome.com/v5/search to find icons that can be used
  • Ensure that the icon is available in version 5 

Selector
  • A toggle that decides if an Icon or Image is to be used for the tab button
  • WHITE: button will display the icon that has been inputted in the Icon field
  • BLUE: Image is used and will display for the tab button
Image
  • A preferred picture that users can add to represent the tab button on the app
  • Selector toggle will need to be BLUE to enable this column for adding an image
  • To add an image follow these steps:
    1. Once the selector toggle is enabled, click the image area and file explorer will open
    2. Locate the desired picture and double-click it
    3. The picture will appear in a panel with a selection box
    4. use the corners of the box to scale the selection or move the box by clicking and dragging
    5. Once the selection is final click confirm and it will appear in the respective row of the image column
  • The colours of the image will be replaced with the 'buttons and cards' colour.
  • For more details on buttons can cards, view App Config | App Theme
  • Recommendation: Choose an image with a background in one solid colour
View
  • A dropdown list that will display the names of different screens available in the app
  • Selecting one will allow the tab button to open this page when it is clicked

       

Navigation  
  • This will change automatically based on the selection made in the view column.
  • This column will be greyed out and cannot be modified directly