스토리 보드에서 탭 막대 항목 선택 색상 변경


175

탭 막대 항목을 기본 파란색 대신 분홍색으로 변경하고 싶습니다.

Xcode 6에서 스토리 보드 편집기를 사용하여 어떻게 이것을 할 수 있습니까?

다음은 작동하지 않는 현재 설정이며 파란색 배경은 작동하지만 분홍색은 작동하지 않습니다.

여기에 이미지 설명을 입력하십시오



이 솔루션에 대한 당신을 도울 것이 답변을 확인합니다 stackoverflow.com/a/58727092/7804300
Talha 아메드

답변:


408

StoryBoard에서 "tintColor"라는 런타임 색상 속성을 추가하십시오. 이것은 작동합니다 ( Xcode 8 이상 ).

선택하지 않은 색을 원한다면 추가 할 수도 있습니다 unselectedItemTintColor.

tintColor를 런타임 속성으로 설정


24
이 속성을 UITabBar가 아닌 UITabBarItem에 추가했을 때 저에게 효과적이었습니다.
Sourabh86

1
그러나 스토리 보드에서 탭 막대 항목 선택되지 않은 색상을 어떻게 설정합니까?
Peter

1
내 경우에 완벽하게 작동합니다-선택할 때 5 개의 tabBar 항목이 고유 한 색상이어야합니다. 나는에 런타임 속성을 설정 할 수 있었다 UITabBarItem온, UINavigationController내 한 tabBar에 연결이 완벽하게 작동합니다. VC 클래스를 세 번 재사용하므로 코드를 작성하지 않아도 좋습니다. 감사!
rosshump

7
반대로-이것은 iOS 10에서 작동하는 유일한 접근 방법입니다 (속성 패널에서 색조가 작동하지 않는 것 같고 uitabbaritem의 런타임 속성 "tintColor"도 작동하지 않음)
luky

5
StackOverflow 1 : Apple 0
Sharukh Mastan

175

이 우아한 솔루션은 SWIFT 3.0 , SWIFT 4.2SWIFT 5.1 에서 훌륭하게 작동합니다 .

스토리 보드에서 :

  1. 탭 바를 선택하십시오
  2. 탭 막대 에서 선택한 아이콘 의 원하는 색상에 대해 tintColor 라는 런타임 Attibute를 설정하십시오.
  3. 집합 런타임 Attibute이 라는 unselectedItemTintColor을 의 원하는 색상에 대한 선택하지 않은 아이콘 탭 표시 줄에

여기에 이미지 설명을 입력하십시오

편집 : iOS 10/12 이상에서 Xcode 8/10 작업 .


6
고마워 unselectedItemTintColor는 매우 드문 발견
Rushi trivedi에게

4
'unselectedItemTintColor'완벽한 솔루션 덕분입니다.
fozoglu

배포 대상이 8.0 또는 9.0 인 경우이 기능이 작동합니까? 개발을 위해 swift 3.0과 Xcode 8.0을 사용했습니다
Mamta

2
탭 막대를 선택하는 것이 중요합니다. 실제로 Swift 4에서 작동했습니다.
단점 Bulaquena

2
우수한! : 컴파일하면 여전히 엑스 코드 (10) 작업 : 비주얼 편집기를 새로 고칠 수 있지만 작동하지 않습니다
미하일 Minkov

64

Swift에서 xcode 7 이상을 사용하여 AppDelegate.swift 파일에 다음을 추가 할 수 있습니다.

UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)

이것이 완전한 방법의 모습입니다 :

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {

    // I added this line
    UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)

    return true
}

위의 예에서 내 항목은 흰색입니다. "/255.0"은 0에서 1 사이의 값을 기대하기 때문에 필요합니다. 흰색의 경우 1을 사용했을 수 있습니다. 그러나 다른 색상의 경우 RGB 값을 사용하게됩니다.


3
다른 방법으로는 작동하지 않는 것 같습니다 (더 이상). 작동합니다!
teddy

@Jarrod 나는 거의 1 시간 동안 이것으로 장난하고 있었다. 감사!
랜스 사마리아


18

스위프트 3 | Xcode 10

당신이하려는 경우 모든 탭 표시 줄 항목에 동일한 색상을 (선택 및 선택 해제) ...


1 단계

이미지 자산이 Render As = Template Image 로 설정되어 있는지 확인하십시오 . 이를 통해 색상을 상속받을 수 있습니다.

Xcode 자산


2 단계

스토리 보드 편집기를 사용하여 다음과 같이 탭 표시 줄 설정을 변경하십시오.

  • 탭 막대 : 이미지 색조 를 선택한 아이콘이 상속 할 색상 으로 설정하십시오 .
  • 탭 막대 : 막대 색조탭 막대 의 색상으로 설정하십시오 .
  • 스토리 보드 편집기에서 보려는 색상으로 보기 : 색조 를 설정 하십시오. 이는 앱이 실행될 때 아이콘 색상에 영향을 미치지 않습니다.

Xcode 스토리 보드 편집기


3 단계

1 단계와 2 단계는 선택한 아이콘의 색상을 변경합니다. 선택되지 않은 항목의 색상을 계속 변경하려면 코드에서 변경해야합니다. 스토리 보드 편집기를 통해 할 수있는 방법을 찾지 못했습니다.

커스텀 탭 바 컨트롤러 클래스 만들기 ...

//  TabBarController.swift

class TabBarController: UITabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // make unselected icons white
        self.tabBar.unselectedItemTintColor = UIColor.white
    }
}

... 및 사용자 정의 클래스를 탭 막대 장면 제어기에 지정하십시오.

Xcode 스토리 보드 편집기


스토리 보드 편집기를 통해 선택되지 않은 아이콘 색상을 변경하는 방법을 알고 있다면 알려주십시오. 감사!


self.tabBar.unselectedItemTintColor = UIColor.white self.tabBar.tintColor = #colorLiteral(red: 0.2, green: 0.7333333333, blue: 0.3450980392, alpha: 1) 나를 위해 일해
Wahab Khan Jadon

9

이 코드를 색상을 변경하려는보기 컨트롤러의 viewDidLoad에 넣으십시오.

[[UITabBar appearance] setSelectedImageTintColor:[UIColor whiteColor]];

1
모든 탭을 변경할 방법이 없습니까?
Deekor

모든 탭이로드 된 뷰에 동일한 색상의 코드를 넣으십시오
Nick

UITabController를 만든 직후이 코드를 사용할 수 있으며, 선택시 모든 탭 항목에 대해 언급 한 색상이 설정됩니다.
Jerrin

그러한 메소드는 없습니다 setSelectedImageTintColor
Madhu Avinash

8

키 경로별로 선택한 이미지 막대 색조 색상을 설정할 수도 있습니다.

여기에 이미지 설명을 입력하십시오

희망이 당신을 도울 것입니다! 감사


iOS 9에서는 선택되지 않은 색상을 변경하지 않습니다
Saeed Rahmatolahi

UITabBar 아이콘의 색상을 변경하는 데 어떻게 도움이됩니까?
Madhu Avinash

7

XCode 8.2, iOS 10, Swift 3 :에 대한 unselectedItemTintColor속성이 있습니다 tabBar.

self.tabBar.unselectedItemTintColor = UIColor(red: 0/255.0, green: 200/255.0, blue: 0/255.0, alpha: 1.0)

6

스토리 보드별로 UITabBarItem 색상을 변경할 수 있지만 코드로 색상을 변경하려면 매우 쉽습니다.

// 선택된 막대의 색상을 변경하는 데 사용

   [[UITabBar appearance] setTintColor:[UIColor blueColor]];

// 선택되지 않은 바 변경 (iOS 10)

   [[UITabBar appearance] setUnselectedItemTintColor:[UIColor yellowColor]];

// 모든 tabbar의 색상 변경을위한이 줄

   [[UITabBar appearance] setBarTintColor:[UIColor whiteColor]];

setUnselectedItemTintColor는 iOS 만 10입니다
ondermerol

5

어떻게 든 스토리 보드를 사용하여 탭 막대 선택 항목 색조 색상을 변경할 수 없으므로 ViewDidLoad의 코드 아래에 추가하면 도움이되기를 바랍니다.

[[UITabBar appearance] setTintColor:[UIColor whiteColor]]; 

5

앱 델리게이트에이 코드를 추가하십시오 -did_finish_launching_with_options 함수

UITabBar.appearance().tintColor = UIColor( red: CGFloat(255/255.0), green: CGFloat(99/255.0), blue: CGFloat(95/255.0), alpha: CGFloat(1.0) )

필요한 색상의 RGB를 넣어


4

이것은 iOS 10에서 작동하는 Swift 3의 솔루션입니다.

먼저, 고유 한 탭 막대 컨트롤러 서브 클래스를 작성하여 스토리 보드의 탭 컨트롤러에 추가하십시오. 에서 viewDidLoad()방법 당신은 다음 탭 표시 줄을 사용자 정의 할 수 있습니다. 여기서 tintColor속성은 tabBar선택되지 않은 항목의 색상이 아니라 선택한 항목의 색상을 나타냅니다! 선택하지 않은 항목의 색상을 변경하려면 각 항목을 반복하고 이미지의 원래 색상을 사용하여 회색으로 자동 렌더링되지 않는 것이 좋습니다.

class CustomTabBarVC: UITabBarController
{
    override func viewDidLoad()
    {
        super.viewDidLoad()

        self.tabBar.tintColor = AppColor.normalRed
        self.tabBar.barTintColor = .white
        self.tabBar.isTranslucent = true

        if let items = self.tabBar.items
        {
            for item in items
            {
                if let image = item.image
                {
                    item.image = image.withRenderingMode( .alwaysOriginal )
                }
            }
        }
    }
}

이 방법의 유일한 단점은 항목 이미지에 원하는 색상이 이미 있어야한다는 것입니다.


복잡한. Jarrod의 답변은 모든 아이콘과 잘 작동합니다.
Jose Ramirez

4

이 가장 좋은 방법은 Image Tint스토리 보드 에서 변경하는 것 입니다


2

UITabBarController스토리 보드에서을 서브 클래 싱 하고이를 대체 할 수 있습니다 . 당신에 viewDidLoad서브 클래스의 구현이 전화 :

[self.tabBar setTintColor:[UIColor greenColor]];

'UITabBar' does not have a member named 'setSelectedImageTintColor'
Deekor

내가 넣어 있도록 또한 내가 신속한을 사용하고 있습니다 : self.tabBar.setSelectedImageTintColor = UIColor.greenColor그것은 올바른인지 확실하지 경우
Deekor

2
그것의 @Deekor tintColor하지 selectedImageTintColorBTW, selectedImageTintColor아이폰 OS 8에서 더 이상 사용되지 않습니다
chancyWu
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.