Удалить текст строки вкладки, показать только изображение

Ответ 1

Вы должны играть с imageInsets свойством UITabBarItem. Вот пример кода:

let tabBarItem = UITabBarItem(title: nil, image: UIImage(named: "more")
tabBarItem.imageInsets = UIEdgeInsets(top: 9, left: 0, bottom: -9, right: 0)

Значения внутри UIEdgeInsets зависят от размера вашего изображения. Вот результат этого кода в моем приложении:

Ответ 2

// Remove the titles and adjust the inset to account for missing title
for(UITabBarItem * tabBarItem in self.tabBar.items){
    tabBarItem.title = @"";
    tabBarItem.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0);
}

Ответ 3

Вот как вы делаете это в раскадровке.

Очистите текст заголовка и установите вставку изображения, как снимок экрана ниже

Помните, что размер значка должен соответствовать руководству Apple design

Это означает, что вы должны иметь 25px x 25px для @1x, 50px x 50px для @2x, 75px x 75px для @3x

Ответ 4

Использование подхода с установкой каждого свойства UITabBarItem title в "" и обновление imageInsets не будет работать должным образом, если установлен контроллер self.title. Например, если self.viewControllers UITabBarController встроен в UINavigationController, и вам нужно заголовок, который будет отображаться на панели навигации. В этом случае установите UINavigationItem заголовок непосредственно с помощью self.navigationItem.title, а не self.title.

Ответ 5

Свифт версия ответа ddiego

Совместим с iOS 11

Вызывайте эту функцию в viewDidLoad каждого первого дочернего элемента viewControllers после установки заголовка viewController.

Лучшая практика:

В качестве альтернативы, как @daspianist предложил в комментариях

Сделайте подкласс подобного класса BaseTabBarController: UITabBarController, UITabBarControllerDelegate и поместите эту функцию в подкласс viewDidLoad.

func removeTabbarItemsText() {

    var offset: CGFloat = 6.0

    if #available(iOS 11.0, *), traitCollection.horizontalSizeClass == .regular {
        offset = 0.0
    }

    if let items = tabBar.items {
        for item in items {
            item.title = ""
            item.imageInsets = UIEdgeInsetsMake(offset, 0, -offset, 0);
        }
    }
}

Ответ 6

Если вы используете раскадровки, это лучший вариант. Он перемещается по всем элементам панели вкладок и для каждого из них присваивает заголовок ни к чему и делает изображение полноэкранным. (Вы должны добавить изображение в раскадровку)

for tabBarItem in tabBar.items!
{
   tabBarItem.title = ""
   tabBarItem.imageInsets = UIEdgeInsetsMake(6, 0, -6, 0)
}

Ответ 7

iOS 11 выбрасывает изломы во многих из этих решений, поэтому я только что исправил свои проблемы в iOS 11 путем подкласса UITabBar и переопределения layoutSubviews.

class MainTabBar: UITabBar {

    override func layoutSubviews() {
        super.layoutSubviews()

        // iOS 11: puts the titles to the right of image for horizontal size class regular. Only want offset when compact.
        // iOS 9 & 10: always puts titles under the image. Always want offset.
        var verticalOffset: CGFloat = 6.0

        if #available(iOS 11.0, *), traitCollection.horizontalSizeClass == .regular {
            verticalOffset = 0.0
        }

        let imageInset = UIEdgeInsets(
            top: verticalOffset,
            left: 0.0,
            bottom: -verticalOffset,
            right: 0.0
        )

        for tabBarItem in items ?? [] {
            tabBarItem.title = ""
            tabBarItem.imageInsets = imageInset
        }
    }
}

Ответ 8

Я использовал следующий код в моем BaseTabBarController viewDidLoad. Обратите внимание, что в моем примере у меня есть 5 вкладок, и выбранное изображение всегда будет base_image + "_selected".

// Get tab bar and set base styles
let tabBar = self.tabBar;
tabBar.backgroundColor = UIColor.whiteColor()

// Without this, images can extend off top of tab bar
tabBar.clipsToBounds = true

// For each tab item..
let tabBarItems = tabBar.items?.count ?? 0
for i in 0 ..< tabBarItems {
    let tabBarItem = tabBar.items?[i] as UITabBarItem

    // Adjust tab images (Like mstysf says, these values will vary)
    tabBarItem.imageInsets = UIEdgeInsetsMake(5, 0, -6, 0);

    // Let find and set the icon default and selected states
    // (use your own image names here)
    var imageName = ""
    switch (i) {
    case 0: imageName = "tab_item_feature_1"
    case 1: imageName = "tab_item_feature_2"
    case 2: imageName = "tab_item_feature_3"
    case 3: imageName = "tab_item_feature_4"
    case 4: imageName = "tab_item_feature_5"
    default: break
    }
    tabBarItem.image = UIImage(named:imageName)!.imageWithRenderingMode(.AlwaysOriginal)
    tabBarItem.selectedImage = UIImage(named:imageName + "_selected")!.imageWithRenderingMode(.AlwaysOriginal)
}

Ответ 9

Swift 4 подход

Я смог добиться цели, реализовав функцию, которая принимает TabBarItem и выполняет для него некоторое форматирование.

Перемещает изображение немного вниз, чтобы сделать его более центрированным, а также скрывает текст панели вкладок. Работает лучше, чем просто установка его заголовка в пустую строку, потому что когда у вас есть NavigationBar, TabBar восстанавливает заголовок viewController при выборе

func formatTabBarItem(tabBarItem: UITabBarItem){
    tabBarItem.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
    tabBarItem.setTitleTextAttributes([NSAttributedStringKey.foregroundColor:UIColor.clear], for: .selected)
    tabBarItem.setTitleTextAttributes([NSAttributedStringKey.foregroundColor:UIColor.clear], for: .normal)
}

Последний синтаксис

extension UITabBarItem {
    func setImageOnly(){
        imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
        setTitleTextAttributes([NSAttributedString.Key.foregroundColor:UIColor.clear], for: .selected)
        setTitleTextAttributes([NSAttributedString.Key.foregroundColor:UIColor.clear], for: .normal)
    }
 }

И просто используйте его в своей вкладке как:

tabBarItem.setImageOnly()

Ответ 10

Минимальное безопасное расширение UITabBarController в Swift (на основе ответа @korgx9):

extension UITabBarController {
  func removeTabbarItemsText() {
    tabBar.items?.forEach {
      $0.title = ""
      $0.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
    }
  }
}

Ответ 11

Вот лучший, более надежный способ сделать это, кроме верхнего ответа:

[[UITabBarItem appearance] setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor clearColor]}
                                         forState:UIControlStateNormal];
[[UITabBarItem appearance] setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor clearColor]}
                                         forState:UIControlStateHighlighted];

Поместите это в свой AppDelegate.didFinishLaunchingWithOptions, чтобы он влиял на все кнопки панели вкладок на протяжении всего срока действия вашего приложения.

Ответ 12

Основываясь на ответе ddiego, в Swift 4.2:

extension UITabBarController {
    func cleanTitles() {
        guard let items = self.tabBar.items else {
            return
        }
        for item in items {
            item.title = ""
            item.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
        }
    }
}

И вам просто нужно вызвать self.tabBarController?.cleanTitles() в вашем контроллере представления.

Ответ 13

Основываясь на всех замечательных ответах на этой странице, я разработал другое решение, которое также позволяет вам снова показать заголовок. Вместо удаления содержимого заголовка я просто изменяю цвет шрифта на прозрачный.

extension UITabBarItem {

    func setTitleColorFor(normalState: UIColor, selectedState: UIColor) {
        self.setTitleTextAttributes([NSAttributedString.Key.foregroundColor: normalState], for: .normal)
        self.setTitleTextAttributes([NSAttributedString.Key.foregroundColor: selectedState], for: .selected)
    }

}


extension UITabBarController {

    func hideItemsTitle() {

        guard let items = self.tabBar.items else {
            return
        }

        for item in items {
            item.setTitleColorFor(normalState: UIColor(white: 0, alpha: 0), selectedState: UIColor(white: 0, alpha: 0))
            item.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)
        }

    }

    func showItemsTitle() {

        guard let items = self.tabBar.items else {
            return
        }

        for item in items {
            item.setTitleColorFor(normalState: .black, selectedState: .yellow)
            item.imageInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
        }

    }

}

Ответ 14

код:

private func removeText() {
    if let items = yourTabBarVC?.tabBar.items {
       for item in items {
          item.title = ""
       }
    }
 }

Ответ 15

Самый простой способ и всегда работает:

class TabBar: UITabBar {

    override func layoutSubviews() {
        super.layoutSubviews()

        subviews.forEach { subview in
            if subview is UIControl {
                subview.subviews.forEach {
                    if $0 is UILabel {
                        $0.isHidden = true
                        subview.frame.origin.y = $0.frame.height / 2.0
                    }
                }
            }
        }
    }
}

Ответ 16

В моем случае, тот же ViewController был использован в TabBar и других потоках навигации. Внутри моего ViewController я установил self.title = "Some Title", который появлялся в TabBar, независимо от установки заголовка nil или пустым при добавлении его в панель вкладок. Я также установил imageInsets следующим образом:

item.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)

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

if isFromTabBar {
   // Title for NavigationBar when ViewController is added in TabBar
   // NOTE: Do not set self.title = "Some Title" here as it will set title of tabBarItem
   self.navigationItem.title = "Some Title"
} else {
   // Title for NavigationBar when ViewController is opened from navigation flow
   self.title = "Some Title"
}

Ответ 17

создайте подкласс UITabBarController и назначьте его вашему tabBar, затем в методе viewDidLoad поместите эту строку кода:

tabBar.items?.forEach({ (item) in
        item.imageInsets = UIEdgeInsets.init(top: 8, left: 0, bottom: -8, right: 0)
    })

Ответ 18

Пользовательский TabBar - iOS 13, Swift 5, XCode 11

• Элементы TabBar без текста
• Элементы TabBar по центру вертикально
• Округлый вид TabBar
• TabBar Динамическая позиция и рамки

Раскадровка основана. Это может быть легко достигнуто программным путем. Всего 4 шага:

1. Значки панели вкладок должны быть трех размеров, черного цвета. Обычно скачиваю с fa2png.io - размеры: 25х25, 50х50, 75х75. PDF файлы изображений не работают!

2. В раскадровке для элемента панели вкладок установите значок, который вы хотите использовать через инспектор атрибутов. (см. скриншот)

3. Пользовательский TabBarController → Новый файл → Тип: UITabBarController → Установить на раскадровке. (см. скриншот)

4. Класс UITabBarController импорт UIKit

   Класс RoundedTabBarViewController: UITabBarController {

   override func viewDidLoad() {
       super.viewDidLoad()
   
       // Do any additional setup after loading the view.
       // Custom tab bar view
       customizeTabBarView()
   }
   
   private func customizeTabBarView() {
       let tabBarHeight = tabBar.frame.size.height
       self.tabBar.layer.masksToBounds = true
       self.tabBar.isTranslucent = true
       self.tabBar.barStyle = .default
       self.tabBar.layer.cornerRadius = tabBarHeight/2
       self.tabBar.layer.maskedCorners = [.layerMaxXMaxYCorner, .layerMaxXMinYCorner, .layerMinXMaxYCorner, .layerMinXMinYCorner]
   }
   
   override func viewDidLayoutSubviews() {
       super.viewDidLayoutSubviews()
       let viewWidth = self.view.bounds.width
       let leadingTrailingSpace = viewWidth * 0.05
   
       tabBar.frame = CGRect(x: leadingTrailingSpace, y: 200, width: viewWidth - (2 * leadingTrailingSpace), height: 49)
   }
   

   }

5. Результат