Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Visual updates to expander #4024

Merged
merged 10 commits into from
Jan 29, 2021
Merged

Visual updates to expander #4024

merged 10 commits into from
Jan 29, 2021

Conversation

tashatitova
Copy link
Contributor

@tashatitova tashatitova commented Jan 26, 2021

The expander control was pretty basic so added styles to it.

  • Removed the extra xaml page (Expander) and moved all styles to themeresources
  • Added system color brushes for high contrast as only two of them were available, and using the extra levels of abstraction through existing SystemControl brushes made no sense for new control
  • Simplified the chevron logic via adding a tag to style but this will be revisited with AnimatedIcon chevron in the future
  • Various brushes, corner radius, layout, margins, etc updates

Future work: - Pop out animations updates

Screenshots:

Light: regular/hover/press

Light

Light-hover

Light-press

Dark: regular/hover/press

Dark

Dark-hover

Dark-press

NOTE: for high contrast, I'm using custom ButtonText and ButtonFace colors for the header/toggle, to make sure they are differentiating from WindowText + WindowColor for the drop down

Regular/hover + press (these two look the same)

HC

HC-hover-press

@ghost ghost added the needs-triage Issue needs to be triaged by the area owners label Jan 26, 2021
@beervoley beervoley added area-Expander team-Controls Issue for the Controls team and removed needs-triage Issue needs to be triaged by the area owners labels Jan 26, 2021
@tashatitova
Copy link
Contributor Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@ranjeshj
Copy link
Contributor

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

dev/Expander/Expander.vcxitems Outdated Show resolved Hide resolved
@tashatitova
Copy link
Contributor Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

Expander.xaml Outdated Show resolved Hide resolved
@ranjeshj
Copy link
Contributor

Please merge in master to get a fix for the failing tests.

@tashatitova tashatitova requested a review from karkarl January 28, 2021 01:49
@tashatitova
Copy link
Contributor Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@mdtauk
Copy link
Contributor

mdtauk commented Jan 28, 2021

What is the thinking behind the large padding above and below the heading text. The padding around the close button visual is uneven too, which will not look good with the hover and pressed state backing plates.

@tashatitova
Copy link
Contributor Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@tashatitova tashatitova requested a review from karkarl January 28, 2021 21:31
dev/Expander/Expander.xaml Outdated Show resolved Hide resolved
dev/Expander/Expander.xaml Outdated Show resolved Hide resolved
@tashatitova
Copy link
Contributor Author

/azp run

@azure-pipelines
Copy link

Azure Pipelines successfully started running 1 pipeline(s).

@tashatitova tashatitova merged commit e150563 into master Jan 29, 2021
@tashatitova tashatitova deleted the user/tatito/expander branch January 29, 2021 00:16
@mdtauk
Copy link
Contributor

mdtauk commented Feb 4, 2021

Why is the expander using so much padding top and bottom?

image

and not closer in line with the ComboBox and DropDownButton controls?

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-Expander team-Controls Issue for the Controls team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants