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 | ||
| section:section-shadow [2026/05/10 18:09] – external edit 127.0.0.1 | section:section-shadow [2026/05/21 18:30] (current) – ↷ Links adapted because of a move operation doreps | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | {{https:// | ||
| - | |||
| - | < restructure this for improved flow > | ||
| ====== Resource - Shadow ====== | ====== Resource - Shadow ====== | ||
| Line 9: | Line 6: | ||
| Total Launcher relies on Android' | Total Launcher relies on Android' | ||
| - | ==== 1. To create a reliable drop shadow, follows these guidelines: ==== | + | ==== To create a reliable drop shadow, follows these guidelines: ==== |
| * **For a Solid Shadow:** - Assign the shape or picture/ | * **For a Solid Shadow:** - Assign the shape or picture/ | ||
| * **For a Hollow Ring Shadow:** - Applies a border width of at least '' | * **For a Hollow Ring Shadow:** - Applies a border width of at least '' | ||
| * **For ALL Shadows (The Margin Rule):** - Increases the object' | * **For ALL Shadows (The Margin Rule):** - Increases the object' | ||
| - | ==== 2. When a drop shadow is desired, avoids the following actions: ==== | + | ==== When a drop shadow is desired, avoids the following actions: ==== |
| * **0% Alpha Transparency: | * **0% Alpha Transparency: | ||
| * **Margins at 0:** - A zero margin forces the shape to touch the absolute edges of its container, leaving zero physical room on the canvas for the shadow to be drawn. | * **Margins at 0:** - A zero margin forces the shape to touch the absolute edges of its container, leaving zero physical room on the canvas for the shadow to be drawn. | ||
| Line 37: | Line 34: | ||
| {{tablelayout? | {{tablelayout? | ||
| ^ Shadow Add Dialog | ^ Shadow Add Dialog | ||
| - | | The Shadow Add dialog\\ {{: | + | | The Shadow Add dialog\\ {{: |
| - | ===== Practical Applications ===== - do samples and include how to procedure | + | ===== Practical Applications ===== |
| + | |||
| + | <do samples and include how to procedure> | ||
| The following are methods to apply shadows in object design: | The following are methods to apply shadows in object design: | ||
| * **Layered Image or Shape Frames:** - Acts as a strict clipping mask for a photograph with its own background frame to create a floating border effect. | * **Layered Image or Shape Frames:** - Acts as a strict clipping mask for a photograph with its own background frame to create a floating border effect. | ||
| Line 59: | Line 58: | ||
| * Prevent clipping by increasing the object' | * Prevent clipping by increasing the object' | ||
| * See the technical discussion [[: | * See the technical discussion [[: | ||
| - | |||
| * **Do not use 0% Alpha:** | * **Do not use 0% Alpha:** | ||
| Line 85: | Line 83: | ||
| * **Example: | * **Example: | ||
| - | > **Design Tip:** To test your shadows effectively, | + | <WRAP center round tip 60%> |
| - | + | **Design Tip:** To test your shadows effectively, | |
| - | Why this works for your manual | + | </WRAP> |
| - | * Directness: It addresses the " | + | |
| - | * Actionable Data: The " | + | |
| - | * Rule Integration: | + | |
| - | ===== UI Navigation Note: The Single-%%Slot%% Background ===== | + | ===== UI Navigation Note: The Single Slot Background ===== |
| When configuring a Graphic Object' | When configuring a Graphic Object' | ||
| - | * You can assign a Shape, an Image, a Color, | + | * A shape, an image, a color **or** a shadow can be assigned |
| - | * To apply a shadow based on a specific custom shape' | + | * To apply a shadow based on a specific custom shape' |
| ===== Performance Hits from Radius/Blur Use ===== | ===== Performance Hits from Radius/Blur Use ===== | ||