android - Xamarin Forms 如何更改我在底部导航区域中使用的 png 图标的颜色？

Question

我的应用程序使用这样的 png 图像:

navHomeTabPage.IconImageSource = "ionicons_2_0_1_home_outline_25.png";

我的代码在这里更改图标颜色:

android:TabbedPage.BarItemColor="{DynamicResource LabelTextColor}" 
android:TabbedPage.BarSelectedItemColor="{DynamicResource 
DroidBarSelectedItemColor}" TabBar.SelectedImageTintColor = UIColor.Red;

但是有人可以向我解释一下，颜色是如何改变的吗？我虽然 png 图像已经只有一种颜色，那么 Android 或 iOS 如何将其更改为不同的颜色？

svg 怎么样？移动应用程序在更改 png 或 svg 图像方面做得更好吗？对于 Botton 导航选项卡区域，使用其中一个比另一个更好吗？

Answer 1

对于 iOS，默认情况下，iOS 上的选项卡栏不会使用图像的原始颜色。来自 this documentation ，它说:

By default, unselected and selected images are automatically created from the alpha values in the source images. To prevent system coloring, provide images with UIImageRenderingModeAlwaysOriginal.

这意味着它将从源图像创建一个新图像并使用系统颜色，或者您可以使用上面的代码设置颜色:TabBar.SelectedImageTintColor = UIColor.Red;。如果你想显示原始图像的颜色，你必须为 TabbedPage 创建一个自定义渲染器，并用 API 替换图标:UIImageRenderingModeAlwaysOriginal .

对于 Android，底部导航页面将创建一个名为 BottomNavigationView 的额外层来控制颜色。它与原始图标重叠以显示您设置的颜色:

android:TabbedPage.BarItemColor="{DynamicResource LabelTextColor}" 
android:TabbedPage.BarSelectedItemColor="{DynamicResource 
DroidBarSelectedItemColor}"

如果您更喜欢原始颜色，您可以在自定义标签页的渲染器中删除它的 ItemIconTintList。请参阅此线程:https://forums.xamarin.com/discussion/comment/376630#Comment_376630获取更多信息。