Установите цвет фона активного элемента вкладки в Swift

Я надеюсь сделать это без использования изображений, если это вообще возможно. Есть ли способ создать эффект, показанный на изображении, программно, без необходимости отображать каждую вкладку как изображение?

Каждый вопрос, который я просмотрел на SO, имеет вкладки, сохраненные как JPG, что больше работает, чем я считаю.

Любые идеи?

Ответы

Ответ 1

Я применил аналогичный подход к @matcartmill, но без специального изображения. Это решение основано только на вашем цвете.

// 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.redColor(), size: tabBarItemSize).resizableImageWithCapInsets(UIEdgeInsetsZero)

// remove default border
tabBar.frame.size.width = self.view.frame.width + 4
tabBar.frame.origin.x = -2

Я использую следующее расширение UIImage:

extension UIImage {

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

}

Надеюсь, это поможет!

Ответ 2

Обновить до SWIFT 3:

let numberOfItems = CGFloat((tabBarController?.tabBar.items!.count)!)

let tabBarItemSize = CGSize(width: (tabBarController?.tabBar.frame.width)! / numberOfItems,
                            height: (tabBarController?.tabBar.frame.height)!)

tabBarController?.tabBar.selectionIndicatorImage
    = UIImage.imageWithColor(color: UIColor.black,
                             size: tabBarItemSize).resizableImage(withCapInsets: .zero)

tabBarController?.tabBar.frame.size.width = self.view.frame.width + 4
tabBarController?.tabBar.frame.origin.x = -2

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

Ответ 3

Итак, вот что я сделал. Это сочетание использования 640x49 PNG, что цвет синего "выделенного" фона мне нужен.

В AppDelegate.swift:

var selectedBG = UIImage(named:"tab-selected-full")?.resizableImageWithCapInsets(UIEdgeInsetsMake(0, 0, 0, 0))
UITabBar.appearance().selectionIndicatorImage = selectedBG

И затем в первом контроллере просмотра, который загружается, у меня есть:

tabBarController?.tabBar.frame.size.width = self.view.frame.width+4
tabBarController?.tabBar.frame.origin.x = -2

Причиной для этих двух строк является то, что по умолчанию у Apple есть граница 2px между левой и правой сторонами панели вкладок и элементами панели вкладок.

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