Swift — 客製化 TabBar( Customized TabBar)
在你的 TabBar 中加入一個客製化的按鈕。
前言:
最近因為有遇到需要在 TabBar 上加入一個客製化的按鈕,類似上圖這樣,必須要客製化一個超出 TabBar 範圍的按鈕,讓使用者點選,這次的教學就來客製化我們的 TabBar 中的 TabBar Item。
事前配置:
首先我們先新增一個 TabBarController,並且新增一個 viewController 加到其中,並且新增
因為我們這次是要客製化 TabBarController,所以其他 ViewController 的文件可以不需要新建,但是我們需要建立一個 TabBarController 文件來進行這次的客製化。
建立好 TabBarController 文件之後我們就能一步一步來進行我們的客製化動作了。
實作:
首先我們會客製化我們的按鈕,這邊我的設置按鈕的程式碼如下:
接著我們需要新增一個點選按鈕後執行的方法:
接著我們需要判斷它是不是在我們這個頁面上,所以會加上一個 UITabBarDelegate 的 didSelect 方法,判斷目前點選的 item 是哪個:
現在來測試一下我們做到目前的結果:
細節修正:
做到這邊並還沒有整個完成,你應該會發現超過 tabBar 範圍部分的按鈕按了是沒有反應的,所以我們必須判斷目前點選的位置是不是在這個客製化按鈕上。所以我們會 override touchesBegan 這個方法:
如此一來我們點擊按鈕上方也能夠是有效果的:
後記:
這次的客製化 TabBar 文章也參考了許多客製化的教學及方法,只是到後面還是使用自己最熟悉的方法,客製化後總會發生意料之外的事情,所以客製化之後必須測試有沒有什麼意料外 bug 出現,並且找方法來修正它。
附上這次客製化 TabBar 的 Github 連結,感謝收看: