最近有乙個需求，類似今日頭條頂部的選單欄。唯一區別是需要帶可移動的下劃線。網上查詢資料，發現解決方案大部分是用uiscrollview實現。下方vc控制用uicollectionview。這樣可以解決問題，但是不完美，當標籤很多的時候，這時候的uiscrollview上會有大量寫死的button,沒有達到復用的目的。所以自己封裝了乙個空間。選單欄使用uicollectionview,vc控制使用pageviewcontroller。
這樣做的目的是為了完全復用，支援無限擴充套件。因為選單欄是collectionview，所以不怕記憶體爆掉。vc的控制使用pageviewcontroller，好處是滑動的時候可以懶載入，只有使用者瀏覽的時候才會例項化並快取起來。網上的其他方案都是一次性把所有vc都例項化，然後使用collectionview管理，這是不好的，因為有些vc使用者可能從來不瀏覽，沒必要例項化。
接下來就詳細介紹一下。
選單欄需要把所選的一欄居中顯示
使用scrollview，需要手動計算，設定offset，讓其被選欄居中，比較麻煩。如果使用collectionview，collectionview有乙個方法：
open func scrolltoitem(at indexpath: indexpath, at scrollposition: uicollectionview.scrollposition, animated: bool)
只要將scrollposition設定為.centeredhorizontally，即可實現該功能
左右滑動的時候，可以切換所選選單，且下方橫線需要跟著動
使用scrollview的話就比較方便了，計算滑動距離和螢幕寬的比例，讓下劃線跟著滑即可。但是使用collectionview的話，滑完之後會自動居中顯示被選選單。位置就會出錯。解決方案就是讓下劃線跟著被選選單cell的位置。
在collectionview中，滑動cell的時候其實只是offset在變，cell的frame其實是不變的，collectionview其實也是個scrollview，cell是加在scrollview的contentview上的。在這裡卡殼了好久。解決方案是，將cell的座標轉化到collectionview上，然後讓下劃線的中心點和cell在collectionview上中心點保持一致
if let currentcell = collectionview.cellforitem(at: indexpath(row: currentindex, section: 0))
pageviewcontroller沒有scrollview的delegate，滑動的時候，不知道滑動的情況。
可以使用乙個暗黑技巧：
for subview in pageviewcontroller.view.subviews}
然後再scrollviewdidscroll方法中操作
public func scrollviewdidscroll(_ scrollview: uiscrollview)var progress:cgfloat = 0
var nextindex = 0
let screenwidth = uiscreen.main.bounds.width
let count = items.count
//判斷是左移還是右移
if uiscreen.main.bounds.width > scrollview.contentoffset.x
//計算progress
progress = (screenwidth - scrollview.contentoffset.x)/screenwidth
}if uiscreen.main.bounds.width < scrollview.contentoffset.x
progress = (scrollview.contentoffset.x - screenwidth)/screenwidth
}if progress != 0.0
}
風格控制類segmenttopbarstyle
資料來源[segmentitem]
自定義vc必須實現childviewcontrollerprotocol協議，協議中初始化方法可以按需修改，增加引數。初始化方法修改後記得在scrollpageview中修改自定義vc的初始化。
scrollpageview中使用了segmenttopbarview，所以你也可以單獨使用segmenttopbarview
override func viewdidload()func datasource() -> [segmentitem]
return arr
}
demo:
模擬今日頭條頂部導航選單
完成之後的效果圖就是這樣的，在首頁頁面裡，點選上面的選單欄，下面的內容會根據上面而變化，在下面的內容部分，因為內容多少不確定，設定成了可以滾動的。因此，為了實現上面的效果，我們需要用到view元件 swiper元件和scroll view元件。在小程式開發文件中，將view稱為檢視容器，通過設定vi...
高仿網易新聞頂部滑動條效果
這個是網易新聞的主介面，我們知道底部可以用tabhost實現，這個很容易，我們在其他軟體中也會經常用到。至於頂部的滑動條，個人感覺還是比較漂亮的所以今天也模仿了下，網易頂部滑動條的效果，由於初次模仿這種效果，可能有些地方還不夠完美，不過基本已經實現，希望大家能夠喜歡。廢話不多說，下面上 首先是布局l...
python選單類 python多級選單
該樓層疑似違規已被系統摺疊 隱藏此樓檢視此樓 dic china 直轄市 北京市 東城區 西城區 崇文區 宣武區 朝陽區 海淀區 豐台區 石景山區 門頭溝區 房山區 通州區 順義區 昌平區 大興區 懷柔區 平谷區 延慶縣 密雲縣 省 浙江省 杭州市 拱墅區 上城區 下城區 江乾區 西湖區 濱江區 蕭...