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

Respostas:

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.

insira a descrição da imagem aqui

* 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