2

I have an UITabBar in my application. One of the tab bar icons looks like a loading symbol. When the user presses the loading button I want the icon to spin/rotate until the loading is done. Should I use UIImageView to animate or something else? How should I make this happen?

Jacob
  • 1,310
  • 1
  • 15
  • 29

4 Answers4

1

Jacos, unfortunately you cannot do that with the UITabBarController and manipulate the tabBarController's tabBar properties. My best bet would be that you use a UIToolBar and assign a black color and make it appear like a tabBar and have buttons added in them as a subView so that they look like tabBarItems.

Its much more customizable, and you can even provide a scrolling experience and add more buttons to it.

Legolas
  • 12,145
  • 12
  • 79
  • 132
  • But what if my tab bar is hooked up to a bunch of view controllers? – Jacob Jun 15 '12 at 12:35
  • Well. If your `tabBar` is hooked up to a bunch of View Controllers => I dont understand your question. You still cannot animate tabBarIcons. I would stronly recommend a UIToolBar (or) use an `activityIndicicator` in the middle of the screen to indicate loading – Legolas Jun 15 '12 at 18:08
  • Okay thanks! I understand that you cannot animate the tabbar icons. Of course I can put a activity indicator in the middle of screen (actually, I already have), but I just thought it would be a cool effect to animate the tabbar icon for indicating the loading progress! – Jacob Jun 17 '12 at 15:30
  • Yes, you can do that. But you need to have a `UIToolbar` instead of a `UITabBar` :) TBH, You can actually create your own custom tabBar and subclass and add animations to it. But APPLE may reject it as you need to be strict with the rules (but its just a risk, and APPLE MAY reject you). – Legolas Jun 17 '12 at 17:32
1

I know this question is 4 years old but I had the same problem and managed to fix it by reading the tutorial in here:

https://medium.com/@werry_paxman/bring-your-uitabbar-to-life-animating-uitabbaritem-images-with-swift-and-coregraphics-d3be75eb8d4d#.bjfpbdnut

The main point is to get the view for desired UITabBarItem and the get the UIImageView from it in viewDidLoad:

UIView *plusView = self.tabBar.subviews[1];
self.plusImageView = plusView.subviews.firstObject;
self.plusImageView.contentMode = UIViewContentModeCenter;

Then in didSelectItem method you can do this:

[UIView animateWithDuration:0.4 animations:^{
      [self.plusImageView setTransform:CGAffineTransformMakeRotation(M_PI/4)];
}];

My code only rotate the image view for 45 degrees but you can change as you wish.

Sina Taghva
  • 11
  • 1
0

I guess you could change the UITabBarItem's icon on a timer, but that seems pretty kludgey. You would have to pre-render each frame of your "loading" icon rather than rotate an ImageView.

Another hackey solution would be to add your ImageView to the UIWindow and move it on top of the TabBarController's TabBar (adding it to the TabBar itself is asking for trouble).

Brian
  • 15,599
  • 4
  • 46
  • 63
0

You shouldn't try to animate the actual UIImageView within the UITabBarController. I would take this approach:

  1. Set the image for the relevant tab to nil or a blank image.
  2. Create a UIActivityIndicatorView and add it over the tab bar. Position it over the correct tab. [self.tabBarController.tabBar addSubview:activityIndicatorView];
  3. When your loading task has completed, restore the normal image to the tab and remove the activityIndicator from the tab bar.
Michael Frederick
  • 16,664
  • 3
  • 43
  • 58