Change how source codes (C#/XAML) are displayed

[ghost1372]

Issue type

enhancement

Which version of the app?

WinUI 3 Gallery

Description

Currently displaying codes is too long and confusing. Using Pivot/selector bar can shorten the code and make it easier to use.

this Currently design

I have used pivot for my app and it is as follows

@karkarl If approved, I can create a PR for this.

Screenshots

No response

Windows version

Insider Build (xxxxx), Windows 11 24H2 (26052), Windows 11 23H2 (22631), Windows 11 22H2 (22621), Windows 11 21H2 (22000), Windows 10 22H2 (19045), November 2021 Update/21H2 (19044), May 2021 Update/21H1 (19043), October 2020 Update/20H2 (19042), October 2018 Update/RS5 (17763)

Additional context

No response

[Jay-o-Way]

I've learned that Pivot is deprecated, but SelectorBar is almost identical.

[niels9001]

@karkarl I think this makes sense? We do the same thing in the Windows Community Toolkit Gallery:

[karkarl]

@karkarl I think this makes sense? We do the same thing in the Windows Community Toolkit Gallery:

Let's do it! I like the idea of aligning design patterns with Community toolkit.

[ghost1372]

@karkarl ~~i used SwitchPresenter from communityToolkit.(I copied its codes directly in the repository)~~ i created a pr which is working fine. https://github.com/microsoft/WinUI-Gallery/pull/1540