[ios] 탭 표시 줄 항목 텍스트 제거, 이미지 만 표시

Question 1

간단한 질문입니다. 탭 표시 줄 항목 텍스트를 제거하고 이미지 만 표시하려면 어떻게해야합니까?

Instagram 앱에서 좋아하는 바 항목을 원합니다.

여기에 이미지 설명 입력

xcode 6의 검사기에서 제목을 제거하고 @ 2x (50px) 및 @ 3x (75px) 이미지를 선택합니다. 그러나 이미지는 제거 된 텍스트의 여유 공간을 사용하지 않습니다. 인스 타 그램 앱에서와 같이 동일한 탭 막대 항목 이미지를 얻는 방법에 대한 아이디어가 있습니까?

Question 2

당신은 함께 플레이해야 imageInsets의 재산입니다 UITabBarItem. 다음은 샘플 코드입니다.

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

내부 값 UIEdgeInsets은 이미지 크기에 따라 다릅니다. 내 앱에서 해당 코드의 결과는 다음과 같습니다.

여기에 이미지 설명 입력

Question 3

// 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);
}

Question 4

다음은 스토리 보드에서 수행하는 방법입니다.

제목 텍스트를 지우고 아래 스크린 샷과 같이 이미지 삽입을 설정합니다.

아이콘 크기는 애플 디자인 가이드 라인을 따라야합니다.

즉, @ 1x의 경우 25px x 25px, @ 2x의 경우 50px x 50px, @ 3x의 경우 75px x 75px가 있어야합니다.

Question 5

in view controller 가 설정된 경우 각 UITabBarItems title속성을 설정 ""
하고 업데이트하는 방법을 사용하면 imageInsets제대로 작동하지 않습니다 self.title. 예를 들어 self.viewControllersUITabBarController가 포함되어 UINavigationController있고 탐색 모음에 제목을 표시해야하는 경우 입니다 . 이 경우 , not을 UINavigationItem사용하여 직접 제목을 설정하십시오 .self.navigationItem.titleself.title

Question 6

빠른 버전 의 ddiego 답변

iOS 11과 호환

viewController의 제목을 설정 한 후 viewController의 모든 첫 번째 자식의 viewDidLoad에서이 함수를 호출합니다.

모범 사례 :

또는 @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 = UIEdgeInsets(top: offset, left: 0, bottom: -offset, right: 0)
        }
    }
}

Question 7

스토리 보드를 사용하는 경우 이것이 최선의 선택이 될 것입니다. 모든 탭 막대 항목을 반복하고 각 항목에 대해 제목을 아무것도 설정하지 않고 이미지를 전체 화면으로 만듭니다. (스토리 보드에 이미지를 추가해야합니다.)

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

Question 8

iOS 11은 이러한 많은 솔루션에서 꼬임이 발생하므로 UITabBar를 서브 클래 싱하고 layoutSubviews를 재정 의하여 iOS 11의 문제를 해결했습니다.

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
        }
    }
}