Swift-自定義UITabBarController原理實現
如何實現UITabBarController的自定義效果,首先要明白自定義和封裝程式碼的原理,才能去實現它。下面這段程式碼是我自定義UITabBarController時的實現方法
1.建立MyTabBarController繼承自UITabBarController
import UIKit
class MyTabBarController: UITabBarController {
overridefunc didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
}
2.自定義一個
var myTabBarView : UIView?
3.在viewDidLoad()方中初始化myTabBarView,並在myTabBarView上新增三個按鈕(UIButton)
overridefunc viewDidLoad() {
super.viewDidLoad()
//btnW是每個按鈕的寬度,我在這裡把螢幕的寬度進行了3等分
let btnW: CGFloat = self.view.frame.size.width/3
//對myTabBarView進行初始化,高度是系統自帶的tabBar的高度
self.myTabBarView = ({
let
myView.backgroundColor = UIColor.blueColor()
return myView
})()
//把自定義的標籤欄myTabBarView新增到self.view上
self.view
//標籤欄上三個按鈕的名字
let namesArray = ["精彩生活","學習工作","休閒娛樂"]
//2.建立按鈕(for i in 10...12表示 i >= 10 && i <= 12 ,還可以用for i in 10..<13)
for i in10...12 {
//例項化按鈕button
let btn = UIButton(frame:CGRectMake(btnW*CGFloat(i-10), 0, btnW, self.tabBar.frame.size.height))
//按鈕的顏色設定為白色
btn.backgroundColor = UIColor.whiteColor()
//建立Imageview用來新增圖片
let imageView = UIImageView(frame:CGRectMake((btn.frame.size.width-25)/2, 5, 25, 25))
//新增圖片
imageView.image = UIImage(named: "n"+"\(i-10)")
//把imageView新增到按鈕上
btn.addSubview(imageView)
//imageView的tag值
imageView.tag = i+10
//建立標籤用來展示按鈕的名字
let titleLabel = UILabel(frame:CGRectMake(0, CGRectGetMaxY(imageView.frame), btn.frame.size.width,btn.frame.size.height-CGRectGetMaxY(imageView.frame)))
//文字居中對齊
titleLabel.textAlignment = NSTextAlignment.Center
//標籤的背景色設定為白色
titleLabel.backgroundColor = UIColor.whiteColor()
//標籤的文字
titleLabel.text = namesArray[i-10]
//文字的顏色
titleLabel.textColor = UIColor.lightGrayColor()
//文字的字型大小
titleLabel.font = UIFont.systemFontOfSize(13)
//把標籤新增到按鈕上
btn.addSubview(titleLabel)
//標籤的tag值
titleLabel.tag = i+20
//給button新增帶參的點選事件
btn.addTarget(self, action: #selector(action_BtnClick(_:)), forControlEvents: UIControlEvents.TouchUpInside)
//按鈕的tag值
btn.tag = i
//預設第一個按鈕被選中
if i == 10 {
//改變按鈕的圖片
imageView.image = UIImage(named: "s0")
//改變按鈕的文字的顏色
titleLabel.textColor = UIColor.purpleColor()
}
//把自定義的按鈕新增到自定義的標籤欄(myTabBarView)上
self.myTabBarView!.addSubview(btn)
}
setNavs()
}
4.設定導航
func setNavs(){
//初始化所有的controllers
let firstV = FirstViewController()
let twoV = TwoViewController()
let threeV = ThreeViewController()
//把controller 用陣列裝起來
let cvArray = [firstV,twoV,threeV]
//組裝 title 陣列
let titlesArray = ["精彩生活","學習工作","休閒娛樂"]
// viewController 的根檢視為 UINavagationViewController
var navs = [UINavigationController]()
for (idx, vc) in cvArray.enumerate() {
vc.title = titlesArray[idx]
vc.view.backgroundColor = UIColor.init(white: 0.90, alpha: 1)
vc.automaticallyAdjustsScrollViewInsets = false
let nav = UINavigationController(rootViewController:vc)
nav.navigationBar.barTintColor = UIColor.purpleColor()
nav.navigationBar.tintColor = UIColor.purpleColor()
nav.navigationBar.backgroundColor = UIColor.purpleColor()
nav.navigationBar.titleTextAttributes = [NSFontAttributeName:UIFont.boldSystemFontOfSize(17),NSForegroundColorAttributeName:UIColor.whiteColor()]
navs.append(nav)
}
//設定索引檢視
self.viewControllers = navs
self.selectedIndex = 0
}
5.按鈕點選事件事件
func action_BtnClick(sender:UIButton){
//改變被選擇的index
self.selectedIndex = sender.tag - 10
//改變 button 的背景
for i in10...12 {
let imageV:UIImageView = self.myTabBarView!.viewWithTag(i+10) as! UIImageView
let titleL:UILabel = self.myTabBarView!.viewWithTag(i+20) as! UILabel
if i == sender.tag {
imageV.image = UIImage(named: "s"+"\(i-10)")
titleL.textColor = UIColor.purpleColor()
}else{
imageV.image = UIImage(named: "n"+"\(i-10)")
titleL.textColor = UIColor.lightGrayColor()
}
}
}