meta data for this page
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| howto:howto-window-create_simple [2026/07/16 17:20] – doreps | howto:howto-window-create_simple [2026/07/19 12:00] (current) – ↷ Links adapted because of a move operation doreps | ||
|---|---|---|---|
| Line 2: | Line 2: | ||
| Mastering Android interface customization requires precise control over container elements and layout properties. This tutorial outlines the exact procedure for creating a functional window container that hosts application widgets within the Total Launcher ecosystem. By establishing a solid visual foundation, designers and enthusiasts can avoid common configuration pitfalls, such as unintentionally deploying transparent, | Mastering Android interface customization requires precise control over container elements and layout properties. This tutorial outlines the exact procedure for creating a functional window container that hosts application widgets within the Total Launcher ecosystem. By establishing a solid visual foundation, designers and enthusiasts can avoid common configuration pitfalls, such as unintentionally deploying transparent, | ||
| - | |||
| - | ===== Window: Create (simple) ===== | ||
| <WRAP GROUP> | <WRAP GROUP> | ||
| Line 21: | Line 19: | ||
| Since the above TIP has been mentioned, the procedure includes the " | Since the above TIP has been mentioned, the procedure includes the " | ||
| + | |||
| + | ===== Window: Create (simple) ===== | ||
| == Step 1 == | == Step 1 == | ||
| - | * On the home screen, enter Edit On mode (see[[section: | + | * On the home screen, enter Edit On mode (see[[section: |
| == Step 2 == | == Step 2 == | ||
| * In the to Object Design Menu tap the {{ui: | * In the to Object Design Menu tap the {{ui: | ||
| Line 43: | Line 43: | ||
| - Tap OK | - Tap OK | ||
| == Step 6 == | == Step 6 == | ||
| - | * Tap the Action icon {{ui: | + | * Tap the Action icon {{ui: |
| - Edit (pencil) {{ui: | - Edit (pencil) {{ui: | ||
| * bulb handles on its boundaries used to downsize the window | * bulb handles on its boundaries used to downsize the window | ||
| - | *Option icon {{ui: | + | *Option icon {{ui: |
| * While the Edit and Option dialogs will not be discussed here, more information is available at [[admin: | * While the Edit and Option dialogs will not be discussed here, more information is available at [[admin: | ||
| - Add icon {{ui: | - Add icon {{ui: | ||
| Line 55: | Line 55: | ||
| - Back out of the dialog by swiping right-to-left again | - Back out of the dialog by swiping right-to-left again | ||
| == Step 7 == | == Step 7 == | ||
| - | - The new " | + | - The new " |
| * The " | * The " | ||
| * Resize and position on the screen as desired | * Resize and position on the screen as desired | ||
| Line 61: | Line 61: | ||
| - The window object icon, which activates the window, is on the page with its default image. | - The window object icon, which activates the window, is on the page with its default image. | ||
| - This image can be changed by selecting the object (tap and hold to highlight), which opens the top Object Design Menu. | - This image can be changed by selecting the object (tap and hold to highlight), which opens the top Object Design Menu. | ||
| - | - The top Object Design Menu Option icon {{ui: | + | - The top Object Design Menu Option icon {{ui: |
| * Tap the Image field to open the Image selection categories. | * Tap the Image field to open the Image selection categories. | ||
| * Experiment with the Image and Icon Pack categories. | * Experiment with the Image and Icon Pack categories. | ||
| Line 68: | Line 68: | ||
| - The window object icon must be selected, then ... | - The window object icon must be selected, then ... | ||
| * Tap the top Object Design Menu Action icon {{ui: | * Tap the top Object Design Menu Action icon {{ui: | ||
| - | - The Action dialog opens ++(see image). | {{:howto:howto-window-create-object-tap_action-dialog.webp? | + | - The Action dialog opens ++(see image). | {{ui:ui-window-placeholder-action-dialog-v4.webp? |
| - Scroll to view the various actions available. In this example, use '' | - Scroll to view the various actions available. In this example, use '' | ||
| - | * Select Tap > '' | + | * Select Tap > '' |
| - | * Select Window to open the Window-Portrait dialog ++(see image) | {{:howto:howto-window_create-window_object-window_portrait_dialog.webp? | + | * Select Window to open the Window-Portrait dialog ++(see image) | {{ui:ui-window-portrait-v4.webp.webp? |
| * Scroll the dialog to find and select the example '' | * Scroll the dialog to find and select the example '' | ||
| * TL now returns to the previous Action On Tap dialog (Tap) and shows the tap action will open the '' | * TL now returns to the previous Action On Tap dialog (Tap) and shows the tap action will open the '' | ||
| Line 78: | Line 78: | ||
| - If the widget was not previously added, it can now be added. | - If the widget was not previously added, it can now be added. | ||
| <WRAP Pagebreak /> | <WRAP Pagebreak /> | ||
| - | === Window: Add an Existing Widget to a Window after the Window Has Been Created === | + | ===== Window: Add an Existing Widget to a Window after the Window Has Been Created |
| - There are two ways to add an object to a window: | - There are two ways to add an object to a window: | ||
| Line 86: | Line 86: | ||
| - Enter Edit On mode | - Enter Edit On mode | ||
| - From the top Object Design Menu select the Object Add icon {{ui: | - From the top Object Design Menu select the Object Add icon {{ui: | ||
| - | - The Add dialog opens ++(see image). | {{:howto:howto-window_create-widget-add.webp? | + | - The Add dialog opens ++(see image). | {{:ui-object_add-selection-v4.webp? |
| * Select Widget | * Select Widget | ||
| * Select any desired object, but in this procedure, '' | * Select any desired object, but in this procedure, '' | ||
| - | * Note: There are 3 types of application drawers and 1 contact " | + | * Note: There are 3 types of application drawers and 1 contact " |
| - The App drawer widget is now on a page, centered. Tap-hold and drag to relocate so that it does not block access to the other object(s) which will activate the window. | - The App drawer widget is now on a page, centered. Tap-hold and drag to relocate so that it does not block access to the other object(s) which will activate the window. | ||
| - The App drawer widget is on the screen and **is selected**. The following steps will place the widget within the window: | - The App drawer widget is on the screen and **is selected**. The following steps will place the widget within the window: | ||
| Line 95: | Line 95: | ||
| - Now, to paste the copied widget into the window. Open the target window (tap the window widget) | - Now, to paste the copied widget into the window. Open the target window (tap the window widget) | ||
| * In the upper right corner, tap the {{ui: | * In the upper right corner, tap the {{ui: | ||
| - | - From the Add dialog, select '' | + | - From the Add dialog, select '' |
| * The " | * The " | ||
| - Close the window by either tapping a blank space outside the window (if the full-screen window has been downsized earlier, there should be enough edge space to do so) //or// by swiping right-to-left. | - Close the window by either tapping a blank space outside the window (if the full-screen window has been downsized earlier, there should be enough edge space to do so) //or// by swiping right-to-left. | ||
| - The page still contains the original App drawer widget. Since that widget is //now// contained in the window, it is proper to delete the original App Drawer widget from the page. | - The page still contains the original App drawer widget. Since that widget is //now// contained in the window, it is proper to delete the original App Drawer widget from the page. | ||
| * In Edit On mode, tap and hold the App Drawer widget to select it. | * In Edit On mode, tap and hold the App Drawer widget to select it. | ||
| - | * Fron the Object Design Menu, select the Delete icon {{ui: | + | * From the Object Design Menu, select the Delete icon {{ui: |
| * The Confirm - Remove Selections dialog opens. Select OK | * The Confirm - Remove Selections dialog opens. Select OK | ||
| * The widget is removed | * The widget is removed | ||
| **The project is completed.** | **The project is completed.** | ||
| - | <WRAP center round info 60%> | + | <WRAP center round info 80%> |
| - | A [[feature_requests: | + | A [[feature_requests: |
| </ | </ | ||
| - | |||
| - | |||
| <WRAP noprint> | <WRAP noprint> | ||