Twitter-esque UITabBarController?

Я хотел бы сделать приложение, которое использует UITabBarController, который похож на тот, что в приложении Twitter для iPhone и iPod touch. (Синий свет для непрочитанной и скользящей стрелки для переключения между видами контента).

Есть ли простой способ сделать это? Любой открытый код?

Изменить:

Я добавил щедрость. Я ищу ответ, который работает через устройства и на iOS 4 и iOS 5.

EDIT:

Я испортил свой исходный код, и я нашел простое решение. Я добавил следующую проверку для iOS 5 в моем коде анимации:

//  iOS 5 changes the subview hierarchy 
//  so we need to check for it here

BOOL isUsingVersionFive = NO;
NSString *reqSysVer = @"5.0";
NSString *currSysVer = [[UIDevice currentDevice] systemVersion];
if ([currSysVer compare:reqSysVer options:NSNumericSearch] != NSOrderedAscending){
    //On iOS 5, otherwise use old index
    isUsingVersionFive = YES;
}

Затем вместо этого:

CGFloat tabMiddle = CGRectGetMidX([[[[self tabBar] subviews] objectAtIndex:index] frame]);

... Я использую это:

CGFloat tabMiddle = CGRectGetMidX([[[[self tabBar] subviews] objectAtIndex:index + (isUsingVersionFive ? 1 : 0)] frame]);

Тем не менее, держась за щедрость, на случай, если у меня появится возможность найти что-то, что работает в ответах.

Ответ 1

Я бы создал подкласс стандартного UITabBarController и добавил пару подзонов для синего света и скользящей стрелки. Не должно быть слишком сложно выполнить.

Edit: Вот идея некоторых вещей, которые должны идти в вашем подклассе. Я даже не знаю, скомпилирует ли этот код.

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
    if ((self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil])) {
        super.delegate = self;
    }
    return self;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    //Create blueLight
    UIImage* img = [UIImage imageNamed:@"blue_light.png"]
    self.blueLight = [[UIImageView alloc] initWithImage:img];
    self.blueLight.center = CGPointMake(320, 460); //I'm using arbitrary numbers here, position it correctly
    [self.view addSubview:self.blueLight];
    [self.blueLight release];

    //Create arrow, similar code.
}

- (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController{
    //Put code here that moves (animates?) the blue light and the arrow


    //Tell your delegate, what just happened.
    if([myDelegate respondsToSelector:@selector(tabBarController:didSelectViewController:)]){
        [myDelegate tabBarController:self didSelectViewController:viewController]
    }
}

Ответ 3

Хотя стареющий пост, хотя я бы включил проект GitHub, о котором никто не упоминал, они хорошо воссоздали панель вкладок в стиле Twitter, вот ссылка:

https://github.com/boctor/idev-recipes/tree/master/CustomTabBar

Проект находится в подпапке с именем "CustomTabBar", дополнительную информацию можно найти здесь:

http://idevrecipes.com/2011/01/04/how-does-the-twitter-iphone-app-implement-a-custom-tab-bar/

Ответ 4

BCTabBarController - это то, что я основал на моей вкладке в стиле пользовательского твиттера и работает в iOS 4 и 5: http://pastebin.me/f9a876a6ad785cb0b2b7ad98b1024847

Каждый контроллер представления таблиц должен реализовать следующий способ для изображения вкладок:

- (NSString *)iconImageName {
    return @"homeTabIconImage.png";
}

(В делегате приложения) вы должны инициализировать контроллер панели табуляции следующим образом:

self.tabBarController = [[[JHTabBarController alloc] init] autorelease];
self.tabBarController.delegate = self;
self.tabBarController.viewControllers = [NSArray arrayWithObjects:
                                         [[[UINavigationController alloc] initWithRootViewController:[[[iPhoneHomeViewController alloc] init] autorelease]] autorelease],
                                         [[[UINavigationController alloc] initWithRootViewController:[[[iPhoneAboutUsViewController alloc] init] autorelease]] autorelease],
                                         [[[UINavigationController alloc] initWithRootViewController:[[[iPhoneContactInfoViewController alloc] init] autorelease]] autorelease],
                                         [[[UINavigationController alloc] initWithRootViewController:[[[iPhoneMapUsViewController alloc] init] autorelease]] autorelease],
                                         [[[UINavigationController alloc] initWithRootViewController:[[[iPhoneCreditsViewController alloc] init] autorelease]] autorelease],
                                             nil];

По желанию вы можете использовать пользовательское фоновое изображение для каждого контроллера вида табуляции с помощью этого метода:

- (UIImage *)tabBarController:(JHTabBarController *)tabBarController backgroundImageForTabAtIndex:(NSInteger)index {
    NSString *bgImagefilePath;
    switch (index) {
        case 0:
            bgImagefilePath = @"homeBG.png";
            break;
        case 1:
            bgImagefilePath = @"aboutBG.png";
            break;
        case 2:
            bgImagefilePath = @"contactBG.png";
            break;
        case 3:
            bgImagefilePath = @"mapBG.png";
            break;
        case 4:
            bgImagefilePath = @"creditsBG.png";
            break;
        default:
            bgImagefilePath = @"homeBG.png";
            break;
    }
    return [UIImage imageNamed:bgImagefilePath];
}

Стрелка в верхней части панели вкладок перемещается к вкладке, выбранной так же, как панель вкладок твиттера.

Некоторые скриншоты:

BCTabBarControllerBCTabBarController

Ответ 5

Только 2 дня я сделал одно приложение, подобное этому для POC, оказалось, что это проще, чем вы можете думать.

Сначала в моем методе applicationdidfinishlaunching: я добавил изображение, содержащее изображение указателя или стрелки шириной 64, так как ширина экрана равна 320, и у меня есть 5 вкладок на панели вкладок. вы также можете вычислить его, если считаете, что ваш проект будет иметь динамические вкладки, а затем просто измените ширину изображения соответственно.

CGRect rect = tabBarpointerImageView.frame;
rect.size.width = sel.window.frame.size.width / tabbarcontroller.viewControllers.count;
tabBarpointerImageView.frame = rect;

Вы также можете настроить режим содержимого этого изображения как uiviewcontentmodecenter
Кроме того, я установил кадр изображения с помощью некоторых вычислений, таких как

CGRect rect = CGRectZero;
rect.size.width = self.window.frame.size.width / tabbarcontroller.viewControllers.count;
rect.size.height = 10;// as image was of 10 pixel height.
rect.origin.y = self.window.frame.size.height - 49;// as the height of tab bar is 49
tabBarpointerImageView.frame = rect;

И затем в методе делегата контроллера панели вкладок

- (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController

просто используйте блок анимации для анимации перемещения указателя, подобного этому

[uiview beginanimation:nil context:nil];
CGRect rect = tabBarpointerImageView.frame;
rect.origin.x = rect.size.width * tabbarcontroller.selectedIndex;
tabBarpointerImageView.frame = rect;
[uiview commitanimations];

PS. Извините, если некоторые написания неверны.