Как добавить пользовательский образ разделителя в UITabBar?
У меня есть UITabBar, который я пытаюсь создать после появления нового App Store в iOS 6. У меня есть довольно красивые градиенты, но мне интересно, как установить изображение разделителя.
Помимо ручного добавления строки к каждому изображению, есть ли что-нибудь, что я могу сделать, чтобы воспроизвести вид разделителя?
![enter image description here]()
![enter image description here]()
![enter image description here]()
Ответы
Ответ 1
Вы можете добавить изображение для каждого элемента, для выбранных и невыбранных состояний.
Вот так:
UIImage *selectedImage0 = [UIImage imageNamed:@"image1.png"];
UIImage *unselectedImage0 = [UIImage imageNamed:@"image1_unselected.png"];
UIImage *selectedImage1 = [UIImage imageNamed:@"image2.png"];
UIImage *unselectedImage1 = [UIImage imageNamed:@"image2_unselected.png"];
UIImage *selectedImage2 = [UIImage imageNamed:@"image3.png"];
UIImage *unselectedImage2 = [UIImage imageNamed:@"image3_unselected.png"];
UIImage *selectedImage3 = [UIImage imageNamed:@"image4.png"];
UIImage *unselectedImage3 = [UIImage imageNamed:@"image4_unselected.png"];
UIImage *selectedImage4 = [UIImage imageNamed:@"image5.png"];
UIImage *unselectedImage4 = [UIImage imageNamed:@"image5_unselected.png"];
UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
UITabBarItem *item3 = [tabBar.items objectAtIndex:3];
UITabBarItem *item4 = [tabBar.items objectAtIndex:4];
[item0 setFinishedSelectedImage:selectedImage0 withFinishedUnselectedImage:unselectedImage0];
[item1 setFinishedSelectedImage:selectedImage1 withFinishedUnselectedImage:unselectedImage1];
[item2 setFinishedSelectedImage:selectedImage2 withFinishedUnselectedImage:unselectedImage2];
[item3 setFinishedSelectedImage:selectedImage3 withFinishedUnselectedImage:unselectedImage3];
[item4 setFinishedSelectedImage:selectedImage4 withFinishedUnselectedImage:unselectedImage4];
Вы можете поместить этот код в метод viewDidLoad
любого из ваших контроллеров.
Надеюсь, это поможет.
Ура!
Ответ 2
я поставлю свое изображение на панели вкладок, например: -
![my tab bar image]()
и я установил его на панели управления, например: -
CGRect frame = CGRectMake(0.0, 0.0, 320, 48);
NSLog(@"%f",frame.size.width);
UIView *v = [[UIView alloc] initWithFrame:frame];
// [v setBackgroundColor:DARK_BACKGROUNDTabBar];
UIImageView *imgView =[[UIImageView alloc]initWithFrame:frame];
UIImage *img1 = [UIImage imageNamed:@"tabbar.png"];
[imgView setImage:img1];
[v addSubview:imgView];
[v setAlpha:1];
[[self.tabBarController tabBar] insertSubview:v atIndex:1];
[v release];
надеюсь, что его использование будет полным для вас
вы можете создать собственное изображение с вкладкой 4 или 5 и установить, как указано выше
Ответ 3
Если вы хотите, чтобы вкладки были "выбраны" и "нормальное" фоновое изображение (включая половину разделителя слева и справа), вы можете подклассифицировать UITabBarController, а во время viewDidLoad заменить UITabBar на UIButtons. Это довольно прямолинейно. Изображения устанавливаются в качестве фона кнопок. Они содержат 4px делителя слева и справа.
Я использую это с раскадрой, поэтому массив self.tabBar.items уже заполняется при вызове viewDidLoad.
@interface MyTabBarController()
@property (nonatomic,strong) UIImage *selectedImage;
@property (nonatomic,strong) UIImage *normalImage;
@end
@implementation MyTabBarController
@synthesize selectedImage, normalImage;
- (void) viewDidLoad
{
[super viewDidLoad];
// set whichever view you want to start with
self.selectedIndex = 1;
self.tabBar.hidden=YES;
// those are the images used for the selected and not selected tabs
self.selectedImage = [[UIImage imageNamed:@"tabBarBackground_down.png"] stretchableImageWithLeftCapWidth:4 topCapHeight:0];
self.normalImage = [[UIImage imageNamed:@"tabBarBackground.png"] stretchableImageWithLeftCapWidth:4 topCapHeight:0];
CGFloat width = self.view.frame.size.width/[self.tabBar.items count];
for( int itemIndex=0; itemIndex<[self.tabBar.items count]; itemIndex++ )
{
UITabBarItem *item = [self.tabBar.items objectAtIndex:itemIndex];
// create a button
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
// configure the button to act as a tab
button.adjustsImageWhenHighlighted = NO;
[button setImage:item.image forState:UIControlStateNormal];
[button setBackgroundImage:self.selectedIndex==itemIndex?self.selectedImage:self.normalImage forState:UIControlStateNormal];
// this is used later to set the selectedIndex of the UITabBarController
button.tag = itemIndex;
// position the button in place of tab
CGFloat nextXStart = itemIndex+1==[self.tabBar.items count]?self.view.frame.size.width:rint(width*(itemIndex+1));
button.frame = CGRectMake(rint(width*itemIndex), self.view.frame.size.height-49, nextXStart-rint(width*itemIndex) , 49);
[self.view addSubview:button];
// add event to the button
[button addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchDown];
}
}
- (void) buttonClicked:(id)sender
{
UIButton *button = sender;
if( self.selectedIndex!=button.tag )
{
// select the tab and change the visible viewcontroller
self.selectedIndex = button.tag;
// reset all but the active buttons to have the normal image
for( UIView *subview in self.view.subviews )
{
if( subview!=sender && [subview isKindOfClass:[UIButton class]])
[((UIButton *)subview) setBackgroundImage:self.normalImage forState:UIControlStateNormal];
}
// set the selectedImage as background of the clicked button
[button setBackgroundImage:self.selectedImage forState:UIControlStateNormal];
}
}
@end