Valeriy Prisyazniy
Valeriy Prisyazniy

Reputation: 121

Change TabBar color

I'm trying to change UITabBarItem color in iOS. I'm using MVVMCross and Simple example by Stuart:

var viewControllers = new UIViewController[]
{
    CreateTabFor("1", "home", FirstViewModel.Child1),
    CreateTabFor("2", "twitter", FirstViewModel.Child2),
    CreateTabFor("3", "favorites", FirstViewModel.Child3),
};
ViewControllers = viewControllers;
CustomizableViewControllers = new UIViewController[] { };
SelectedViewController = ViewControllers[0];


private int _createdSoFarCount = 0;

private UIViewController CreateTabFor(string title, string imageName, IMvxViewModel viewModel)
{
    var controller = new UINavigationController();
    var screen = this.CreateViewControllerFor(viewModel) as UIViewController;
    SetTitleAndTabBarItem(screen, title, imageName);
    controller.PushViewController(screen, false);
    return controller;
}

private void SetTitleAndTabBarItem(UIViewController screen, string title, string imageName)
{
    screen.Title = title;
    screen.TabBarItem = new UITabBarItem(title, UIImage.FromBundle("Images/Tabs/" + imageName + ".png"),
                                             _createdSoFarCount);
    _createdSoFarCount++;
}

There is example image: enter image description here

Upvotes: 2

Views: 657

Answers (1)

Iain Smith
Iain Smith

Reputation: 9703

By color do you mean changing the image? you could do this:

private void SetTitleAndTabBarItem(UIViewController screen, string title, string imageName)
    {
        screen.Title = title;

        var offImage = UIImage.FromBundle (imageName);
        offImage = offImage.ImageWithRenderingMode (UIImageRenderingMode.AlwaysOriginal);
        offImage.AccessibilityLabel = title;

        var onImage = UIImage.FromBundle (imageName + "selected");
        onImage = onImage.ImageWithRenderingMode (UIImageRenderingMode.AlwaysOriginal);
        onImage.AccessibilityLabel = title;

        var tabBarItem = new UITabBarItem (title, offImage, onImage);
        tabBarItem.AccessibilityLabel = title;

        screen.TabBarItem = tabBarItem;

        _createdSoFarCount++;
    }

This constructor has a selectedImage and an image parameter to change selected states https://developer.xamarin.com/api/constructor/UIKit.UITabBarItem.UITabBarItem/p/System.String/UIKit.UIImage/UIKit.UIImage/

var tabBarItem = new UITabBarItem (title, offImage, onImage);

Update

for SelectedBackGroundTint You could set the Appearance of all UITabBars with this:

UITabBar.Appearance.SelectedImageTintColor = UIColor.Red;

for TextColor You could set the Appearance of all UITabBarItems with this:

UITabBarItem.Appearance.SetTitleTextAttributes (new UITextAttributes () {
        TextColor = UIColor.Red
}, UIControlState.Normal);

UITabBarItem.Appearance.SetTitleTextAttributes (new UITextAttributes () {
        TextColor = UIColor.Blue
}, UIControlState.Selected);

for BackGroundColor You could set the Appearance of all UITabBars with this:

UITabBar.Appearance.TintColor = UIColor.Magenta;

Upvotes: 1

Related Questions