meta data for this page
  •  
Translations of this page:
  • en

This is an old revision of the document!


<!-- googleoff: index -->

⚠️ v4.0 UI Transition Notice - In Process: The release of Total Launcher v4.0 has introduced significant user interface changes. Please note that this page does not yet reflect these updates. The new layout paths, folds, and visual maps are currently being compiled and will be deployed shortly.

<!-- googleon: index -->


Total Launcher Grid Layout Configuration: A Guide To Customizing Icons, Labels, and Backgrounds

Grid Layout Configuration

The Grid Layout Configuration dialog in Total Launcher provides comprehensive options for adjusting the visual presentation and interactive behavior of grid-based object groups. Modifying spatial arrangements, icon styling, typography, and background properties enables the creation of a highly functional and custom interface. This configuration menu dictates exactly how items align within a structured grid, ensuring precise control over the final design before moving into animation behaviors.

The Grid Layout Option Dialog

The grid layout option dialog is long, but is shown below in 5 sequential images.

For an expanded, easier view of this dialog, click below:
1 of 5
here
2 of 5
here
3 of 5
here
4 of 5
here
5 of 5
here

For better viewing, mobile users can select a tab below

Configuration Procedure

Follow the sequence to apply modifications to the layout grid:

  1. Enter Edit Mode. Tap the ''Edit Off'' icon in the lower right to change it to an ''Edit On'' icon
    1. Tap-hold the grid object to select it.
  2. Review the menu panels indicated at the bottom of the interface.
    1. Select ''OPTIONS'' to modify the static parameters.
    2. Select ''ANIMATION'' to adjust dynamic behaviors.
  3. Apply the desired variable changes within the respective menus.

Options - General

Configure the arrangement and behavior of the grid container.

  • Columns: - Define the number of vertical columns.
  • Rows: - Define the number of horizontal rows.
  • Launch animation: - Set the animation triggered upon launching an item. Note that this selection requires the PRO version upgrade.

Options - Launch sound

Assign specific device sounds to physical interactions when the grid is activated.

  • Tap: - Select the sound played upon a single tap.
  • Swipe up: - Select the sound played upon an upward swipe.
  • Swipe down: - Select the sound played upon a downward swipe.
  • Swipe left: - Select the sound played upon a leftward swipe.
  • Swipe right: - Select the sound played upon a rightward swipe.

Options - Icon

Modify the visual attributes of the icon images contained within the grid.

  • Icon size: - Adjust the overall size (scale) of the icons.
  • Icon padding: - Modify the internal space surrounding the icons.
  • Icon opacity (%): - Adjust the transparency level of the icons, utilizing values such as 100% for solid visibility.
  • Icon saturation (%): - Modify the color intensity, where 100% represents natural colors and reduced values approach grayscale.
  • Icon color filter: - Apply a specific color overlay or tint to all icons uniformly.

Options - Label

Control the display parameters and typography of the text associated with each grid item.

  • Show label: - Toggle the visibility state of the text labels to On or Off.
  • Typeface: - Select the specific font family applied to the label text.
  • Label lines: - Determine the maximum number of lines permitted for text wrapping, ranging from 1 to 3.
  • Font size: - Adjust the structural point size of the label text.
  • Scale X (%): - Stretch or compress the text width horizontally.
  • Text color: - Define the primary resting color of the text using the Launcher's Color Picker and apply a hexadecimal value such as #FFFFFFFF.]
  • Text color (pressed): - Same as Text color above, but changes the text color as the object is 'pressed' or tapped.

Options - Shadow

Apply drop shadows to text labels for enhanced contrast against varied backgrounds. See here for more detail on how to use Shadows.

  • Shadow color: - Select the hue of the underlying text shadow.
  • Shadow radius: - Control the blur, spread, or sharpness of the shadow effect.
  • Shadow offset X: - Shift the shadow position along the horizontal axis.
  • Shadow offset Y: - Shift the shadow position along the vertical axis.

Options - Background

Configure the container styling, individual item backgrounds, and spacing parameters.

  • Background: - Set the global color or image for the entire grid container.
  • Margins: - Define the external spacing outside the grid boundary, requiring specific integer values for left, top, right, and bottom.
  • Item background: - Set the resting background color or image for individual grid items.
  • Item background (pressed): - Set the background visual for individual grid items during a press interaction.
  • Item background (focused): - Set the background visual for individual grid items when navigated to via hardware controls or focus states.
  • Item spacing: - Adjust the internal gap distance between individual items placed within the grid structure.

Animation

  • To be completed

Discussion

Enter your comment. Wiki syntax is allowed:
Please solve the following equation to prove you're human. 135 +12 =