Movendo a imagem UITabBarItem para baixo?

98

Normalmente, em cada guia de uma UITabBarvocê tem uma pequena imagem e um título nomeando a guia. A imagem é posicionada / centralizada na parte superior da guia para acomodar o título abaixo. Minha pergunta é: se você quiser ter uma tabBar com apenas uma imagem e sem título, há uma maneira de mover a imagem para baixo para que ela centralize melhor na guia?

Estou usando (veja abaixo) atualmente:

[tabBarItem setFinishedSelectedImage:tabSelected withFinishedUnselectedImage:tabUnselected];

mas preferiria usar para uma imagem maior sem título, no momento, se eu aumentar a imagem maior do que cerca de 70 pixels @ 2x, ela começa a sair da parte superior, UITabBarenquanto deixa muito espaço não utilizado na parte inferior.

— cabra peluda
fonte

179

Tente ajustar tabBarItemo de imageInsets(para mover a imagem do ícone) e definir o título do controlador como nulo (de forma que nenhum título seja exibido). Coloque algo assim para -initou -viewDidLoadmétodo no controlador de visualização:

Objective-C

self.tabBarItem.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
self.title = nil;

Rápido

self.tabBarItem.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
self.title = nil

UITabBarItemé uma subclasse da UIBarItemqual possui UIEdgeInsets imageInsetspropriedade. Brinque um pouco com as inserções até que pareça bom (dependendo das imagens do ícone da barra de guias)

— Lukas Kukacka
fonte

3

@Lukas: mas isso diminui as imagens.

— Sourabh Bhardwaj

1

@Sourabh não os encolhe para mim

— TigerCoding

7

O valor real de inserção é 5.5f se você precisar que ele seja pixel perfeito.

— usuário

1

@ rr1g0 Não é possível mover o emblema para uma posição personalizada. Se precisar de uma posição personalizada de um crachá ou aparência de crachá personalizado, você deve implementá-lo você mesmo

— Lukas Kukacka

1

@Sourabh você tem que deslocar a parte inferior com um valor negativo para não encolher a imagem.

— Rmalmoe

150

Você também pode fazer isso via storyboard. Selecione seu tabbaritem, vá para o inspetor de tamanho e atribua os insets apropriados.

* Demonstrado no Xcode, versão 7.3.1 (7D1014)

— Neil Galiaskarov
fonte

Legal e Limpo!

— ken

Melhor de todas as respostas ... Muito obrigado @Neil Galiaskarov

— Venkatesh Chejarla

49

Faça uma subclasse de UITabBarControllere em seu viewDidLoad:

- (void)viewDidLoad
{
    [super viewDidLoad];
    [self.viewControllers enumerateObjectsUsingBlock:^(UIViewController *vc, NSUInteger idx, BOOL *stop) {
        vc.tabBarItem.title = nil;
        vc.tabBarItem.imageInsets = UIEdgeInsetsMake(5, 0, -5, 0);
    }];
}

Swift 3:

for vc in self.viewControllers! {
    vc.tabBarItem.title = nil
    vc.tabBarItem.imageInsets = UIEdgeInsetsMake(5, 0, -5, 0)
}

— Brian
fonte

isso funcionou para mim. apenas que para o swift, o método enumerateObjectsUsingBlock não está mais disponível

— Junchao Gu

não faça subclasses, em vez disso, coloque-o em seu AppDelegate

— Laszlo

1

colocar esse snippet AppDelegatetambém funciona, mas obviamente não é melhor do que subclassificá-lo. Você pode ter sua própria preferência :)

— Brian,

10

Se você estiver usando o Xamarin, isso funciona:

screen.TabBarItem.ImageInsets = new UIEdgeInsets(5, 0, -5, 0);
screen.TabBarItem.Title = "";

— Jelle
fonte

10

Isso funcionou para mim

Swift 4

let array = tabBarController?.customizableViewControllers
for controller in array! {
    controller.tabBarItem.imageInsets = UIEdgeInsetsMake(5, 0, -5, 0)
}

— Alfi
fonte

2

SWIFT 3.0

Você pode definir configurações de imagem, definir superior, esquerda, inferior e direita de acordo com o desing.

self.tabBarItem.imageInsets = UIEdgeInsets(top: 5, left: 0, bottom: 0, right: 0)

— Krish
fonte

2

Para iOS 11, você precisa substituir o método TraitCollection além de definir ImageInsets. Por favor, adicione o método em sua classe UITabBarController subclasse

public override UITraitCollection TraitCollection {
 get {
  return UITraitCollection.FromHorizontalSizeClass(horizontalSizeClass: UIUserInterfaceSizeClass.Compact);
 }
}

— Prashant
fonte

Boa dica que me ajudou a resolver um problema relacionado à posição da imagem para o item da barra de guias no iPad e iOS 11. Mas é muito difícil substituir a coleção de características no nível do controlador de visualização, é melhor criar uma subclasse da classe UITabBar e substituir a propriedade traitCollection há. Também retornar uma coleção de características com apenas a classe horizontal, descartará outras propriedades da coleção de características. return UITraitCollection(traitsFrom: [ super.traitCollection, UITraitCollection(horizontalSizeClass: .compact)])fez o truque para mim.

— Emmanuel Paris

1

No Swift 4.2 , UIEdgeInsetsMakeestá obsoleto, em vez disso, devemos usar UIEdgeInsets,

let array = tabBarController?.customizableViewControllers
    for controller in array! {
        controller.tabBarItem.imageInsets = UIEdgeInsets(top: 5, left: 0, bottom: -5, right: 0)
    }

— Bappaditya
fonte