自定義的iOS的滾輪選擇器,附帶農曆選擇器實現

2021-06-06 23:25:51 字數 1611 閱讀 6251

本人由論壇會員beanwolf分享

這個控制項並不是對ios自帶的uipickerview貼圖,而是重新實現,我一周多的成果,期間走了不少彎路。哈!

此控制項開發的原因:

最近公司有個需求,需要做乙個農曆的日期滾輪選擇器,一開始想用ios自帶的uipickerview,但是

設計人員要求的比較高,必須實現她要求的樣式,也就是上圖中大家看到的樣式。但是uipickerview根本沒有提供可以定製樣式(也就是更換**)的介面。首先我在論壇上找到了

帖子,按照這位兄台所述,確實可以在一定程度上修改uipickerview的

,我之所以說一定程度上,有以下幾個原因:

(1.)他是用覆蓋原有的uipickerview上的各個子檢視上的方法做的,那麼你提供新的就必須與原嚴絲合縫。這也說明,即便是換了,樣式也是不能換的,譬如:分割線的粗細、上下左右的邊框的大小等,也就是不能完全diy,不能滿足我的需求。

(2.)由於覆蓋uipickerview上的各個子檢視上的做法不是

蘋果官方給出的,一旦以後某個版本的uipickerview實現策略改變,例如:3號子檢視不再是滾輪的背景,你的做法就掛了。

於是我就實現了上圖中的滾輪選擇器,它與uipickerview的區別是:

(1.)**提供了方法可以做替換的。

(2.)可以選擇滾輪上的資料是否迴圈滾動。

(3.)可以指定選擇條的位置。

為了**

的復用,也就是所謂的oop,我按照以下的方式實現:

(1.)pickerview目錄:這個目錄中的idjpickerview.h是滾輪選擇器檢視,沒有任何和與資料相關的東西,也就是你可以在idjpickerview上

顯示任何資料。idjpickerview通過委託獲取需要顯示的資料。這個目錄下的idjscrollcomponent.h實現了uiscrollview上的內容可以反覆迴圈滾動的功能。

(2.)datepicker目錄:idjdatepickerview.h實現了idjpickerview裡的協議,並把idjpickerview做為自己的乙個私有成員,實現了乙個可以根據type欄位顯示公曆、農曆的日期選擇器,idjdatepickerview.m裡的農曆演算法用的是solar_chinese_calendar目錄中的c++演算法,因此農曆的相關資料類

使用了c++混編的**。其實ios自己支援農曆的,但是存在bug,具體的原因大家可以看我的idjchinesecalendar.mm的原始碼,裡面的注釋比較詳細的。我在這裡也使用了一層封裝,也就是idjdatepickerview.m本身也不提供資料,而是通過idjcalendar.h、idjchinesecalendar.h、idjcalendarutil.h來提供,這樣既實現了資料與檢視的分離(因為農曆演算法太複雜了,直接寫在idjdatepickerview.m裡會使得**看起來可讀性太差了),而且把c++的呼叫封裝在了資料層,使得idjdatepickerview.m的檢視層**不會出現c++的api。

(3.)timepicker目錄:這個目錄純粹是乙個demo,展示了乙個不迴圈滾動、顯示行數與選中條位置不對稱的選擇器,沒有什麼實際的含義。

一開始我是純粹寫農曆的選擇器,**都是耦合在一起的,後來逐個拆開的,這樣**就可以復用了,不僅僅是農曆選擇器,而是可以承載任何資料。

原始碼:djdatepickerview.zip

jQuery自定義選擇器

1.自定義選擇器 自定義選擇器不能使用速度最快的原生態選擇器了。因此盡量不要使用。1 even 結果集中其索引為偶數的元素 0,2,4.2 odd 結果集中其索引為奇數的元素 1,3,5.注意 經常使用 tr odd 或者 tr nth child 實現table隔行,但是當頁面中含有不只乙個tab...

vue 仿IOS 滾輪選擇器

先來個截圖 先來屢一下需求 1.移動端使用者手上下滑動,內容上下移動,使用者手離開數字按照慣性移動一段距離。2.當停止移動後,選中乙個文字並且文字高亮,上面的值會變成你選中的文字。3.可以連續滾動。說起滾動,不得不提css3的transform style preserve 3d 和backface...

Android 自定義時間選擇器

效果同樣是來自網上大神的demo,跟著大神的腳步,總有一天我們也會成為大神。先看效果 效果自認為一般,但是讓我自己寫,肯定是需要很久。關鍵點 ok,簡單看下 一 datetimepickdialogutil類就是我們自定義的時間控制項,用dialog的形式展示 common datetime布局檔案...