iOS股票K線圖、分時圖繪製

介紹：

這是以雪球APP爲原型，基於iOS的K線開源項目。

該項目總體設計思路已經通過某成熟證券APP的商業認證。

本項目將K線業務代碼儘量縮減，保留核心功能，可流暢、高效實現手勢交互。

K線難點在於手勢交互和數據動態刷新上，功能並不複雜，關鍵在於設計思路。

演示：

K線演示文檔.gif

建議：

若是搭建K線爲公司業務，不建議採用集成度高的開源代碼。龐大臃腫，縱然短時間匆忙上線，難以應付後期靈活需求變動。

Objective-C版請移步https://github.com/cclion/CCLKLineChartView

Swift版請移步https://github.com/cclion/KLineView。

設計思路&&難點：

K線難點在於手勢的處理上，捏合、長按、拖拽都須要展現不一樣效果。如下是Z君當時作K線時遇到的問題的解決方案；

1. 捏合手勢須要動態改變K線柱的寬度，對應的增長或減小當前界面K線柱的展現數量,而且根據當前展現的數據計算出當前展現數據的極值。

採用UITableView類實現，將K線柱封裝在cell中，在tableview中監聽捏合手勢，對應改變cell的高度，同時刷新cell中K線柱的佈局來實現動態改變K線柱的寬度。

採用UITableView還有一個好處就是能夠採用cell的重用機制下降內存。

注意：由於UITableView默認是上下滑動，而K線柱是左右滑動，Z君這裏將UITableView作了一個順時針90°的旋轉。

tableView旋轉90°

2. K線柱繪製

K線柱採用CAShapeLayer配合UIBezierPath繪製，內存低，效率高，棒棒噠！

關於CAShapeLayer的使用你們能夠看這篇https://zsisme.gitbooks.io/ios-/content/chapter6/cashapelayer.html

（如今的google、baidu，好文章都搜不到，一搜全是簡單調用兩個方法就發的博客，仍是翻了兩年前的收藏才找到這個網站，強烈推薦你們）

3. 捏合時保證捏合中心點不變，兩邊以捏合中間點爲中心進行收縮或擴散

由於UITableView在改變cell的高度時，默認時不會改變偏移量，因此不能保證捏合的中心點不變，這裏咱們的小學知識就會用上了。

捏合時狀態.png

咱們能夠經過變量定義控件間距離。

捏合先後.png

保證捏合中心點的中K線柱的中心點還在捏合前，就須要c1 = c2，計算出O2，在捏合完，設置偏移量爲O2便可。

計算偏移量.png

4. K線其餘線性指標如何繪製

在K線中除了K線柱以外，還有其餘均線指標，連貫整個數據顯示區。

線性指標

由圖能夠看出均線指標由每一個cell中心點的數據鏈接相鄰的cell中心點的數據。咱們依舊將繪製放在cell中，將相連兩個cell的線分割成兩段，分別在各自所屬的cell中繪製。

須要咱們作的就是就是在cell中傳入相鄰的cell的soureData，計算出相鄰中點的位置，分爲兩段繪製。

分割繪製

你們針對K線有什麼問題均可以在下面留言，會第一時間解答

本文爲第三方轉載，原文連接：www.jianshu.com/p/104857287…

文章如有不對地方，歡迎批評指正，一個小而有用QQ交流羣：805558511