[Windows] Fix ActionSheet maximum size and styling
#30835
Conversation
|
Hey there @@morning4coffe-dev! Thank you so much for your PR! Someone from the team will get assigned to your PR shortly and we'll get it reviewed. |
| namespace Maui.Controls.Sample.Issues | ||
| { | ||
| [Issue(IssueTracker.Github, 25200, "Actionsheet maximum size has been hardcoded on windows, creating display issues", PlatformAffected.UWP)] | ||
| public class Issue25200 : TestContentPage |
There was a problem hiding this comment.
This is fine. Now, the next step would be create a test. You must create a class Issue25200 in this folder: https://github.com/dotnet/maui/tree/main/src/Controls/tests/TestCases.Shared.Tests/Tests/Issues
Inherit from _IssuesUITest. Then create a test inside. My recommendation would be to tap the buttons, and verify a screenshot to validate the size of the ActionSheet.
Let me know if needs help with anything!
| <Style x:Key="MauiFlyoutPresenterStyle" TargetType="FlyoutPresenter"> | ||
| <Setter Property="MaxHeight" Value="{x:Null}" /> | ||
| <Setter Property="MaxWidth" Value="{x:Null}" /> | ||
| <Setter Property="MinWidth" Value="350"/> |
There was a problem hiding this comment.
Extract to <x:Double x:Key="FlyoutMinWidth">350</x:Double>
| Background="{TemplateBinding Background}" | ||
| BorderBrush="{TemplateBinding BorderBrush}" | ||
| BorderThickness="{TemplateBinding BorderThickness}"> | ||
| <ScrollViewer x:Name="ScrollViewer" |
There was a problem hiding this comment.
Change from generic "ScrollViewer" to "FlyoutScrollViewer" for better debugging in the future.
| @@ -0,0 +1,61 @@ | |||
| namespace Maui.Controls.Sample.Issues | |||
There was a problem hiding this comment.
super nit: File-scope namespace is preferred.
There was a problem hiding this comment.
Pull Request Overview
This PR fixes ActionSheet display issues on Windows by removing hardcoded size limitations and improving text wrapping behavior. The changes align the Windows ActionSheet implementation with other platforms and Fluent Design system principles.
Key changes:
- Removed hardcoded MaxHeight and MaxWidth constraints from the FlyoutPresenter style
- Added text wrapping support for ActionSheet titles and items
- Introduced a custom data template for ActionSheet items with proper padding and text wrapping
Reviewed Changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| src/Core/src/Platform/Windows/Styles/Resources.xaml | Updates FlyoutPresenter style to remove size constraints, adds custom template with ScrollViewer, and creates ActionSheet item data template with text wrapping |
| src/Controls/src/Core/Platform/AlertManager/ActionSheetDialog.Windows.cs | Enables text wrapping for title TextBlock and applies custom item template to ListView |
| src/Controls/tests/TestCases.HostApp/Issues/Issue25200.cs | Creates test UI page with three ActionSheet scenarios to validate proper sizing and text wrapping |
| src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue25200.cs | Implements NUnit tests to verify ActionSheet display behavior with various content lengths |
|
/azp run |
|
Azure Pipelines successfully started running 3 pipeline(s). |
| App.WaitForElement("Cancel"); | ||
|
|
||
| // Take screenshot to validate proper text wrapping and sizing | ||
| VerifyScreenshot(); |
There was a problem hiding this comment.
Running a build to generate this pending snapshots.
Description of Change
Issues Fixed
This pull request addresses improvements to the
ActionSheetimplementation on Windows, focusing on better layout handling, text wrapping, and display consistency.Previous/current Windows behavior, Android behavior
Previous Windows behavior
Current Windows behavior
Android
Key changes include updating the ActionSheet dialog's layout and styles to match other platforms behavior and be more in-line with Fluent Design system.
Fixes #25200