%%%% **⚠️ 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.// %%%% ---- ===== Page Transitions - Animation Type ===== Dialog selections are discussed below the image. {{imapmarkers>:ui:ui-ui_anim-page_trans-selection.webp?direct&200|Page Transitions - Animation Type}} [[:ui:ui-ui_anim-page_trans|ID1|Sliding@22,45,177,62]] [[:ui:ui-ui_anim-page_trans|ID2|Sliding (3D)@24,75,176,91]] [[:ui:ui-ui_anim-page_trans|ID3|Fading@21,101,175,119]] [[:ui:ui-ui_anim-page_trans|ID4|From the back@20,131,175,148]] [[:ui:ui-ui_anim-page_trans|ID5|From the front@23,160,178,176]] [[:ui:ui-ui_anim-page_trans|ID6|Removing card 1@21,187,174,206]] [[:ui:ui-ui_anim-page_trans|ID7|Removing card 2@23,217,178,233]] [[:ui:ui-ui_anim-page_trans|ID8|Adding card 1@23,241,176,262]] [[:ui:ui-ui_anim-page_trans|ID9|Adding card 2@21,273,175,291]] [[:ui:ui-ui_anim-page_trans|ID10|Flipping card@21,299,176,319]] [[:ui:ui-ui_anim-page_trans|ID11|Accordion@23,330,180,348]] [[:ui:ui-ui_anim-page_trans|ID12|Cube@21,358,175,376]] [[:ui:ui-ui_anim-page_trans|ID13|Ripple@22,380,177,399]] [[:ui:ui-ui_anim-page_trans|ID14|Flipping page@22,407,177,428]] {{cfg>}} { } {{**Page Transitions - Animation Type dialog. //ANY// selection made will return to the previous page.\\ See a video demonstration of the transitions below.** ==== Page Transition: Description & Demos ==== In the Total Launcher app, after a selection is made, the user is taken back to the ''UI & Animation'' > ''Transition'' page to select additional options. The app shows **//no//** visualization of the transition format ... but in this uiTLM demo, visualization appears when clicking its title in the //alphabetical// listing below. ^ Transition Title ^ Description ^ | ++Accordion | {{:section:TL-page_transition-accordion.gif}} ++ | Similar to Flipping a card, but it is more concave as the transition moves away from the user, revealing the next page as if seeing the new bellows of an accordion. | | ++Adding card 1 | {{:section:TL-page_transition-adding_card_1.gif}} ++ | The new page slides left or right **on top** of the existing page. The existing page remains completely stationary. | | ++Adding card 2 | {{:section:TL-page_transition-adding_card_2.gif}} ++ | The new page slides left or right **on top**. The existing page underneath shifts slightly in the same direction and darkens as it disappears. | | ++Cube | {{:section:TL-page_transition-cube.gif}} ++ | Pages rotate as if they are the faces on the outside of a spinning 3D cube. | | ++Fading | {{:section:TL-page_transition-fading.gif}} ++ | The existing page fades out, revealing the new page. There is no sliding or 3D movement. | | ++Flipping card | {{:section:TL-page_transition-flipping_card.gif}} ++ | A rigid rotation of the existing page, pivoting on its vertical center to reveal the new page on the other side. | | ++Flipping page | {{:section:TL-page_transition-flipping_page.gif}} ++ | Simulates a physical book page turning, complete with a curling effect at the corner. | | ++From the back | {{:section:TL-page_transition-from_the_back.gif}} ++ | Similar to From the front, which switches the action on the direction of the swipe. Here: **Swipe right to left**: the //new page emerges from the back// as the existing page dissolves as it moves forward; **Swipe left to right**: the //new page emerges from the front// as the existing page dissolves to the back. | | ++From the front | {{:section:TL-page_transition-from_the_front.gif}} ++ | Similar to From the back, which switches the action on the direction of the swipe. Here: **Swipe right to left**: the //new page emerges from the front// as the existing page dissolves to the back; **Swipe left to right**: the //new page moves from back to front// as the existing page moves forward and dissolves. | |++Removing card 1| {{:section:TL-page_transition-removing_card_1.gif}} ++ | The existing page slides **away** (on top) to reveal the new page underneath. The new page remains completely stationary. | |++Removing card 2| {{:section:TL-page_transition-removing_card_2.gif}} ++ | The existing page slides **away** (on top) to reveal the new screen underneath. The new screen shifts slightly into place and brightens. | | ++Ripple | {{:section:TL-page_transition-ripple.gif}} ++ | The page distorts with a radial wave effect, simulating water ripples that expand outward to reveal the new page. | | ++Sliding | {{:section:TL-page_transition-sliding.gif}} ++ | The new page slides either left or right as it pushes the existing page in the same direction | | ++Sliding (3D) | {{:section:TL-page_transition-sliding_3D.gif}} ++ | The existing page appears to turn on a spindle, either left or right, to reveal the new page, which has the opposite entry effect. | {{page>site:site-footer-comment_feedback_block}} ===== Hidden Index Anchors ===== [[:ui:ui-ui_anim-page_trans]]