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

This is an old revision of the document!


<insert back button>

Design Menu Page Margins

The Page Margins dialog controls the usable area of your page. Think of margins as an invisible frame inside the physical edges of your device's screen. All of your content (icons, widgets, etc.) will be contained within this frame.

The primary purpose of page margins is to create a safe area for your layout, preventing content from being hidden by system elements like screen notches, status bars, or navigation gesture areas.

Dialog selections are discussed below the image. Only the OK button is available to make a selection in the Design Menu Page Margins image.

Design Menu Page Margins

OK

Design Menu Page Margins dialog.

Margins could simply be said to be a way of managing space surrounding the page which separates content (icons, widgets, folders) from the device’s screen physical edge, sort of like a frame around a canvas. Smaller margins make more space available for the screen. Page margins in TL affect that frame:

  • Positive margins will reduce the size and position of that frame. Objects in TL will have less space in which to be positioned on the page and screen. This may be required to avoid issues with gesture, controls, notches, cutouts, navigation or status bars.
  • Negative margins will create an area on that side of the page (top, bottom, left, or right) which will not be seen on the screen.
    • Normally, the page will not scroll, even with negative margins. However, there are some techniques to create vertical page scrolling. See Page Scrolling.

Page margins are a design tool which can provide a more consistent result across pages or devices (especially Multi-Screen Devices).

The above design menu page margin dialog image shows controls for

  • left, right, top, and bottom - each adjusted separately if desired. Each element must be changed individually and each page in a user's setup offers a margin control.
    • While documentation does not describe the measurement unit it will be more understandable to use the unit dip (density-independent pixel). Total Launcher excels in supporting development of setups/layouts across Android devices of varying screen size, resolutions, and pixel density (pixels per inch or ppi). This methodology is one of the better practices for layout dimension, margin padding, and other UI components.
    • The default setting is 0, but there is a maximum positive range of the device's screen resolution. The range The device used for this wiki's images and videos is 1080×2400.
      • Positive Numbers will increase the size of the respective border resulting in a loss of usable screen space but can be used to avoid system mechanics or for design aesthetics.
        • While TL permit any positive number, practicality limits to usable number (again, based on the user's device resolution):
          • equal to the device's width (e.g. 1080) or height (e.g. 2400) results in no viewable page/screen area for right/left (1080) or top/bottom (2400)
          • 1/2 of those number would make 3/4 of the page/screen unavailable.
      • Negative Numbers will decrease a border giving more space allocation for objects although objects touching that space begin to become partially, then totally, unviewable, a possible user objective. It will not provide for a scrolling page, either vertically or horizontally.
    • This gives a better understanding of the progression of the impact of positive page margin numbers. Typically, page margin are used to avoid cutouts, system navigation bars, or other aesthetic design purposes. With this understanding, there is no suggested numbers … pick a number to meet the need.
  • Suggest - tap it to learn if any margin numbers are proposed by internal dynamics of TL. Results are usually returned when margins are being adjusted in an object if the object contains a shadow or offset option. See Text Object Options, Layout Options
  • OK - Tap to accept the margin numbers shown. Returns the user to previous page.

Visual demos of the effects of page margins are seen for positive page margins and for negative page margins.

For scrolling a page the Page Options dialog's Fit the content to the screen height (make it not scrollable) must be unchecked. See Page Scrolling - Vertical on how a vertically scrolling page can be created.

A somewhat related concept to managing page space is the alignment tool discussed Object Alignment. It is a quasi-grid tool, in that it assists in the centering, edge matching, vertical and horizontal positioning.


Dialog Selections

The dialog provides the following controls to define the page's internal frame:

  • Margin Value Fields (top, bottom, left, and right):
    1. These four fields allow you to input a number to define the size of the margin on each respective side of the page. Each side is controlled individually.
    2. Measurement Unit: While not labeled, the unit is best understood as dip (density-independent pixel). This ensures your layout remains consistent on Android devices with different screen sizes and resolutions.
    3. Positive Numbers: A positive value increases the size of the invisible frame on that side, reducing the usable screen space. This is the standard way to avoid system UI elements.
      1. A very large value can have a dramatic effect. For example, on a 1080×2400 screen, a 'left' margin of 1080 would result in no viewable page area.
    4. Negative Numbers: A negative value decreases the border, effectively pushing the page's canvas off the screen on that side. Any content placed in this negative margin area will be partially or totally unviewable. This is an advanced technique for specific design objectives.
  • SUGGEST:
    1. Tap this button to have Total Launcher propose margin values. It may suggest numbers to account for system navigation bars or other dynamics it can detect.
  • OK:
    1. Tap to accept the margin numbers shown and return to the previous screen.

Important Considerations

  • Scrolling: Setting a negative margin to push content off-screen does not automatically enable scrolling. To create a vertically scrolling page, you must uncheck the 'Fit the content to the screen height' option in the main Page Options. See Page Scrolling.
  • Object Positioning: Page margins define the canvas area. To position objects precisely *within* this area, use the tool discussed in Object Alignment.

Discussion

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