Xamarin.forms: [Bug] ToolbarItem icons no longer use bar text color on UWP

Created on 11 Jan 2020  路  4Comments  路  Source: xamarin/Xamarin.Forms

Description

ToolbarItem icons no longer use (or inherit) the BarTextColor property from the parent NavigationPage on UWP.

Note: Works fine in iOS, Android. Regressed on UWP in XF 4.3.991211.

Steps to Reproduce

  1. Create a new Xamarin.Forms template project with a UWP target (1903).
  2. Create a blank page inside a NavigationPage.
  3. Set the BarTextColor of the NavigationPage in code-behind or XAML.
  4. Add a ToolbarItem with an icon.
  5. Run the application.

Expected Behavior

The icon should be tinted to the color specified in the BarTextColor property.

Actual Behavior

The icon is not updated and remains it's original color.

Basic Information

  • Version with issue: 4.4.0.991477 (vLatest)
  • Last known good version: 4.3.0.947036
  • IDE: Microsoft Visual Studio 2019 Enterprise
  • Platform Target Frameworks:

    • UWP: Build 1903

Screenshots

XF 4.3.0.947036 or below.
Icon is tinted white.
Screenshot 2020-01-10 at 7 27 51 pm

XF 4.3.0.991211 and above (incl 4.40-sr2).
Icon is not tinted.
Screenshot 2020-01-10 at 7 30 08 pm

Previously on 16299
Previously when building for 16299, this is how the command bar used to look.
Notice how the icon is properly scaled and is in larger. This is a separate issue reported in #9042.
Screenshot 2020-01-10 at 7 26 38 pm

Reproduction Link

See attached sample projects:
ToolbarIconTint_4.2.910310_Ok.zip
ToolbarIconTint_4.3.991211_Bad.zip

4.4.0 3 regression UWP bug

Most helpful comment

@samhouts @rmarinho This is due to the following changes made in Platform.cs in #8147:

Removed

button.SetBinding(AppBarButton.IconProperty, "IconImageSource", _imageSourceIconElementConverter);

Added

if (commandBar.IsDynamicOverflowEnabled && item.Order == ToolbarItemOrder.Secondary)
{
    button.SetBinding(AppBarButton.IconProperty, "IconImageSource", _imageSourceIconElementConverter);
}
else
{
    var img = new WImage();
    img.SetBinding(WImage.SourceProperty, "Value");
    img.SetBinding(WImage.DataContextProperty, "IconImageSource", _imageConverter);
    button.Content = img;
}

When setting the IconProperty on an AppBarButton, this also automatically applies the tint color from BarTextColor. With the change to dynamically setting the button content, this native behavior is lost.

All 4 comments

Related to #9042.

@samhouts @rmarinho This is due to the following changes made in Platform.cs in #8147:

Removed

button.SetBinding(AppBarButton.IconProperty, "IconImageSource", _imageSourceIconElementConverter);

Added

if (commandBar.IsDynamicOverflowEnabled && item.Order == ToolbarItemOrder.Secondary)
{
    button.SetBinding(AppBarButton.IconProperty, "IconImageSource", _imageSourceIconElementConverter);
}
else
{
    var img = new WImage();
    img.SetBinding(WImage.SourceProperty, "Value");
    img.SetBinding(WImage.DataContextProperty, "IconImageSource", _imageConverter);
    button.Content = img;
}

When setting the IconProperty on an AppBarButton, this also automatically applies the tint color from BarTextColor. With the change to dynamically setting the button content, this native behavior is lost.

@samhouts Just wanted to touch base on this issue as I see it is marked "Ready for Work". Since this is a noticeable regression, would there be any chance to get this one looked at soon? Thanks!

This is on the backlog. I don't currently have an estimate of when we may begin work on this item, but we do prioritize regressions. Thank you for your patience!

Was this page helpful?
0 / 5 - 0 ratings