Skip to content

Add RepositionThemeTransition to sample pages for smoother layout updates - #2047

Merged
Marcel W. (marcelwgn) merged 14 commits into
microsoft:mainfrom
Zakariathr22:reposition-transition-samples
Dec 17, 2025
Merged

Marcel W. (marcelwgn) merged 14 commits into
microsoft:mainfrom
Zakariathr22:reposition-transition-samples

Conversation

@Zakariathr22

@Zakariathr22 Zakaria Tahri (Zakariathr22) commented Sep 15, 2025 •

Copy link
Copy Markdown
Contributor

Description

This PR Updates ItemPage to add RepositionThemeTransition to content pages after navigation, main changes are:

  • Hooked contentFrame.Navigated to detect when the new page is loaded.
  • Added logic to attach a RepositionThemeTransition to the root Panel.

Motivation and Context

Improves visual consistency.

How Has This Been Tested?

Manually verified across affected sample pages to ensure transitions apply correctly without breaking layout.

Screenshots (if appropriate):

Before
Before
After
After

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)
@Saharsh979

Copy link
Copy Markdown

/azp run

@Saharsh979

Copy link
Copy Markdown

The PR description lacks the rationale behind why RepositionThemeTransition is added, which could confuse maintainers unfamiliar with it. Feel free to add more details along with the Before vs After Screenshot to give a visual sense of the improvement you're introducing.

Comment thread WinUIGallery/Samples/ControlPages/AcrylicPage.xaml Outdated
- Added `SamplePage` as a base class for app pages
- Applies `RepositionThemeTransition` to the root Panel of derived pages
- Ensures transitions are applied only once to avoid duplicates
@Zakariathr22

Copy link
Copy Markdown
Contributor Author

The PR description lacks the rationale behind why RepositionThemeTransition is added, which could confuse maintainers unfamiliar with it. Feel free to add more details along with the Before vs After Screenshot to give a visual sense of the improvement you're introducing.

Done!

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we are reducing code for this implementation, we can create a style for these StackPanels.

<Style x:Key="StackPanelWithRepositionThemeTransitionStyle" TargetType="StackPanel">
    <Setter Property="ChildrenTransitions">
        <Setter.Value>
            <TransitionCollection>
                <RepositionThemeTransition />
            </TransitionCollection>
        </Setter.Value>
    </Setter>
    <Setter Property="Spacing" Value="12"/>
</Style>
@Zakariathr22

Copy link
Copy Markdown
Contributor Author

Marcel W. (@marcelwgn)
Need your opinion on this

@Saharsh979

Copy link
Copy Markdown

/azp run

@marcelwgn
Marcel W. (marcelwgn) merged commit f3112a4 into microsoft:main Dec 17, 2025
2 checks passed
@Zakariathr22
Zakaria Tahri (Zakariathr22) deleted the reposition-transition-samples branch January 17, 2026 11:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

5 participants