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-ui_anim-sliding_drawer [2026/07/30 19:15] – ↷ Links adapted because of a move operation dorepssection:section-ui_anim-sliding_drawer [2026/07/30 21:06] (current) – doreps
Line 1: Line 1:
-<WRAP hide>%%<!-- googleoff: index -->%%</WRAP> +====== Total Launcher Sliding Drawer: Configuring Off-Screen App Shelves and Panels   ======
-<WRAP center notice centeralign> +
-**⚠️ 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.// +
-</WRAP> +
-<WRAP hide>%%<!-- googleon: index -->%%</WRAP>+
  
 +The Sliding Drawer in Total Launcher provides a built-in, off-screen workspace attached directly to any screen edge. Functioning similarly to a native notification shade, this hidden panel expands inward via edge gestures to expose user-defined app grids, widgets, and custom shortcuts without cluttering the primary homescreen canvas. Because the launcher automatically handles panel creation and gesture mapping upon activation, deploying a sliding drawer offers an immediate solution for building hidden widget shelves or custom app drawers. The following guide details the setup procedure, interface advantages, and edge-gesture priority rules.
  
 +<WRAP center 80%>
 +^  **Sliding Drawer Interface Preview**  ^^^
 +| {{:section:section-ui_anim-sliding_drawer-v4.webp?direct&200|Sliding Drawer Menu}} | ☛ The **Sliding Drawer** is a built-in\\ workspace hidden off-screen.\\ Demo ☛ | {{:section:section-ui_anim-sliding_drawer-video-v4.gif?|Sliding Drawer Demo}} |
 +</WRAP>
  
----- +It is a distinct screen area attached to the Left, Right, Top, or Bottom edge of the display. While it could be considered a "window" (another feature of Total Launcher which would have to be built from scratch), the Sliding Drawer is a system feature which is simply "turned on," and the launcher handles its creation. It populates automatically with all device apps (similar to the App drawer widget.
- +
- +
-===== Sliding Drawer   ===== +
- +
-| {{section:section-ui_anim-sliding_drawer-v4.webp?200}} |  ☚ The **Sliding \\ Drawer** is a \\ built-in workspace\\ hidden off-screen.\\ Demo ☛  | {{section:section-ui_anim-sliding_drawer-video-v4.gif}} |  +
- +
-It is a distinct screen area attached to the Left, Right, Top, or Bottom edge of the display. While it could be consider a "window" (another feature of Total Launcher which would have to be built from scratch) the Sliding Drawer is a system feature which is simply "turned on," and the launcher handles its creation. It defaults to an //empty// container.+
    
 It works exactly like the "Notification Shade" on the device, but can be placed in 4 different locations and contain user-selected widgets, apps, and folders. It works exactly like the "Notification Shade" on the device, but can be placed in 4 different locations and contain user-selected widgets, apps, and folders.
Line 23: Line 14:
 ==== How to Enable ==== ==== How to Enable ====
  
-  - Enter [[:section:section-basic_editing#to_enter_edit_mode|Edit Mode]] > ''Launcher options'' {{:ui:ui-menu-launcher_options-v4.webp?direct&30}} > ''UI & Animations'' > ''Sliding drawer''+  - Enter [[:section:section-basic_editing#to_enter_edit_mode|Edit Mode]] > ''Launcher options'' {{:ui:ui-menu-launcher_options-v4.webp?direct&30|Launcher options icon}} > ''UI & Animations'' > ''Sliding drawer''
   - Choose ''On the left'' (or ..right/..top/..bottom)   - Choose ''On the left'' (or ..right/..top/..bottom)
   - Exit the menu. A swipe from that edge opens the new drawer with all device apps.   - Exit the menu. A swipe from that edge opens the new drawer with all device apps.
  
-==== What the Sliding Drawer Offers ====+===== Practical Interface Solutions =====
  
-The built-in Sliding Drawer is designed to solve specific interface problems for new users.+Enabling a Sliding Drawer solves common layout challenges by keeping secondary elements accessible yet hidden:
  
-* **The "All Apps" Solution:** +  * **Custom "All Apps" Panel:** 
-  * Instead of having all app icons cluttering the home screen, enable the **Bottom Sliding Drawer**. Place an "App Drawer Widget" inside it. Now, the classic "Swipe up for apps" behavior found in Pixel and Samsung phones, but fully customizable. +    * Instead of crowding the main workspace with app icons, enable the **Bottom Sliding Drawer** and place an App Drawer object inside. This replicates the standard "Swipe up for apps" interaction while allowing total control over grid sizing and background styling. 
-* **The Widget Shelf:** +  * **The Hidden Widget Shelf:** 
-  * There may be a preference for a Calendar and Weather widget, but these obstruct the wallpaper. Instead, enable the **Left Sliding Drawer**. Place them in the drawer so they're accessible with one swipe, but never in the way. +    * Place large, information-dense widgets (such as calendars, weather graphs, or music controllers) inside a **Left Sliding Drawer**. They remain accessible with a single swipe without obscuring desktop wallpapers. 
-* **Dock Replacement:** +  * **Extended Dock Replacement:** 
-  * Instead of a tiny row of 5 icons at the bottom (a dock), use a sliding drawer to hold 20 favorite shortcuts or objects.+    * Replace a restrictive 5-icon static dock with a sliding drawer containing multiple rows of favorite applications, Tasker shortcuts, or contact cards.
  
-==== Tips ====+===== Important Technical Rules ===== 
 + 
 +  * **Edge Priority:**  
 +    * The Sliding Drawer overrides standard page gestures along the extreme screen boundary. For example, enabling a **Left Sliding Drawer** takes priority over a global "Swipe Right" page gesture when initiated from the outer bezel edge. 
 +  * **Independent Grid Geometry:** 
 +    * Each drawer operates as an independent container with its own grid configuration. A sparse 4x4 layout can be maintained on the main homescreen page while utilizing a dense 6x10 grid inside the drawer. 
 +  * **Button and Gesture Triggers:** 
 +    * In addition to edge swipes, drawers can be toggled remotely by assigning a [[:section:section-launcher_actions|Launcher Action]] (e.g., `Open [Direction] drawer`) to any graphic button, icon, or double-tap gesture. 
 + 
 +<WRAP round tip> 
 +**System Gesture Tip:** If edge swipes conflict with Android gesture navigation (such as the system "Back" gesture on the left or right screen border), consider utilizing a **Top** or **Bottom** sliding drawer, or trigger the drawer exclusively via a [[:section:section-launcher_action#windows_drawers|Launcher Action]] assigned to a button. The Launcher also offers a [[ui:ui-widget-drawer_handle|Widget: Drawer handle]], a default `chevron` that can be modified to rest in the screen edge area. 
 +</WRAP>
  
-Understand the "rules" of this specific feature:+===== Related Concepts =====
  
-* **Edge Priority:**  +  * **[[:section:section-gestures|Total Launcher Gesture Guide]]** 
-  * The Sliding Drawer overrides other gestures on the very edge of the screen. When setting a "Swipe Right" gesture on the background *and* enabling a "On the left Sliding Drawer," the drawer takes priority for the swipe from the edge. +  * **[[:section:section-widget#widgetapp_drawer|Widgets - App Drawer]]**
-* **Independent Geometry:** +
-  * The drawer is essentially a separate "Page". +
-  * It has its own grid for each separate object created, such as a 4x4 grid on the home screen and a dense 6x10 grid inside the drawer.+
  
 ==== More Information ==== ==== More Information ====
  
-Additional discussion can be found [[:ui:ui-ui_anim-sliding_drawer|here]] in the wiki's "ui" section.+Additional discussion can be found **[[:ui:ui-ui_anim-sliding_drawer|here]]** in the wiki's "ui" section.
  
 <WRAP noprint>{{page>site:site-footer-comment_feedback_block}}</WRAP> <WRAP noprint>{{page>site:site-footer-comment_feedback_block}}</WRAP>