上篇文章讲了flutter自定义的相关流程,
今天继续练习下flutter的自定义K线:
我们可以通过自定义Painter来实现一个简单的K线图界面:
- 创建一个自定义的Painter,用于绘制K线图:
import 'dart:ui';
import 'package:flutter/material.dart';
class KLinePainter extends CustomPainter {
final List<dynamic> data;
final double itemWidth;
final double scaleFactor;
KLinePainter({required this.data, required this.itemWidth, required this.scaleFactor});
@override
void paint(Canvas canvas, Size size) {
// 设置画笔
final linePaint = Paint()
..color = Colors.grey
..strokeWidth = 0.5;
final textPainter = TextPainter(textDirection: TextDirection.ltr, textAlign: TextAlign.left);
// 计算价格范围和最大成交量
num highestPrice = double.minPositive;
num lowestPrice = double.maxFinite;
num highestVolume = double.minPositive;
for (var item in data) {
if (item['high'] > highestPrice)