Skip to content

[Windows] Fix for IndicatorView using templated icons not working #28905

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

Merged
merged 10 commits into from
Apr 22, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
78 changes: 78 additions & 0 deletions src/Controls/tests/TestCases.HostApp/Issues/Issue7144.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
using System.Collections.ObjectModel;

namespace Controls.TestCases.HostApp.Issues;

[Issue(IssueTracker.Github, 7144, "IndicatorView using templated icons not working", PlatformAffected.UWP)]
public class Issue7144 : ContentPage
{
ObservableCollection<string> Items { get; set; } = new ObservableCollection<string>() { "Item1", "Item2" };

public Issue7144()
{
Grid grid = new Grid();
grid.RowDefinitions.Add(new RowDefinition { Height = GridLength.Star });
grid.RowDefinitions.Add(new RowDefinition { Height = GridLength.Auto });
grid.RowDefinitions.Add(new RowDefinition { Height = GridLength.Auto });

IndicatorView indicatorViewWithDataTemplate = new IndicatorView
{
Margin = new Thickness(0, 0, 0, 40),
HorizontalOptions = LayoutOptions.Center,
IndicatorColor = Colors.Black,
SelectedIndicatorColor = Colors.Green
};

indicatorViewWithDataTemplate.IndicatorTemplate = new DataTemplate(() =>
{
Image image = new Image()
{
Source = "dotnet_bot.png",
HeightRequest = 15,
WidthRequest = 15,
};
return image;
});

CarouselView carouselView = new CarouselView
{
ItemsSource = Items,
Loop = false,
IndicatorView = indicatorViewWithDataTemplate,
ItemTemplate = new DataTemplate(() =>
{
StackLayout stackLayout = new StackLayout();

Label label = new Label
{
FontAttributes = FontAttributes.Bold,
FontSize = 24,
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center
};
label.SetBinding(Label.TextProperty, ".");;

stackLayout.Children.Add(label);

return stackLayout;
})
};

Label label = new Label
{
AutomationId = "descriptionLabel",
Text = "The test case fails if the IndicatorView DataTemplate is not displayed",
FontAttributes = FontAttributes.Bold,
FontSize = 24,
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center
};

grid.Add(carouselView, 0, 0);
grid.Add(indicatorViewWithDataTemplate, 0, 1);
grid.Add(label, 0, 2);

Content = grid;
}
}


Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
using NUnit.Framework;
using UITest.Appium;
using UITest.Core;

namespace Microsoft.Maui.TestCases.Tests.Issues;

public class Issue7144 : _IssuesUITest
{
public Issue7144(TestDevice device) : base(device)
{
}

public override string Issue => "IndicatorView using templated icons not working";

[Test]
[Category(UITestCategories.IndicatorView)]
public void IndicatorViewWithTemplatedIcon()
{
App.WaitForElement("descriptionLabel");
VerifyScreenshot();
Copy link
Contributor

Choose a reason for hiding this comment

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

Pending snapshots in all platforms.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@jsuarezruiz , I've attached the screenshots for the Android and iOS platforms. I will add the screenshots for the other platforms in the next CI run​.

}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
20 changes: 13 additions & 7 deletions src/Core/src/Platform/Windows/MauiPageControl.cs
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ public class MauiPageControl : ItemsControl
WBrush? _fillColor;
ObservableCollection<WShape>? _dots;

internal bool UseShapeIndicator => _indicatorView == null || (_indicatorView is ITemplatedIndicatorView templatedView && templatedView.IndicatorsLayoutOverride != null);

public MauiPageControl()
{
HorizontalAlignment = Microsoft.UI.Xaml.HorizontalAlignment.Center;
Expand All @@ -35,15 +37,17 @@ public void SetIndicatorView(IIndicatorView indicatorView)
}

internal void UpdateIndicatorsColor()
{
if (_indicatorView == null)
{
if (UseShapeIndicator)
{
return;
}

if (_indicatorView.IndicatorColor is SolidPaint solidPaint)
if (_indicatorView?.IndicatorColor is SolidPaint solidPaint)
_fillColor = solidPaint?.ToPlatform();
if (_indicatorView.SelectedIndicatorColor is SolidPaint selectedSolidPaint)
if (_indicatorView?.SelectedIndicatorColor is SolidPaint selectedSolidPaint)
_selectedColor = selectedSolidPaint.ToPlatform();
var position = _indicatorView.Position;
var position = _indicatorView?.Position;
int i = 0;
foreach (var item in Items)
{
Expand All @@ -54,13 +58,15 @@ internal void UpdateIndicatorsColor()

internal void CreateIndicators()
{
if (_indicatorView == null)
if (UseShapeIndicator)
{
return;
}

var position = GetIndexFromPosition();
var indicators = new List<WShape>();

var indicatorCount = _indicatorView.GetMaximumVisible();
var indicatorCount = _indicatorView?.GetMaximumVisible();
if (indicatorCount > 0)
{
for (int i = 0; i < indicatorCount; i++)
Expand Down
Loading