forked from toly1994328/FlutterUnit
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
59f8125
commit 5fb9805
Showing
23 changed files
with
741 additions
and
144 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| [ | ||
| { | ||
| "image": "assets/images/anim_draw.webp", | ||
| "name": "基础绘制", | ||
| "info": "收录一些基础图形绘制案例，这些案例对初涉绘制的编程者会非常友好。通过这些案例，可以学会点、线、矩形、圆、圆弧、文字、图片等基本图形的绘制方法，了解 Canvas、Paint、Path 等绘制中核心对象的使用。" | ||
| }, | ||
| { | ||
| "image": "assets/images/draw_bg3.webp", | ||
| "name": "动画手势", | ||
| "info": "收录一些动画和手势的绘制案例，这些案例会让绘制更具有操作性。通过这些案例，可以学会动画和手势的使用，如滑动、旋转、缩放、移动等效果，让绘制不再只是静态展现。" | ||
| }, | ||
| { | ||
| "image": "assets/images/base_draw.webp", | ||
| "name": "粒子绘制", | ||
| "info": "收录一些粒子相关的绘制案例，这些案例将是绘制的顶级操作。通过这些案例，可以学会如何使用粒子来绘制惊艳的视觉效果，如粒子时钟、粒子爆炸、粒子背景等效果，让绘制拥有无限可能。" | ||
| }, | ||
| { | ||
| "image": "assets/images/draw_bg4.webp", | ||
| "name": "趣味绘制", | ||
| "info": "收录一些比较有趣的绘制案例，让我们一起在这里一起体验绘制的乐趣、编程的乐趣和智慧的乐趣吧。" | ||
| }, | ||
| { | ||
| "image": "assets/images/caver.webp", | ||
| "name": "艺术画廊", | ||
| "info": "收录一些殿堂级的绘制案例，这些案例将是绘制的巅峰作品，它们的没有任何的实用性，也不为任何需求而生，它们仅是因为存在而存在，是人类智慧和表达的媒介，称谓艺术。" | ||
| } | ||
| ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -27,6 +27,4 @@ class ColorChangeCubit extends Cubit<SelectTab> { | |
| color: color, | ||
| family: family ?? state.family, | ||
| )); | ||
|
|
||
|
|
||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
108 changes: 108 additions & 0 deletions
108
lib/painter_system/anim/rotate_by_point/angle_panter.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,108 @@ | ||
| import 'dart:math'; | ||
|
|
||
| import 'package:dash_painter/dash_painter.dart'; | ||
| import 'package:flutter/material.dart'; | ||
|
|
||
| import 'line.dart'; | ||
|
|
||
| class AnglePainter extends CustomPainter { | ||
| final DashPainter dashPainter = const DashPainter(span: 4, step: 4); | ||
|
|
||
| AnglePainter({required this.line}) : super(repaint: line); | ||
|
|
||
| final Paint pointPaint = Paint() | ||
| ..style = PaintingStyle.stroke | ||
| ..strokeWidth = 1; | ||
|
|
||
| final Paint helpPaint = Paint() | ||
| ..style = PaintingStyle.stroke | ||
| ..color = Colors.lightBlue | ||
| ..strokeWidth = 1; | ||
|
|
||
| final TextPainter textPainter = TextPainter( | ||
| textAlign: TextAlign.center, | ||
| textDirection: TextDirection.ltr, | ||
| ); | ||
|
|
||
| final Line line; | ||
|
|
||
| @override | ||
| void paint(Canvas canvas, Size size) { | ||
| canvas.translate(size.width / 2, size.height / 2); | ||
| drawHelp(canvas, size); | ||
| line.paint(canvas); | ||
| } | ||
|
|
||
| void drawHelp(Canvas canvas, Size size) { | ||
| Path helpPath = Path() | ||
| ..moveTo(-size.width / 2, 0) | ||
| ..relativeLineTo(size.width, 0) | ||
| ..moveTo(0, -size.height / 2) | ||
| ..relativeLineTo(0, size.height); | ||
| dashPainter.paint(canvas, helpPath, helpPaint); | ||
|
|
||
| drawHelpText('0°', canvas, Offset(size.width / 2 - 20, 0)); | ||
| drawHelpText('p0', canvas, line.start.translate(-20, 0)); | ||
| drawHelpText('p1', canvas, line.end.translate(-20, 0)); | ||
|
|
||
| // drawHelpText('p2', canvas, Offset(60, 40).translate(10, 0)); | ||
| // drawAnchor(canvas, Offset(60, 40)); | ||
| drawAnchor(canvas, line.percent(0.2)); | ||
| // drawAnchor(canvas, line.percent(0.5)); | ||
|
|
||
| // drawAnchor(canvas, line.percent(0.8)); | ||
|
|
||
| drawHelpText( | ||
| '角度: ${(line.positiveRad * 180 / pi).toStringAsFixed(2)}°', | ||
| canvas, | ||
| Offset( | ||
| -size.width / 2 + 10, | ||
| -size.height / 2 + 10, | ||
| ), | ||
| ); | ||
|
|
||
|
|
||
|
|
||
| // canvas.drawArc( | ||
| // Rect.fromCenter(center: line.start, width: 20, height: 20), | ||
| // 0, | ||
| // line.positiveRad, | ||
| // false, | ||
| // helpPaint, | ||
| // ); | ||
|
|
||
| // canvas.save(); | ||
| // Offset center = const Offset(60, 60); | ||
| // canvas.translate(center.dx, center.dy); | ||
| // canvas.rotate(line.positiveRad); | ||
| // canvas.translate(-center.dx, -center.dy); | ||
| // canvas.drawCircle(center, 4, helpPaint); | ||
| // canvas.drawRect( | ||
| // Rect.fromCenter(center: center, width: 30, height: 60), helpPaint); | ||
| // canvas.restore(); | ||
| } | ||
|
|
||
| void drawAnchor(Canvas canvas, Offset offset) { | ||
| canvas.drawCircle(offset, 4, pointPaint..style = PaintingStyle.stroke); | ||
| canvas.drawCircle(offset, 2, pointPaint..style = PaintingStyle.fill); | ||
| } | ||
|
|
||
| void drawHelpText( | ||
| String text, | ||
| Canvas canvas, | ||
| Offset offset, { | ||
| Color color = Colors.lightBlue, | ||
| }) { | ||
| textPainter.text = TextSpan( | ||
| text: text, | ||
| style: TextStyle(fontSize: 12, color: color), | ||
| ); | ||
| textPainter.layout(maxWidth: 200); | ||
| textPainter.paint(canvas, offset); | ||
| } | ||
|
|
||
| @override | ||
| bool shouldRepaint(covariant CustomPainter oldDelegate) { | ||
| return false; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| import 'dart:math'; | ||
|
|
||
| import 'package:flutter/cupertino.dart'; | ||
| import 'package:flutter/material.dart'; | ||
|
|
||
| class Line with ChangeNotifier { | ||
| Line({ | ||
| this.start = Offset.zero, | ||
| this.end = Offset.zero, | ||
| }); | ||
|
|
||
| Offset start; | ||
| Offset end; | ||
|
|
||
| final Paint pointPaint = Paint() | ||
| ..style = PaintingStyle.stroke | ||
| ..strokeWidth = 1; | ||
|
|
||
| void paint(Canvas canvas) { | ||
| canvas.drawLine(start, end, pointPaint); | ||
| drawAnchor(canvas, start); | ||
| drawAnchor(canvas, end); | ||
| } | ||
|
|
||
| double get rad => (end - start).direction; | ||
|
|
||
| double get positiveRad => rad < 0 ? 2 * pi + rad : rad; | ||
|
|
||
| double get length => (end - start).distance; | ||
|
|
||
| void drawAnchor(Canvas canvas, Offset offset) { | ||
| canvas.drawCircle(offset, 4, pointPaint..style = PaintingStyle.stroke); | ||
| canvas.drawCircle(offset, 2, pointPaint..style = PaintingStyle.fill); | ||
| } | ||
|
|
||
| double detaRotate = 0; | ||
|
|
||
| void rotate(double rotate, {Offset? centre}) { | ||
| detaRotate = rotate - detaRotate; | ||
| centre = centre ?? start; | ||
| Line p2p0 = Line(start: centre, end: start); | ||
| Line p2p1 = Line(start: centre, end: end); | ||
| p2p0._rotateByStart(detaRotate); | ||
| p2p1._rotateByStart(detaRotate); | ||
| start = p2p0.end; | ||
| end = p2p1.end; | ||
| detaRotate = rotate; | ||
| notifyListeners(); | ||
| } | ||
|
|
||
|
|
||
|
|
||
| Offset percent(double percent){ | ||
| return Offset( | ||
| length*percent*cos(rad), | ||
| length*percent*sin(rad), | ||
| )+start; | ||
| } | ||
|
|
||
| void _rotateByStart(double rotate) { | ||
| end = Offset( | ||
| length * cos(rad + rotate), | ||
| length * sin(rad + rotate), | ||
| ) + | ||
| start; | ||
| } | ||
|
|
||
| void tick() { | ||
| notifyListeners(); | ||
| } | ||
| } |
Oops, something went wrong.