Skip to content

Conversation

ojhad
Copy link
Contributor

@ojhad ojhad commented Jan 27, 2022

Description

Gap between active tab and active tab content when device scale factor is not 100%
image

The SelectedBackgroundPath path is not being drawn all the way down in non-100% scale factors. Layout rounding API does not seem to fix this. I added an extra pixel to TabGeometry which is being used to draw the background. That fixed the drawing at non-100% scale factors while still looking correct at 100% scale.

Motivation and Context

fixes internal bugs 37332027

Screenshots

Pre-Fix on top of Post-Fix

100% scale
image
image
image
image

125% scale
image
image
image
image

150% scale
image
image
image
image

175% scale
image
image
image
image

200% scale
image
image
image
image

@ghost ghost added the needs-triage Issue needs to be triaged by the area owners label Jan 27, 2022
@ojhad
Copy link
Contributor Author

ojhad commented Jan 27, 2022

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@ojhad
Copy link
Contributor Author

ojhad commented Feb 1, 2022

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@ojhad ojhad changed the title TabView bottom border gap fix TabView gap fixes Feb 2, 2022
@ojhad
Copy link
Contributor Author

ojhad commented Feb 16, 2022

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@ojhad ojhad requested a review from RBrid February 17, 2022 21:38
@ojhad ojhad changed the title TabView gap fixes TabView gap between active tab and active content fix Feb 22, 2022
@ojhad ojhad force-pushed the user/ojhad/tabviewcontourfix branch from 961f8d2 to 750a93e Compare February 24, 2022 01:32
@ojhad
Copy link
Contributor Author

ojhad commented Feb 24, 2022

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@ojhad ojhad requested a review from StephenLPeters February 25, 2022 21:02
@ojhad
Copy link
Contributor Author

ojhad commented Feb 28, 2022

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

SetFirstTabSelectedBackgroundPathFill(tabBrush);

var contentBrush = new SolidColorBrush();
contentBrush.Color = Colors.Green;
Copy link
Contributor

Choose a reason for hiding this comment

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

should these colors be translucent?

Copy link
Contributor

Choose a reason for hiding this comment

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

Or maybe have a button to set translucency to 50%

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I added buttons to set each of these to transparent. Does that cover this use case or was there another use case you are thinking of?

@StephenLPeters StephenLPeters added area-TabView team-Controls Issue for the Controls team and removed needs-triage Issue needs to be triaged by the area owners labels Feb 28, 2022
@ojhad ojhad merged commit 9db5d4b into main Feb 28, 2022
@ojhad ojhad deleted the user/ojhad/tabviewcontourfix branch February 28, 2022 23:27
RBrid added a commit that referenced this pull request Apr 5, 2022
RBrid added a commit that referenced this pull request Apr 6, 2022
kmahone pushed a commit that referenced this pull request Apr 6, 2022
RBrid added a commit that referenced this pull request Apr 12, 2022
* Reverting product change made for 'TabView gap between active tab and active content fix #6644'

* TabView expansions fix
kmahone pushed a commit that referenced this pull request May 4, 2022
* Reverting product change made for 'TabView gap between active tab and active content fix #6644'

* TabView expansions fix
@ghost
Copy link

ghost commented Jun 2, 2022

🎉This issue was addressed in #6954, which has now been successfully released as Microsoft.UI.Xaml v2.8.0-prerelease.220601001.:tada:

Handy links:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area-TabView team-Controls Issue for the Controls team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants