RecyclerChart的KLine如何繪制

本篇內容主要講解“RecyclerChart的KLine如何繪制”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“RecyclerChart的KLine如何繪制”吧!

StockValueFormatter

3. 繪制主體的 drawChart. 

4. Mock Bean， Entity數據。

5. 繪制 HighLight

6. 繪制 XAxis

7. 繪制 YAxis,  最大、最小值局部留有 padding

8. 嘗試添加縮放， OnScaleGestureListener； Matrix , onTouch .  根據縮放比例，調整 RecyclerChart的 displayNumber， notifyDataChange。

繪制蠟燭圖

1.計算 color, 參照上個Entry的 close大小。 定義 mStockAttrs 里的兩種 color值，并且是否 Fill。

2. 畫上引線、下引線。

圖表的樣式跟它所依賴的數據是相對應的，然后就是一個業務數據到Chart數據的一個轉化，然后圖表依照Chart數據進行繪制即可。這里的YAxis、XAxis、board, HighLight 好些跟之前的都是相通的，部分可以復用；注意一些邊界上的處理。

主要是CandleChart的繪制，其實里面的主體邏輯跟之前的BarChart也是類似的；這里看看代碼吧：

fun <Y : YAxis> drawStockChart(canvas: Canvas, parent: RecyclerView, yAxis: Y) {
  val parentRight = (parent.width - parent.paddingRight).toFloat()
  val parentLeft = parent.paddingLeft.toFloat()
  val childCount = parent.childCount
  for (i in 0 until childCount) {
    val child = parent.getChildAt(i)
    val stockEntry = child.tag as StockEntry
    val rectMain = getStockRectF(child, parent, yAxis, mStockAttrs, stockEntry)
    val radius = 1f
    val color = if (stockEntry.isRise) mStockAttrs.riseColor else mStockAttrs.downColor
    mBarChartPaint.color = color
    //todo 注意RTL
    drawChart(canvas, rectMain, parent.left.toFloat(), parent.right.toFloat(), radius)
    mHighLightLinePaint.color = color
    if (stockEntry.mShadowHigh > Math.max(stockEntry.mClose, stockEntry.mOpen)){
      drawTopLine(stockEntry.mShadowHigh, canvas, rectMain, yAxis, parent)
    }
    if (stockEntry.mShadowLow < Math.min(stockEntry.mClose, stockEntry.mOpen)){
      drawDownLine(stockEntry.mShadowLow, canvas, rectMain, yAxis, parent)
    }
  }
}

這里包含了主體柱子Chart的繪制，以及上引線、下引線的繪制。

//繪制上引線、下引線
private fun drawTopLine(value:Float, canvas: Canvas, rectF: RectF, yAxis: YAxis,  parent: RecyclerView){
  canvas.save()
  val y = getYPosition(value, parent, yAxis, mStockAttrs)
  val x = (rectF.left + rectF.right)/2
  if (DecimalUtil.bigOrEquals(x, parent.left.toFloat()) && DecimalUtil.smallOrEquals(x, parent.right.toFloat())){
  canvas.drawLine(x, rectF.top, x, y, mHighLightLinePaint)
  canvas.restore()
}
}
//下引線
private fun drawDownLine(value:Float, canvas: Canvas, rectF: RectF, yAxis: YAxis,  parent: RecyclerView){
  canvas.save()
  val y = getYPosition(value, parent, yAxis, mStockAttrs)
  val x = (rectF.left + rectF.right)/2
  if (DecimalUtil.bigOrEquals(x, parent.left.toFloat()) && DecimalUtil.smallOrEquals(x, parent.right.toFloat())){
  canvas.drawLine(x, rectF.bottom, x, y, mHighLightLinePaint)
  canvas.restore()
}
}

繪制Chart 主體，按照先前的繪制，左右邊界的處理。目前還是有些bug， 先處理主邏輯，后續修復吧。

private fun drawChart(canvas: Canvas, rectF: RectF, parentLeft: Float, parentRight: Float, radius: Float) {
    // 浮點數的 == 比較需要注意
    if (DecimalUtil.smallOrEquals(rectF.right, parentLeft)) {
    //continue 會閃，原因是end == parentLeft 沒有過濾掉，顯示出來柱狀圖了。
    } else if (rectF.left < parentLeft && rectF.right > parentLeft) {
    //左邊部分滑入的時候，處理柱狀圖的顯示
    rectF.left = parentLeft
    val path = CanvasUtil.createRectRoundPath(rectF, radius, RoundRectType.TYPE_RIGHT_TOP)
    mBarChartPaint.color = mBarChartAttrs.chartEdgeColor
    canvas.drawPath(path, mBarChartPaint)
    } else if (DecimalUtil.bigOrEquals(rectF.left, parentLeft) && DecimalUtil.smallOrEquals(rectF.right, parentRight)) {
    // 中間部分的Item
    val path = CanvasUtil.createRectRoundPath(rectF, radius, RoundRectType.TYPE_ALL)
    canvas.drawPath(path, mBarChartPaint)
    //            canvas.drawRoundRect(rectF, radius, radius, mBarChartPaint);
    } else if (DecimalUtil.smallOrEquals(rectF.left, parentRight) && rectF.right > parentRight) {
    //右邊部分滑出的時候，處理柱狀圖，文字的顯示
    val distance = parentRight - rectF.left
    rectF.right = rectF.left + distance
    val path = CanvasUtil.createRectRoundPath(rectF, radius, RoundRectType.TYPE_LEFT_TOP)
    mBarChartPaint.color = mBarChartAttrs.chartEdgeColor
    canvas.drawPath(path, mBarChartPaint)
    }
}

到此，相信大家對“RecyclerChart的KLine如何繪制”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！