介紹:
- 這是以
雪球APP
為原型大诸,基于iOS
的K線開源項目捅厂。 - 該項目整體設(shè)計思路已經(jīng)經(jīng)過某成熟證券APP的商業(yè)認(rèn)證。
- 本項目將K線業(yè)務(wù)代碼盡可能
縮減
资柔,保留核心功能
焙贷,可流暢、高效實現(xiàn)手勢交互贿堰。 - K線難點在于手勢交互和數(shù)據(jù)動態(tài)刷新上辙芍,功能并不復(fù)雜,關(guān)鍵在于設(shè)計思路羹与。
演示:
建議:
- 如果搭建K線為公司業(yè)務(wù)故硅,不建議采用集成度高的開源代碼。龐大臃腫纵搁,縱然短期匆忙上線吃衅,難以應(yīng)付后期靈活需求變更。
Objective-C
版請移步 https://github.com/cclion/CCLKLineChartView
Swift
版請移步 https://github.com/cclion/KLineView 腾誉。
設(shè)計思路&&難點:
K線難點在于手勢的處理上徘层,捏合、長按妄辩、拖拽
都需要展示不同效果惑灵。以下是Z君當(dāng)時做K線時遇到的問題的解決方案山上;
1. 捏合手勢需要動態(tài)改變K線柱的寬度眼耀,對應(yīng)的增加或減少當(dāng)前界面K線柱的展示數(shù)量,并且根據(jù)當(dāng)前展示的數(shù)據(jù)計算出當(dāng)前展示數(shù)據(jù)的極值。
采用UITableView
類實現(xiàn)佩憾,將K線柱封裝在cell
中哮伟,在tableview
中監(jiān)聽捏合手勢干花,對應(yīng)改變cell
的高度,同時刷新cell
中K線柱的布局來實現(xiàn)動態(tài)改變K線柱的寬度楞黄。
采用UITableView
還有一個好處就是可以采用cell
的重用機制降低內(nèi)存池凄。
注意:因為UITableView
默認(rèn)是上下滑動,而K線柱是左右滑動鬼廓,Z君這里將UITableView
做了一個順時針90°的旋轉(zhuǎn)肿仑。
2. K線柱繪制
K線柱采用CAShapeLayer
配合UIBezierPath
繪制,內(nèi)存低碎税,效率高尤慰,棒棒噠!
關(guān)于CAShapeLayer的使用大家可以看這篇 https://zsisme.gitbooks.io/ios-/content/chapter6/cashapelayer.html
(現(xiàn)在的google雷蹂、baidu伟端,好文章都搜不到,一搜全是簡單調(diào)用兩個方法就發(fā)的博客匪煌,還是翻了兩年前的收藏才找到這個網(wǎng)站责蝠,強烈推薦大家)
3. 捏合時保證捏合中心點不變,兩邊以捏合中間點為中心進(jìn)行收縮或擴散
因為UITableView
在改變cell
的高度時萎庭,默認(rèn)時不會改變偏移量霜医,所以不能保證捏合的中心點不變,這里我們的小學(xué)知識就會用上了驳规。
我們可以通過變量定義控件間距離支子。
保證捏合中心點的中K線柱的中心點還在捏合前,就需要c1 = c2
达舒,計算出O2
值朋,在捏合完,設(shè)置偏移量為O2
即可巩搏。
4. K線其他線性指標(biāo)如何繪制
在K線中除了K線柱之外昨登,還有其他均線指標(biāo)
,連貫整個數(shù)據(jù)顯示區(qū)贯底。
由圖可以看出均線指標(biāo)由每個cell
中心點的數(shù)據(jù)連接相鄰的cell
中心點的數(shù)據(jù)丰辣。我們依舊將繪制放在cell
中,將相連兩個cell
的線分割成兩段禽捆,分別在各自所屬的cell
中繪制笙什。
需要我們做的就是就是在cell中傳入相鄰的cell
的soureData
,計算出相鄰中點的位置胚想,分為兩段繪制琐凭。
大家針對K線有什么問題都可以在下面留言,會第一時間解答浊服。
未完待續(xù)