iOS自定義UITabBar仿今日頭條效果
動(dòng)機(jī)
關(guān)于自定義 TabBar,早就有過很多討論,開源網(wǎng)站上也有很多造好的輪子,多半是純代碼實(shí)現(xiàn)有個(gè)性的 TabBar,當(dāng)然我們可以很方便的使用它。周末閑著沒事干,自己也寫了一下,模仿今日頭條的 TabBar 效果,實(shí)現(xiàn)方式是Storyboard + 代碼。
效果圖

實(shí)現(xiàn)步驟在 Storyborad 上搭建項(xiàng)目基礎(chǔ)結(jié)構(gòu)

在界面上設(shè)置每個(gè) TabBarItem 的相關(guān)屬性

需要自定義的 item 不需要在界面上設(shè)置。
自定義 UITabBarViewController
目的
替換默認(rèn)的 UITabBar
處理 發(fā)布按鈕(中間那個(gè)加號(hào)按鈕)點(diǎn)擊事件
主要代碼
替換 UITabBar,監(jiān)聽點(diǎn)擊事件
override func viewDidLoad() {
super.viewDidLoad()
// 替換 tabbar
let _tabBar = TabBar()
// 監(jiān)聽按鈕點(diǎn)擊事件
_tabBar.handleBtnReleaseClick(self, action: #selector(btnReleaseClick))
setValue(_tabBar, forKey: "tabBar")
}
自定義 UITabBar
目的
自定義 UITabBar,替換掉 Storyboard 上默認(rèn)生成的 TabBarItem
處理 發(fā)布按鈕(中間那個(gè)加號(hào)按鈕)點(diǎn)擊事件
主要代碼
刪除占位“按鈕”,添加自定義按鈕
// MARK: 刪除占位“按鈕”,添加自定義按鈕
override func layoutSubviews() {
super.layoutSubviews()
btnRelease.backgroundColor = UIColor.white
// 過濾掉 _UIBarBackground 類型的對(duì)象,只保留 UITabBarButton 類型的對(duì)象
let tabbarButtonList = iews.filter{NSStringFromClass(type(of: $0)) == abBarButton"}
// 取出需要?jiǎng)h除的“按鈕”(經(jīng)測(cè)試,知道中間那個(gè)加號(hào)按鈕的下標(biāo)是2)
let tmpView = tabbarButtonList[safe: 2]
// 把默認(rèn)生成的從父容器中移除
tmpView?.removeFromSuperview()
let x = (InnerConst.ScreenW - btnRelease.w) * 0.5
let y = InnerConst.ButtonOffsetY
btnRelease.origin = CGPoint(x: x, y: y)
addSubview(btnRelease)
}
處理默認(rèn)情況下,按鈕超出 TabBar 以外區(qū)域不能點(diǎn)擊問題
// MARK: 處理默認(rèn)情況下,按鈕超出 TabBar 以外區(qū)域不能點(diǎn)擊問題
override func hitTest(_ point: CGPoint, with event: UIEvent?) -View? {
if isHidden == false {
let newPoint = convert(point, to: btnRelease)
if btnRelease.point(inside: newPoint, with: event) {
return btnRelease
}
return super.hitTest(point, with: event)
}
return super.hitTest(point, with: event)
}
按鈕點(diǎn)擊事件委托給調(diào)用方
func handleBtnReleaseClick(_ target: AnyObject?, action: Selector) {
btnRelease.addTarget(target, action: action, for: .touchUpInside)
}
代碼寫到這里,一個(gè)類似于今日頭條的 UITabBar(主要是中間那個(gè)按鈕)差不多造出來(lái)了。以上部分貼出來(lái)的是個(gè)人認(rèn)為比較關(guān)鍵的代碼,有問題可以討論,目的是用最簡(jiǎn)單的方式、最少的代碼實(shí)現(xiàn)需求。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
ios實(shí)現(xiàn)簡(jiǎn)單隨便移動(dòng)的AR功能
這篇文章主要為大家詳細(xì)介紹了ios實(shí)現(xiàn)簡(jiǎn)單隨便走的AR功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-02-02
解析iOS開發(fā)中的FirstResponder第一響應(yīng)對(duì)象
這篇文章主要介紹了解析iOS開發(fā)中的FirstResponder第一響應(yīng)對(duì)象,包括View的FirstResponder的釋放問題,需要的朋友可以參考下2015-10-10
IOS 實(shí)現(xiàn)微信自動(dòng)搶紅包(非越獄IPhone)
這篇文章主要介紹了IOS 實(shí)現(xiàn)微信自動(dòng)搶紅包(非越獄IPhone)的相關(guān)資料,這里對(duì)實(shí)現(xiàn)自動(dòng)搶紅包做一個(gè)詳細(xì)的實(shí)現(xiàn)步驟,需要的朋友可以參考下2016-11-11
iOS開發(fā)中ViewController的頁(yè)面跳轉(zhuǎn)和彈出模態(tài)
這篇文章主要介紹了iOS開發(fā)中ViewController的頁(yè)面跳轉(zhuǎn)和彈出模態(tài),ViewController是MVC開發(fā)模式中一個(gè)重要的類,需要的朋友可以參考下2015-10-10
IOS 開發(fā)之網(wǎng)絡(luò)圖片輪播圖的實(shí)現(xiàn)
這篇文章主要介紹了IOS 開發(fā)之網(wǎng)絡(luò)圖片輪播圖的實(shí)現(xiàn)的相關(guān)資料,希望通過此文大家能夠掌握輪播圖的實(shí)現(xiàn),需要的朋友可以參考下2017-09-09
iOS Crash常規(guī)跟蹤方法及Bugly集成運(yùn)用詳細(xì)介紹
這篇文章主要介紹了iOS Crash常規(guī)跟蹤方法及Bugly集成運(yùn)用詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2016-10-10
iOS 數(shù)據(jù)結(jié)構(gòu)之?dāng)?shù)組的操作方法
這篇文章主要介紹了iOS 數(shù)據(jù)結(jié)構(gòu)之?dāng)?shù)組的操作方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2018-07-07
iOS學(xué)習(xí)教程之UIView中坐標(biāo)轉(zhuǎn)換詳解
這篇文章主要給大家介紹了關(guān)于iOS UIView中坐標(biāo)轉(zhuǎn)換的相關(guān)資料,文中介紹的非常詳細(xì),對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)跟著小編一起看看吧。2017-05-05

