我正在尝试创建一个模拟时钟,用户可以通过拖动时针和分针来选择时间。 我有这个代码用于工作时间
import 'dart:math';
import 'package:flutter/material.dart';
class HourHandPainter extends CustomPainter{
final bool showHeartShape;
final Paint hourHandPaint;
int hours;
int minutes;
HourHandPainter({this.hours, this.minutes, this.showHeartShape =
false}):hourHandPaint= new Paint(){
//hourHandPaint.color= Colors.black87;
hourHandPaint.color=Colors.blue;
hourHandPaint.style= PaintingStyle.fill;
}
@override
void paint(Canvas canvas, Size size) {
final radius = size.width/2;
// To draw hour hand
canvas.save();
canvas.translate(radius, radius);
//checks if hour is greater than 12 before calculating rotation
canvas.rotate(this.hours>=12?
2*pi*((this.hours-12)/12 + (this.minutes/720)):
2*pi*((this.hours/12)+ (this.minutes/720))
);
Path path= new Path();
if (showHeartShape) {
//heart shape head for the hour hand
path.moveTo(0.0, -radius + radius*15.0/137.5);
path.quadraticBezierTo(radius*(-3.5)/137.5, -radius + radius*25.0/137.5, radius*(-15.0)/137.5, -radius + radius / 4);
path.quadraticBezierTo(
radius*(-20.0)/137.5, -radius + radius / 3, radius*(-7.5)/137.5, -radius + radius / 3);
path.lineTo(0.0, -radius + radius / 4);
path.lineTo(7.5, -radius + radius / 3);
path.quadraticBezierTo(
radius*(20.0)/137.5, -radius + radius / 3, radius*(15.0)/137.5, -radius + radius / 4);
path.quadraticBezierTo(radius*(3.5)/137.5, -radius + radius*(25.0)/137.5, 0.0, -radius + radius*15.0/137.5);
}
//hour hand stem
path.moveTo(-1.0, -radius+radius/4);
path.lineTo(-5.0, -radius+radius/2);
path.lineTo(-2.0, 0.0);
path.lineTo(2.0, 0.0);
path.lineTo(5.0, -radius+radius/2);
path.lineTo(1.0, -radius+radius/4);
path.close();
canvas.drawPath(path, hourHandPaint);
canvas.drawShadow(path, Colors.black, 2.0, false);
canvas.restore();
}
@override
bool shouldRepaint(HourHandPainter oldDelegate) {
return true;
}
}
如何使时针和分针可拖动,我也想知道如何用拖动间隔填充一些颜色。可以说我拖了10:00-12:00的时间,因为我想用一些符号来填充蓝色。
谢谢