meta data for this page
  •  

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
section:section-margins-page_and_object [2026/04/21 13:13] – dorepssection:section-margins-page_and_object [2026/05/10 18:09] (current) – external edit 127.0.0.1
Line 5: Line 5:
   * Object   * Object
 This guide explains how to use margins in both contexts. The term 'padding' is not used in the Total Launcher interface; all space management of this type is controlled via ''Margin'' or ''Item spacing'' settings. This guide explains how to use margins in both contexts. The term 'padding' is not used in the Total Launcher interface; all space management of this type is controlled via ''Margin'' or ''Item spacing'' settings.
- 
-===== Margin Dialog ===== 
-{{:section:section-margins-dialog.png?200|Generic Margin Dialog}} 
  
 ===== Page Margins ===== ===== Page Margins =====
Line 14: Line 11:
  
    *   **Purpose:** The primary use for page margins is to prevent objects from being placed in areas where they might be obscured or interfere with system elements. This includes screen notches, status bars, navigation bars, or gesture areas at the edges of the screen.    *   **Purpose:** The primary use for page margins is to prevent objects from being placed in areas where they might be obscured or interfere with system elements. This includes screen notches, status bars, navigation bars, or gesture areas at the edges of the screen.
-   *   **Effect:** Increasing the margin values (e.g., for 'top', 'bottom', 'left', or 'right') will shrink the available workspace, pushing all content inward, away from that respective edge. A value of '0' allows content to be placed right up to the very edge of the device's screen.+   *   **Positive Margin Effect:** Increasing the margin values (e.g., for 'top', 'bottom', 'left', or 'right') will shrink the available workspace, pushing all content inward, away from that respective edge. A value of '0' allows content to be placed right up to the very edge of the device's screen. 
 +   *   **Negative Margin Effect:** A negative margin will push the page's canvas **off the screen** on that side. This creates an area where content can be placed but will not be visible. This is an advanced technique, sometimes used intentionally to hide parts of a layout. 
 +<WRAP center round tip> 
 +By default, the page will not scroll, even with negative margins that push content off-screen. To create a scrolling page, the 'Fit the content to the screen height' option must be unchecked in Page Options. 
 +</WRAP>
  
 ===== Object Margins ===== ===== Object Margins =====
Line 21: Line 22:
   * a simple object or    * a simple object or 
   * a container object   * a container object
- 
-{{:ui:ui-edit_on-design_menu-page_margins.png?nolink|The Margins Dialog for Pages and Objects.}} 
  
 ==== Simple Objects (e.g., Icons, Text, Images) ==== ==== Simple Objects (e.g., Icons, Text, Images) ====
Line 37: Line 36:
  
 ===== Margin Dialog Controls ===== ===== Margin Dialog Controls =====
 +{{:section:section-margins-dialog.webp?200|Generic Margin Dialog  }}\\ 
  
-The dialog for adjusting margins is consistent for both Page and Object. +   * **left, right, top, and bottom:** - Each value is adjusted separately for precise control. 
- +   * **Measurement Unit and Range:** 
-   * **left, right, top, and bottom:** - Each value is adjusted separately, allowing for precise and asymmetrical control over spacing. +      * While not explicitly stated, the unit is best understood as **dip (density-independent pixel)**. This ensures layouts are consistent across Android devices with different screen sizes and resolutions. 
-   * **Positive Numbers:** Increase the defined space. For a Page or Container, this shrinks the content area. For a Simple Object, this pushes other objects further away. +      * The default setting is ''0''. The maximum positive range is the device's screen resolution (such as 1080 for width, 2400 for height). 
-   * **Negative Numbers:** Decrease the space. This is only applicable to Simple Objects and will cause them to expand beyond their cell boundaries, creating an overlap effect. +   * **Positive Numbers:** Increases the defined space. 
-   * **Suggest:** - Tap to have Total Launcher automatically calculate margin values. This is useful when an object has effects like a shadow that extend beyond its normal boundaries, ensuring the effect is not clipped.+      * For a **Page or Container**, this shrinks the usable content area. [+] Practicality limits this; setting a margin equal to the screen width will result in no viewable area. 
 +      * For a **Simple Object**, this pushes other objects further away. 
 +   * **Negative Numbers:** Decreases the defined space, with different effects: 
 +      * For a **Page**, this pushes the content canvas off-screen, making it **partially or totally unviewable**. 
 +      * For a **Simple Object**, this causes it to expand beyond its cell boundaries and **create an overlap effect** with adjacent items. 
 +   * **Suggest:** - Tap to automatically calculate margin values, which is useful for objects with effects like a shadow to ensure the effect is not clipped.
    * **OK:** - Tap to accept the margin numbers shown.    * **OK:** - Tap to accept the margin numbers shown.
  
-===== Related Concept - Item Spacing ===== +===== Related Concepts =====
- +
-While ''Margin'' controls space around the borders, a different setting, **Item spacing**, is used within container objects like Folders, Sliding Drawers, Widgets (App Drawer, App Drawer (pager), App Group, Contacts, and App Search.+
  
 +   * **Item Spacing:** While 'Margin' controls space around borders, 'Item spacing' is used within container objects (like Folders, Sliding Drawers, Widgets (App Drawer, App Drawer (pager), App Group, Contacts, and App Search) to control the space **between the individual items** inside.
    *   **Description:** This setting exclusively controls the amount of empty space **between the individual items** held inside a container. It does not affect the container's margin (the space between the items and the container's edge).    *   **Description:** This setting exclusively controls the amount of empty space **between the individual items** held inside a container. It does not affect the container's margin (the space between the items and the container's edge).
    *   **Analogy:** This feature can be thought of as applying a "padding" //between// each item in the grid, spreading them out from each other.    *   **Analogy:** This feature can be thought of as applying a "padding" //between// each item in the grid, spreading them out from each other.
    *   **How to Choose a Value:** The input quantity (range of 0 - 288) is determined by visual preference and usability. There is no single "correct" value. A user should adjust the number and observe the result, balancing aesthetic appearance (a clean, airy look) with usability (ensuring icons are not so close that they are hard to tap accurately).    *   **How to Choose a Value:** The input quantity (range of 0 - 288) is determined by visual preference and usability. There is no single "correct" value. A user should adjust the number and observe the result, balancing aesthetic appearance (a clean, airy look) with usability (ensuring icons are not so close that they are hard to tap accurately).
 +<WRAP center round tip>
 +<WRAP centeralign>**Object Alignment:** For positioning objects relative to each other or the page, the alignment tool offers assistance with centering, edge matching, and distribution. It is a complementary tool to margins for creating precise layouts.
 +</WRAP>
 +</WRAP>
  
 <WRAP noprint>{{page>site:site-footer-comment_feedback_block}}</WRAP> <WRAP noprint>{{page>site:site-footer-comment_feedback_block}}</WRAP>