UIPickerView這次想跟螃蟹橫著走

在很久很久以前,我一直以為,會有一種控件可以很直觀地讓用戶橫著選,像這樣

可是翻了翻控件庫,只有UIPickerView可以豎著讓用戶選東西之外,所謂的那個“直觀的控件”根本啥都不是。。。

還是直入主題吧,既然沒有直觀的,彎一彎還是可以實現的。

我們先創建一個工程,進入"ViewController.h"里面:

首先創建一個pickerView,按照常規的路線來設置好各種必要的屬性和代理方法

關于row中要顯示的內容,大部分的時候我們都回用“titleForRow”的方法返回要顯示的內容

先看看現在的運行效果

可以看到pickerView已經在屏幕上顯示出來了,但是仍然不是我們要的橫向滑動,既然要讓滑動的方向改變,那改變pickerView的方向不也是可以嗎。在每個view中,都有一個transform的屬性,叫變換,是圖形位移,旋轉,縮放的統稱

既然我們知道有這個屬性,就可以旋轉pickerView了,畢竟pickerView也是從UIView繼承過來的,在viewDidLoad中添加

這個函數和它的參數會讓pickerView繞中心店逆時針旋轉90度,關于transform和它相關的函數,想了解view的位移,旋轉,縮放的同學可以繼續留意我的簡書哦。回到正題,現在再運行一下

發現橫是橫過來了,還可以橫向滑動,可要顯示的內容卻也橫過來了,沒理由要讓用戶們也橫過頭來看吧。回到“ViewController”里面,方法“titleForRow“發給系統一個string,系統會自動嵌套進pickerView中,才不管用戶看哪個方向呢。那既然系統給我們做的我們不想要,我們就來自定義唄。

在“titleForRow"方法下面一些,還有一個"viewForRow"方法,這個方法返回的view系統就是幫你裝上pickerView中,至于這個view里裝什么,我們就可以自定義了。先把title方法注釋掉,寫上新的方法

接下來就是自定義的部分了

label也是繼承自UIView的,所以不換類型也不會報錯。現在運行看看效果如何

可見,除了字體小了一些,樣式壓根沒有變化,但可別忘記了,我們把pickerView轉了過來,就要再把什么東西轉一遍回來才行啊,剛剛我們返回給系統的是一個string我們沒有辦法旋轉,但這label就不同了,我們可以添加下面的代碼讓label再順時針90度轉回來

運行

可以看到,整個pickerView橫了過來,要顯示的內容貌似沒有動過,這不正是我們想要的效果了嗎,可是如果內容再長一點的話

由于剛才設置了自動縮放字體大小,因為系統給的默認空間不變,所以系統只能縮小字體來適配了,別擔心,還有方法

在協議中還有兩個可以調整內容尺寸的方法,這時候我們就可以自定義row的寬高了

要注意的是,pickerView旋轉后,我們看到的高其實是系統里的寬,看到的寬就是系統里的高,所以一般height要設置得比width大一些

現在再運行,就perfect啦!

另外如果想要把分割線去掉的話,可以用刪除subview的方法。但需要注意的是,日期選擇器的分割線可以一alloc和init完就刪除,但pickerView的分隔線就在代理方法執行的過程創建,所以最快就是在那個時候刪除。

全文 完。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,353評論 25 708
  • 廢話不多說,直接上干貨 ---------------------------------------------...
    小小趙紙農閱讀 3,436評論 0 15
  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,948評論 18 139
  • 最近忙得焦頭爛額,很多事情都堆積在一起,真的是不怕事來,就怕事一起來。 以前自己的性格就是,有事干就踏踏實實的干,...
    微米蛋殼閱讀 654評論 1 1
  • 束手無力,靜靜等待著結局的到來。可能是自己還是不能堅持,自己如此失敗 ,我很想像不會游泳的人掉入了大海,無...
    西瓜布帶閱讀 230評論 0 0