Suche…


Erstellen Sie eine Instanz

Eine 'Tab-Leiste' ist in den meisten iOS-Apps zu finden und wird verwendet, um verschiedene Ansichten auf jeder Registerkarte anzuzeigen.

Ziehen Sie zum Erstellen eines Registerkarten-Controllers mit dem Schnittstellen-Generator einen Registerkarten-Controller aus der Objektbibliothek in die Leinwand.

Tab-Leiste Controller

Standardmäßig verfügt ein Registerkarten-Controller über zwei Ansichten. Wenn Sie weitere Ansichten hinzufügen möchten, ziehen Sie das Steuerelement aus der Registerkartenleiste in die neue Ansicht und wählen Sie im Dropdown-Menü die Option "Ansichtssteuerungen".

Tab-Leiste mit Ansichten

Ändern des Titeltitels und Symbols der Tab-Leiste

Verwenden des Storyboards:

Wählen Sie im entsprechenden View-Controller das Element der Registerkartenleiste aus, und wechseln Sie zum Attribut-Inspector

Wenn Sie ein integriertes Symbol und einen integrierten Titel haben möchten, setzen Sie das 'System Item' auf den entsprechenden Wert.

Fügen Sie für ein benutzerdefiniertes Symbol die erforderlichen Bilder zum Ordner "Assets" hinzu, und setzen Sie das "Systemelement" von früher auf "Benutzerdefiniert".

Legen Sie nun fest, dass das Symbol angezeigt wird, wenn die Registerkarte aus dem Dropdown-Menü "Ausgewähltes Bild" und das Standard-Registersymbol aus dem Dropdown-Menü "Bild" ausgewählt wird. Fügen Sie den entsprechenden Titel in das Feld "Titel" ein.

Inspektor für Elementeigenschaften der Registerkartenleiste

Programmatisch:

viewDidLoad() in der viewDidLoad() Methode des View-Controllers den folgenden Code hinzu:

Ziel c:

self.title = @"item";

self.tabBarItem.image = [UIImage imageNamed:@"item"];
self.tabBarItem.selectedImage = [UIImage imageNamed:@"item_selected"];

Schnell:

self.title = "item"
self.tabBarItem.image = UIImage(named: "item")
self.tabBarItem.selectedImage = UIImage(named: "item_selected")

Der Navigations-Controller kann mithilfe des Storyboards in jede Registerkarte eingebettet werden. Es kann wie im Screenshot hinzugefügt werden.

Um einem View Controller, der eine Verbindung mit dem Registerkarten-Controller herstellt, einen Navigations-Controller hinzuzufügen, folgen Sie den Anweisungen

  • Wählen Sie den Ansichtscontroller aus, für den Sie den Navigationscontroller hinzufügen müssen. Hier sei es der Search View Controller als Auswahlanzeige.
  • Wählen Sie im Editor- Menü des Xcodes die Option Einbetten in -> Navigations-Controller

Geben Sie hier die Bildbeschreibung ein

Farbe der Tab-Leistenfarbe

[[UITabBar appearance] setTintColor:[UIColor whiteColor]];
[[UITabBar appearance] setBarTintColor:[UIColor tabBarBackgroundColor]];
[[UITabBar appearance] setBackgroundColor:[UIColor tabBarInactiveColor]];
[[UINavigationBar appearance] setBarTintColor:[UIColor appBlueColor]];
[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]];
[[UINavigationBar appearance] setBarStyle:UIBarStyleBlack];

UITabBarController mit benutzerdefinierter Farbauswahl

UITabBarController in Swift 3 erstellen Swift 3 Ändern Sie die Bildfarbe und den Titel entsprechend der Auswahl, indem Sie die Farbe der ausgewählten Registerkarten ändern.

import UIKit

class TabbarController: UITabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()

        self.navigationController?.isNavigationBarHidden = true
        
        UITabBar.appearance().tintColor = UIColor.purple
        
        // set red as selected background color
        let numberOfItems = CGFloat(tabBar.items!.count)
        let tabBarItemSize = CGSize(width: tabBar.frame.width / numberOfItems, height: tabBar.frame.height)
        tabBar.selectionIndicatorImage = UIImage.imageWithColor(UIColor.lightText.withAlphaComponent(0.5), size: tabBarItemSize).resizableImage(withCapInsets: UIEdgeInsets.zero)
        
        // remove default border
        tabBar.frame.size.width = self.view.frame.width + 4
        tabBar.frame.origin.x = -2
        
    }
    
    override func viewWillAppear(_ animated: Bool) {
        // For Images
        let firstViewController:UIViewController = NotificationVC()
        // The following statement is what you need
        let customTabBarItem:UITabBarItem = UITabBarItem(title: nil, image: UIImage(named: "notification@2x")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal), selectedImage: UIImage(named: "notification_sel@2x"))
        firstViewController.tabBarItem = customTabBarItem
        
        for item in self.tabBar.items! {
            let unselectedItem = [NSForegroundColorAttributeName: UIColor.white]
            let selectedItem = [NSForegroundColorAttributeName: UIColor.purple]
            
            item.setTitleTextAttributes(unselectedItem, for: .normal)
            item.setTitleTextAttributes(selectedItem, for: .selected)
        }
    }

}


extension UIImage {
    class func imageWithColor(_ color: UIColor, size: CGSize) -> UIImage {
        let rect: CGRect = CGRect(origin: CGPoint(x: 0,y :0), size: CGSize(width: size.width, height: size.height))
        UIGraphicsBeginImageContextWithOptions(size, false, 0)
        color.setFill()
        UIRectFill(rect)
        let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
        UIGraphicsEndImageContext()
        return image
    }
    
}

Bild für die Tab-Leiste auswählen und hier den Tab-Titel einstellen

benutzerdefinierte Registerkarte erstellen

Auswahl der Registerkarte

Auswahl einer anderen Registerkarte

Geben Sie hier die Bildbeschreibung ein

Erstellen Sie programmgesteuert einen Tab-Leisten-Controller ohne Storyboard

class AppDelegate: UIResponder, UIApplicationDelegate {

    var window: UIWindow?
    
    var firstTabNavigationController : UINavigationController!
    var secondTabNavigationControoller : UINavigationController!
    var thirdTabNavigationController : UINavigationController!
    var fourthTabNavigationControoller : UINavigationController!
    var fifthTabNavigationController : UINavigationController!
    


    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
        // Override point for customization after application launch.
        Fabric.with([Crashlytics.self])
        
       window = UIWindow(frame: UIScreen.main.bounds)
        
        
        window?.backgroundColor = UIColor.black
            
        
        let tabBarController = UITabBarController()
        
        firstTabNavigationController = UINavigationController.init(rootViewController: FirstViewController())
        secondTabNavigationControoller = UINavigationController.init(rootViewController: SecondViewController())
        thirdTabNavigationController = UINavigationController.init(rootViewController: ThirdViewController())
        fourthTabNavigationControoller = UINavigationController.init(rootViewController: FourthViewController())
        fifthTabNavigationController = UINavigationController.init(rootViewController: FifthViewController())
        
        tabBarController.viewControllers = [firstTabNavigationController, secondTabNavigationControoller, thirdTabNavigationController, fourthTabNavigationControoller, fifthTabNavigationController]
        
        
        let item1 = UITabBarItem(title: "Home", image: UIImage(named: "ico-home"), tag: 0)
        let item2 = UITabBarItem(title: "Contest", image:  UIImage(named: "ico-contest"), tag: 1)
        let item3 = UITabBarItem(title: "Post a Picture", image:  UIImage(named: "ico-photo"), tag: 2)
        let item4 = UITabBarItem(title: "Prizes", image:  UIImage(named: "ico-prizes"), tag: 3)
        let item5 = UITabBarItem(title: "Profile", image:  UIImage(named: "ico-profile"), tag: 4)

        firstTabNavigationController.tabBarItem = item1
        secondTabNavigationControoller.tabBarItem = item2
        thirdTabNavigationController.tabBarItem = item3
        fourthTabNavigationControoller.tabBarItem = item4
        fifthTabNavigationController.tabBarItem = item5
                
        UITabBar.appearance().tintColor = UIColor(red: 0/255.0, green: 146/255.0, blue: 248/255.0, alpha: 1.0)
        
        self.window?.rootViewController = tabBarController
        
        window?.makeKeyAndVisible()

        return true
    }


Modified text is an extract of the original Stack Overflow Documentation
Lizenziert unter CC BY-SA 3.0
Nicht angeschlossen an Stack Overflow