CommunityToolkit / CommunityToolkit/Windows

Expander in SettingsExpander ignores CornerRadius when Expanded

Open
#499 0 comments 0 reactions 1 assignee Claimed by @niels9001 View on GitHub
bug components::controls::settingscontrols help wanted ux 🖌️
Dominant language
C#
Stars
1.1k
Forks
166
PR merge metrics
No merged PRs in 30d

Description

### Describe the bug

I noticed that the `SettingsExpander` becomes square when expanded, even though I have set the `CornerRadius` to 8. I subscribed to the `Expanded` event and confirmed that the `CornerRadius` never changes, i.e., it always stays 8. However, the `Expander` becomes square. If I try to change the `CornerRadius` in the `Expanded` event handler, due to what might be a race condition, the changes are not applied. But if I apply the change with a delay of about 50 ms, the changes are applied, and the `Expander` remains rounded when expanded.
![image](https://github.com/user-attachments/assets/862f8042-2892-453a-b48f-6c8f622fb558)
![image](https://github.com/user-attachments/assets/e72d45f2-2b1a-48a7-a6e5-accb6140532a)

### Steps to reproduce

```text
1. Add a `SettingsExpander` to the layout.
2. Set the `CornerRadius` to 8 or any other value.
3. Run the application.
4. Notice that the `SettingsExpander` is rounded when collapsed.
5. Expand the `SettingsExpander`.
6. Notice that the `SettingsExpander` becomes square when expanded.
```

### Expected behavior

A) There should be a way to customize the `CornerRadius` for both the collapsed and expanded states (e.g., `CornerRadius="16 16 16 16"` when collapsed, `ExpandedCornerRadius="8 8 0 0"` when expanded, but this would require a new property - `ExpandedCornerRadius`).
B) The `Expander.CornerRadius` should match the `SettingsExpander.CornerRadius`, applying a converter that only affects `TopLeft` and `TopRight` (i.e., setting `BottomLeft` and `BottomRight` to 0). As I understand, if the expansion happens downward, `ExpandDown -> TopCornerRadiusFilterConverter` should be applied, but something goes wrong, and `Expander.CornerRadius` is set to `[0, 0, 0, 0]`.

### Screenshots

_No response_

### Code Platform

- [ ] UWP
- [X] WinAppSDK / WinUI 3
- [ ] Web Assembly (WASM)
- [ ] Android
- [ ] iOS
- [ ] MacOS
- [ ] Linux / GTK

### Windows Build Number

- [ ] Windows 10 1809 (Build 17763)
- [ ] Windows 10 1903 (Build 18362)
- [ ] Windows 10 1909 (Build 18363)
- [ ] Windows 10 2004 (Build 19041)
- [ ] Windows 10 20H2 (Build 19042)
- [ ] Windows 10 21H1 (Build 19043)
- [ ] Windows 10 21H2 (Build 19044)
- [ ] Windows 10 22H2 (Build 19045)
- [X] Windows 11 21H2 (Build 22000)
- [ ] Other (specify)

### Other Windows Build number

_No response_

### App minimum and target SDK version

- [ ] Windows 10, version 1809 (Build 17763)
- [ ] Windows 10, version 1903 (Build 18362)
- [ ] Windows 10, version 1909 (Build 18363)
- [ ] Windows 10, version 2004 (Build 19041)
- [ ] Windows 10, version 2104 (Build 20348)
- [X] Windows 11, version 22H2 (Build 22000)
- [ ] Other (specify)

### Other SDK version

_No response_

### Visual Studio Version

2022, Preview

### Visual Studio Build Number

17.11.0 Preview 5.0

### Device form factor

Desktop

### Additional context

**CommunityToolkit.WinUI.Controls.SettingsControls** Version: `8.1.240821`

### Help us help you

No, I'm unable to contribute a solution.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.