[Enhancement] Shell TabBar Icon customization

xmesaj2 commented 5 years ago

Summary

Allow to choose rendering mode, change tint with selected image, scale XY.

API Changes

Both platforms allow to implement this, I don't know about UWP:

iOS:

[ ] Expose SelectedIcon Property of TabBar to new XAML property as ImageSource
[ ] Allow to set UIImage rendering mode.
[ ] Preferably also UIImage scaling size with CGRect could be added

Android:

[ ] Allow to swap loaded resource with SelectedIcon new XAML property as ImageSource
[ ] Allow to set TintList to null (so icons don't appear as glyphs)
[ ] Scaling by layout width/height

General SelectedItem on TabBar would not only set Tint colors, but replace resources.

var tab= new Tab();
tab.Icon= "envelope_closed.png";
tab.SelectedIcon= "envelope_open.png"; // new API
tab.ScaleX = tab.ScaleY = 0.5f; // Use CGRect iOS, calculate width/height percent Android
tab.RenderingMode = RenderingMode.AlwaysOriginal; // iOS-ish enum, but android would replace this to  NavigationView.setItemIconTintList(null);

Intended Use Case

When the project does not use glyphicons, but needs to switch Images dynamically example images for unselected states/selected: https://www.signsworldwide.com/images/thumbnails/450/192/detailed/4/Come-in-We-are-Open-polystyrene-sign-2.jpg would be now rendered as rectangles, instead with original colors and content

sruter commented 3 years ago

I have been trying to find just this solution, but for a FlyoutItem icon. Has this been implemented yet?

jfversluis commented 2 years ago

Thanks for this suggestion! As Xamarin.Forms is now in maintenance mode, this will not happen anymore for Xamarin.Forms. We're only adding bugfixes and stability fixes.

If this is still important to you, make sure to check the .NET MAUI repo and see if it's already on the roadmap. If not, feel free to open a discussion to discuss a change first or open an issue with a detailed feature request. Thanks!

xamarin / Xamarin.Forms