Skip to content

Conversation

@Avid29
Copy link
Contributor

@Avid29 Avid29 commented Nov 17, 2025

Fixes #746

PR Type

What kind of change does this PR introduce?

What is the current behavior?

There is not orientation options for the Segmented control

What is the new behavior?

Add customization options for a vertical Segmented control

PR Checklist

Please check if your PR fulfills the following requirements:

  • Created a feature/dev branch in your fork (vs. submitting directly from a commit on main)
  • Based off latest main branch of toolkit
  • Tested code with current supported SDKs
  • New component
    • Documentation has been added
    • Sample in sample app has been added
    • Analyzers are passing for documentation and samples
    • Icon has been created (if new sample) following the Thumbnail Style Guide and templates
  • Tests for the changes have been added (if applicable)
  • Header has been added to all new source files
  • Contains NO breaking changes

Other information

@Avid29 Avid29 marked this pull request as draft November 17, 2025 15:13
@Avid29
Copy link
Contributor Author

Avid29 commented Nov 17, 2025

So far I've added an Orientation property to the EqualPanel. I tested it (see below), but it's not actually implemented anywhere yet.

image

@Avid29
Copy link
Contributor Author

Avid29 commented Nov 17, 2025

Here's an update.
image

Though this does have a slight change in the horizontal style, namely the selected indicator is centered on the full SegmentedItem rather than just the content. Here's what that difference looks like in practice.

Before:
image
After:
image

@Avid29 Avid29 force-pushed the Segmented/VerticalOrientation branch from 24309cb to 4d35ca1 Compare November 17, 2025 17:30
@michael-hawker
Copy link
Member

@niels9001 was there a reason the indicator was centered under the content only vs. the entire content? That'll only matter in Icon + Text Horizontal mode.

@michael-hawker
Copy link
Member

@Avid29 this works perfect!

image

Just slotted right into my VSM with changing the orientation and I was done! 🦙❤️ I'll take a look through the code itself in a bit.

Copy link
Member

@michael-hawker michael-hawker left a comment

Choose a reason for hiding this comment

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

Looks pretty clean to me. @niels9001 @Arlodotexe let me know your thoughts.

Comment on lines 163 to 167
var container = ContainerFromIndex(i) as SegmentedItem;
if (container is null)
continue;

container.UpdateOrientation(Orientation);
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
var container = ContainerFromIndex(i) as SegmentedItem;
if (container is null)
continue;
container.UpdateOrientation(Orientation);
if (ContainerFromIndex(i) is SegmentedItem item)
{
item.UpdateOrientation(Orientation);
}

Would this be simpler?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yeah. I have a tendency to over user guard checks...

Comment on lines 5 to 6
using Windows.Media.Devices;

Copy link
Member

Choose a reason for hiding this comment

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

Accidental namespace add?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yeah. Visual Studio really just adds whatever as I type and I often forget to even check 🤷

Copy link
Member

Choose a reason for hiding this comment

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

Yeah, I wonder if it's better in VS 2026, I'll have to see as I use it more. It's definitely been a bigger problem in the last year or so than it was in the past.

Comment on lines 24 to +25
RegisterPropertyChangedCallback(SelectedIndexProperty, OnSelectedIndexChanged);
RegisterPropertyChangedCallback(OrientationProperty, OnSelectedIndexChanged);
Copy link
Contributor

Choose a reason for hiding this comment

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

Would it make sense to extract the logic in OnSelectedIndexChanged into a SaveInitialIndex method then call it from OnSelectedIndexChanged and OnOrientationChanged?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Oh, wait a minute. That's supposed to call OnOrientationChanged... Yet it does work. Why is that?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Oh, I see. Because I moved the callback to the DependencyProperty declaration. This line is entirely unnecessary.

Avid29 and others added 2 commits November 19, 2025 02:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Segmented] Orientation Property

3 participants