Open sakshi173 opened 7 months ago
@kazo0 could it be a material style issue?
@jeromelaban
There's no Material style for AutoSuggestBox
, might be using the Material FlyoutPresenterStyle
by accident though.
@jeromelaban @kazo0 AutosuggestBox shows more than one line. If you keep scrolling, you may get an item with 2 lines. Maybe the visual appearance can be improved by adding margin on the right and left.
Problem, when you resize the browser window, AutosuggestBox size doesn't change and some parts become hidden.
May I send a PR to this repo?
@jeromelaban There's no Material style for
AutoSuggestBox
, might be using the MaterialFlyoutPresenterStyle
by accident though.
@kazo0 I think you are maybe right here, as I am noticing some purple for the hover state here
Compared to Fluent theme:
@jeromelaban There's no Material style for
AutoSuggestBox
, might be using the MaterialFlyoutPresenterStyle
by accident though.@kazo0 I think you are maybe right here, as I am noticing some purple for the hover state here
So @mcNets I think we are maybe just missing
<StackPanel.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</StackPanel.Resources>
at this level for the AutoSuggestBoxSamplePage https://github.com/unoplatform/Uno.Gallery/blob/57fdfbda48b7eeab81fa054e3a71d6f2eb551d2a/Uno.Gallery/Views/SamplePages/AutoSuggestBoxSamplePage.xaml#L15
@agneszitte I've added the code you posted, but I'm not sure this is the issue. Initially flyout has a Width=300
, but when you make the browser window narrow, it automatically changes to a larger size, and then do not recover the original size, and the flyout content remains hidden.
Desktop project behaves the same way.
When NavigationView is in compact mode, the FlyOut is then resized again and wrap the content.
https://github.com/user-attachments/assets/0fc1e54b-06f5-482f-abe2-b28c5e70b977
@agneszitte I've added the code you posted, but I'm not sure this is the issue. Initially flyout has a
Width=300
, but when you make the browser window narrow, it automatically changes to a larger size, and then do not recover the original size, and the flyout content remains hidden.
Thanks for giving it a try @mcNets. Maybe I am mistaken but I think it is still taking the Material theme here visually and for that reason not using the fluent theme properly (which hopefully could normally resolve the main issue here in terms of padding, wrapping, etc...)
Thanks for giving it a try @mcNets. Maybe I am mistaken but I think it is still taking the Material theme here visually and for that reason not using the fluent theme properly (which hopefully could normally resolve the main issue here in terms of padding, wrapping, etc...)
Related issue: https://github.com/unoplatform/Uno.Gallery/issues/1069#issuecomment-2215227284 And I think as @Xiaoy312 mentioned, the problem may be of the same nature as: https://github.com/unoplatform/Uno.Gallery/issues/1093
@agneszitte I tried to apply the same approach as @morning4coffe-dev did on https://github.com/unoplatform/Uno.Gallery/pull/1123, but it still seems a bit purple.
public AutoSuggestBoxSamplePage()
{
this.InitializeComponent();
Loaded += AutoSuggestBoxSamplePage_Loaded;
}
private void AutoSuggestBoxSamplePage_Loaded(object sender, RoutedEventArgs e)
{
var boxes = VisualTreeHelperEx.GetDescendants(this)
.OfType<AutoSuggestBox>()
.ToList();
foreach (var box in boxes)
{
box.EnsureXamlControlsResources();
}
Loaded -= AutoSuggestBoxSamplePage_Loaded;
}
I have an ongoing PR for fixing this issue https://github.com/unoplatform/Uno.Gallery/pull/1134, but I haven't been able to prioritize. Thank you for looking into this @mcNets. On the image you shared, it is purple as the individual items are still material. We can discuss further, if you want to continue with this issue.
No thank you @morning4coffe-dev , go ahead. I'll take another one. Are you changing the style everytime a new popup appears?
As far as I remember, the solution I worked on only functioned after opening the popup for the second time, which is why it hasn't been merged yet. If you'd like, you can take a look at my PR and maybe pick it up if you get any ideas from it.
@morning4coffe-dev If I am not wrong TextChanged
event if fired before the suggestion list is open.
if (sender.IsSuggestionListOpen)
{
var popup = VisualTreeHelper.GetOpenPopupsForXamlRoot(XamlRoot).FirstOrDefault();
popup.EnsureXamlControlsResources(true);
(popup.Child as Border).EnsureXamlControlsResources(true);
}
So until TextChanged event is fired again, for example when you add another character or select one option or you clear the TextBox, the style is no applied. Try by press 'b' and when the popup is visible, click 'o', it will change to Fluent.
Set a breakpoint inside the if condition and you'll see it.
@morning4coffe-dev would you mind if I make a modification in your code?
@mcNets Not at all, I am happy to collab with you this way! Thank you 😇
@morning4coffe-dev Your PR was created with the previous multi-project version, and I'm not sure to be able to send a PR to your PR, do you mind if I generate a new PR?
Besides, UWP project where the changes are applied, is not loading.
@mcNets For sure, no problem, you can create a new PR and we can close off mine, after merging. Hmm... interesting, I am happy to take a look, after you make the PR on why it might not be loading.
@morning4coffe-dev I don't know if mine will load....
This issue should be fixed now via https://github.com/unoplatform/Uno.Gallery/pull/1173.
Thank you so much again, @mcNets, for your valuable contribution to this issue! It's greatly appreciated ❣️
@jhanvi03 I will let you do some final tests please
The issue Still persist with Versions:
Package Referenced version Updated version Uno.CommunityToolkit.WinUI.UI.Controls 7.1.200 7.1.203 Uno.CommunityToolkit.WinUI.UI.Controls.DataGrid 7.1.200 7.1.203 Uno.Core.Extensions.Compatibility 4.0.1 4.1.1 Uno.Core.Extensions.Disposables 4.0.1 4.1.1 Uno.Sdk 5.3.96 5.6.0-dev.32 Package | Referenced version | Updated version |
---|---|---|
Uno.CommunityToolkit.WinUI.UI.Controls | 7.1.200 | 7.1.203 |
Uno.CommunityToolkit.WinUI.UI.Controls.DataGrid | 7.1.200 | 7.1.203 |
Uno.Core.Extensions.Compatibility | 4.0.1 | 4.1.1 |
Uno.Core.Extensions.Disposables | 4.0.1 | 4.1.1 |
Uno.Sdk | 5.3.96 | 5.6.0-dev.32 |
Current behavior
Expected behavior
How to reproduce it (as minimally and precisely as possible)
Workaround
No response
Works on UWP/WinUI
None
Environment
No response
NuGet package version(s)
No response
Affected platforms
WebAssembly
IDE
No response
IDE version
No response
Relevant plugins
No response
Anything else we need to know?
No response