Dodaj linię jako wskaźnik wyboru do elementu UITabbarItem w Swift

Question

Chcę użyć grubej linii na dole elementu UITabbarItems jako wskaźnika wyboru. Z uwagi na to, że aplikacja musi działać na różnych rozmiarach telefonów, nie mogę użyć obrazu jako wskaźnika wyboru. Dlatego myślę, że muszę użyć Swift, aby to zrobić. (Linia musi mieć 1/3 szerokości strony).

Próbowałem użyć UITabBarItem.appearance(), ale bez powodzenia.

Answer 1

Rozwiązałem mój problem.

Funkcje tego kodu maleńkim fragmencie:

• szerokość jest dynamiczna
• jest animowana

• jest dużo bardziej konfigurowalny dla przyszłych funkcji

  class FirstViewController: UIViewController { 
  
  let rectShape = CAShapeLayer() 
  let indicatorHeight: CGFloat = 5 
  var indicatorWidth: CGFloat! 
  let indicatorBottomMargin: CGFloat = 2 
  let indicatorLeftMargin: CGFloat = 2 
  
  override func viewDidLoad() { 
      super.viewDidLoad() 
  
      // setup tabbar indicator 
      rectShape.fillColor = UIColor.redColor().CGColor 
      indicatorWidth = view.bounds.maxX/2 // count of items 
      self.tabBarController!.view.layer.addSublayer(rectShape) 
      self.tabBarController?.delegate = self 
  
      // initial position 
      updateTabbarIndicatorBySelectedTabIndex(0) 
  } 
  
  func updateTabbarIndicatorBySelectedTabIndex(index: Int) -> Void 
  { 
      let updatedBounds = CGRect(x: CGFloat(index) * (indicatorWidth + indicatorLeftMargin), 
             y: view.bounds.maxY - indicatorHeight, 
             width: indicatorWidth - indicatorLeftMargin, 
             height: indicatorHeight) 
  
      let path = CGPathCreateMutable() 
      CGPathAddRect(path, nil, updatedBounds) 
      rectShape.path = path 
  } 
  } 
  
  extension FirstViewController: UITabBarControllerDelegate { 
  
  func tabBarController(tabBarController: UITabBarController, didSelectViewController viewController: UIViewController) { 
      updateTabbarIndicatorBySelectedTabIndex(tabBarController.selectedIndex) 
  } 
  } 
  

Answer 2

Możesz to zrobić, dodając niestandardowy obraz, który zostanie utworzony w kodzie, do selectionIndicatorImage na twoim obiekcie UITabBar. Na przykład można utworzyć extension dla UIImage klasa tak:

extension UIImage { 
    func createSelectionIndicator(color: UIColor, size: CGSize, lineWidth: CGFloat) -> UIImage { 
     UIGraphicsBeginImageContextWithOptions(size, false, 0) 
     color.setFill() 
     UIRectFill(CGRectMake(0, size.height - lineWidth, size.width, lineWidth)) 
     let image = UIGraphicsGetImageFromCurrentImageContext() 
     UIGraphicsEndImageContext() 
     return image 
    } 
} 

i nazywają to w pierwszym załadowaniu ViewController takiego:

class FirstViewController: UIViewController { 

    override func viewDidLoad() { 
     super.viewDidLoad() 

     let tabBar = self.tabBarController!.tabBar 
     tabBar.selectionIndicatorImage = UIImage().createSelectionIndicator(UIColor.blueColor(), size: CGSizeMake(tabBar.frame.width/CGFloat(tabBar.items!.count), tabBar.frame.height), lineWidth: 2.0) 
    } 

    override func didReceiveMemoryWarning() { 
     super.didReceiveMemoryWarning() 
     // Dispose of any resources that can be recreated. 
    } 
} 

W tym przypadku wynik będzie tak:

Answer 3

Swift 3:

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

override func viewDidLoad() { 
    super.viewDidLoad() 
    let tabBar = self.tabBarController!.tabBar 
    tabBar.selectionIndicatorImage = UIImage().createSelectionIndicator(color: UIColor.blue, size: CGSize(width: tabBar.frame.width/CGFloat(tabBar.items!.count), height: tabBar.frame.height), lineWidth: 2.0) 
}