Skip to content

[Net10.0] Toolbar item - IconColor property #30826

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

Open
wants to merge 2 commits into
base: net10.0
Choose a base branch
from

Conversation

kubaflo
Copy link
Contributor

@kubaflo kubaflo commented Jul 25, 2025

Note

Are you waiting for the changes in this PR to be merged?
It would be very helpful if you could test the resulting artifacts from this PR and let us know in a comment if this change resolves your issue. Thank you!

Description of Change

This PR introduces a new IconColor bindable property for ToolbarItem that allows developers to customize the color of toolbar icons directly in XAML or code, bringing more flexibility and platform consistency to the appearance of toolbars.

<ContentPage.ToolbarItems>
       <ToolbarItem  IconColor="Blue">
              <ToolbarItem.IconImageSource>
                     <FileImageSource File="dotnet_bot.png"/>
              </ToolbarItem.IconImageSource>
       </ToolbarItem>
</ContentPage.ToolbarItems>

Issues Fixed

Fixes #30818

Screen.Recording.2025-07-25.at.02.09.50.mov

@kubaflo kubaflo changed the base branch from main to net10.0 July 25, 2025 00:15
@dotnet-policy-service dotnet-policy-service bot added the community ✨ Community Contribution label Jul 25, 2025
Copy link
Contributor

Hey there @@kubaflo! Thank you so much for your PR! Someone from the team will get assigned to your PR shortly and we'll get it reviewed.

@kubaflo kubaflo changed the title Toolbar item color [Net10.0] Toolbar item - IconColor property Jul 25, 2025
@kubaflo kubaflo self-assigned this Jul 25, 2025
@jsuarezruiz
Copy link
Contributor

/azp run MAUI-UITests-public

Copy link

Azure Pipelines successfully started running 1 pipeline(s).

Copy link
Contributor

@jsuarezruiz jsuarezruiz left a comment

Choose a reason for hiding this comment

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

Could include a related tests?

}
else
{
Image = result?.Value.ImageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate);
Copy link
Contributor

Choose a reason for hiding this comment

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

What should happen when result?.Value is null here?

@kubaflo kubaflo force-pushed the toolbar-item-color branch from 181abb8 to 8870fca Compare July 27, 2025 14:06
@kubaflo kubaflo marked this pull request as ready for review July 27, 2025 14:08
@Copilot Copilot AI review requested due to automatic review settings July 27, 2025 14:08
@kubaflo kubaflo requested a review from a team as a code owner July 27, 2025 14:08
@kubaflo kubaflo requested review from mattleibow and rmarinho July 27, 2025 14:08
Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

This PR introduces a new IconColor bindable property for ToolbarItem that allows developers to customize the color of toolbar icons across platforms. The feature enables setting toolbar icon colors directly in XAML or code-behind, providing better visual customization for cross-platform applications.

Key changes:

  • Added IconColor bindable property to ToolbarItem class with proper change notifications
  • Implemented platform-specific icon color handling for Android and iOS
  • Created comprehensive UI tests to validate the new functionality

Reviewed Changes

Copilot reviewed 13 out of 13 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/Controls/src/Core/Toolbar/ToolbarItem.cs Adds the new IconColor bindable property and update mechanism
src/Controls/src/Core/Platform/Android/Extensions/ToolbarExtensions.cs Implements Android-specific icon color application logic
src/Controls/src/Core/Compatibility/iOS/Extensions/ToolbarItemExtensions.cs Implements iOS-specific icon color handling with proper rendering modes
src/Controls/tests/TestCases.HostApp/Issues/Issue30818.xaml Creates UI test page demonstrating toolbar items with different icon colors
src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue30818.cs Adds automated UI test for the new IconColor functionality
Multiple PublicAPI.Unshipped.txt files Updates public API surface to include the new property
Comments suppressed due to low confidence (2)

src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue30818.cs:1

  • The test is excluded on Windows platform, but according to the coding guidelines, all code changes should have relevant test cases that can execute properly across platforms. Consider implementing Windows support or providing a platform-specific test that validates the expected behavior (even if it's a no-op on Windows).
#if TEST_FAILS_ON_WINDOWS // It is not implemented on Windows yet

src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue30818.cs:19

  • The test only verifies a screenshot without any specific assertions about the IconColor property behavior. Consider adding more comprehensive tests that validate the actual color application, such as checking element properties or adding multiple test cases for different color scenarios.
		VerifyScreenshot();

@@ -17,6 +18,9 @@ public class ToolbarItem : MenuItem

static readonly BindableProperty PriorityProperty = BindableProperty.Create(nameof(Priority), typeof(int), typeof(ToolbarItem), 0);

public static readonly BindableProperty IconColorProperty = BindableProperty.Create(nameof(IconColor), typeof(Color), typeof(ToolbarItem), null,
Copy link
Preview

Copilot AI Jul 27, 2025

Choose a reason for hiding this comment

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

This change introduces a new public API property 'IconColor' to the ToolbarItem class. This is a potentially breaking change that should not be included in minor versions or service releases. Please ensure this is targeted for a major version release.

Copilot uses AI. Check for mistakes.


if (item.IconColor is Color iconColor)
{
if (item.IconImageSource is FontImageSource fontImageSource && fontImageSource.Color is null)
Copy link
Preview

Copilot AI Jul 27, 2025

Choose a reason for hiding this comment

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

[nitpick] The logic for handling FontImageSource vs other image sources is complex and nested. Consider extracting this icon color application logic into a separate method to improve readability and maintainability.

Copilot uses AI. Check for mistakes.

@rmarinho
Copy link
Member

How does this work with the Shell Foreground color ?

@kubaflo
Copy link
Contributor Author

kubaflo commented Jul 28, 2025

How does this work with the Shell Foreground color ?

The Foreground doesn't affect the toolbar icon color

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
community ✨ Community Contribution proposal/open t/enhancement ☀️ New feature or request
Projects
Status: Todo
Development

Successfully merging this pull request may close these issues.

4 participants