Skip to content

Commit

Permalink
绘制冰墩墩
Browse files Browse the repository at this point in the history
  • Loading branch information
@toly1994328
toly1994328 committed Feb 16, 2022
1 parent 7bff7b6 commit 2ea12bc
Show file tree
Hide file tree
Showing 4 changed files with 731 additions and 0 deletions.
Binary file added assets/images/logo1.webp
View file
Binary file not shown.
265 changes: 265 additions & 0 deletions lib/painter_system/anim/dundun_path.dart
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,265 @@
import 'dart:math';
import 'dart:typed_data';
import 'dart:ui' as ui;
import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';



class DunDunPathPage extends StatefulWidget {
const DunDunPathPage({Key? key}) : super(key: key);

@override
_DunDunPathPageState createState() => _DunDunPathPageState();
}

class _DunDunPathPageState extends State<DunDunPathPage>with SingleTickerProviderStateMixin {
ui.Image? logo2Image;

late AnimationController _controller;


@override
void initState() {
super.initState();
loadImage();
_controller = AnimationController(
duration: const Duration(seconds: 3),
vsync: this,
)..forward();
}

@override
void dispose() {
_controller.dispose();
super.dispose();
}

void loadImage() async {
ByteData data2 = await rootBundle.load('assets/images/logo1.webp');
logo2Image = await decodeImageFromList(data2.buffer.asUint8List());
if (mounted) setState(() {});
}

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: GestureDetector(
onTap: (){
_controller.reset();
_controller.forward();
},
child: CustomPaint(
painter: DunDunPainter(logo2Image,_controller),
size: const Size(200, 200),
),
),
),
);
}
}

class DunDunPainter extends CustomPainter {

final ui.Image? logo2Image;
final Animation<double> repaint;

DunDunPainter(this.logo2Image,this.repaint):super(repaint: repaint);

final Paint helpPaint = Paint()
..style = PaintingStyle.stroke
..color = Colors.blue;
final Paint pathPaint = Paint()..style = PaintingStyle.stroke;

@override
void paint(Canvas canvas, Size size) {
if (logo2Image!=null) {
Rect src2 = Rect.fromLTWH(
0, 0, logo2Image!.width.toDouble(), logo2Image!.height.toDouble());
Rect dst2 = Rect.fromLTWH(85, 132, 899/27, 1066/27);
canvas.drawImageRect(logo2Image!, src2, dst2, Paint());
}

Path dundunPath = Path();
canvas.translate(30, 80);
helpPaint.color = Colors.red;

Path bodyPath = buildBodyPath();
Path leftHandPath = buildLeftHandPath();
Path rightHandPath = buildRightHandPath();

canvas.save();
Path eyePath = Path();
Matrix4 m = Matrix4.translationValues(46,-12, 0).multiplied(
Matrix4.rotationZ(45 / 180 * pi)
);
eyePath
.addOval(Rect.fromCenter(center: Offset(0, 0), width: 32, height: 49));
eyePath = eyePath.transform(m.storage);
canvas.restore();

Path leftEyePath = Path();
leftEyePath.addOval(Rect.fromCenter(center: Offset(50, -13), width: 18, height: 18));

Path leftEyePath2 = Path();
leftEyePath2.addOval(Rect.fromCenter(center: Offset(50, -13), width: 7, height: 7));

Path leftEyePath3 = Path();
leftEyePath3.addOval(Rect.fromCenter(center: Offset(51, -19), width: 4, height: 4));


Path rightEyePath = Path();
rightEyePath.addOval(Rect.fromCenter(center: Offset(98, -14), width: 17, height: 17));

Path rightEyePath2 = Path();
rightEyePath2.addOval(Rect.fromCenter(center: Offset(98, -14), width: 7, height: 7));

Path rightEyePath3 = Path();
rightEyePath3.addOval(Rect.fromCenter(center: Offset(98, -19), width: 4, height: 4));

Path nosePath = Path();
nosePath.moveTo(79, -0,);
nosePath.relativeLineTo(14, -14,);
nosePath.relativeLineTo(-28, 0,);
nosePath.close();
Path clipCirclePath =Path();
clipCirclePath.addOval(Rect.fromCenter(center: Offset(79, -10,), width: 14, height: 14));
nosePath = Path.combine(PathOperation.intersect, nosePath, clipCirclePath);
Path smaliPath = Path();
smaliPath.moveTo(65, -0,);

smaliPath.quadraticBezierTo(78, 15, 90, 0);
smaliPath.quadraticBezierTo(78, 6, 65, 0,);

Path colorfulPath = Path();
colorfulPath.addOval(Rect.fromCenter(center: Offset(72, -5,), width: 120, height: 110));
colorfulPath.addOval(Rect.fromCenter(center: Offset(72, -5,), width: 110, height: 100));
colorfulPath.addOval(Rect.fromCenter(center: Offset(72, -5,), width: 115, height: 110));
colorfulPath.addOval(Rect.fromCenter(center: Offset(72, -5,), width: 120, height: 105));
colorfulPath.addOval(Rect.fromCenter(center: Offset(72, -5,), width: 115, height: 105));

canvas.save();
Path eyePath2 = Path();
Matrix4 m2 = Matrix4.translationValues(105,-12,0).multiplied(
Matrix4.rotationZ(-40 / 180 * pi)
);
eyePath2
.addOval(Rect.fromCenter(center: Offset(0, 0), width: 29, height: 48));
eyePath2 = eyePath2.transform(m2.storage);
canvas.restore();
Path leftFootPath = buildFootPath();
Path erPath = buildErPath();

//爱心
List<Offset> arr = [];
int len = 50;
double a =1;
for (int i = 0; i < len; i++) {
double step = (i / len) * (pi * 2); //递增的θ
Offset offset = Offset(
a * (11 * pow(sin(step), 3)).toDouble() ,
-a *
(9 * cos(step) -
5 * cos(2 * step) -
2 * cos(3 * step) -
cos(4 * step)),
);
arr.add(offset);
}
Path starPath = Path();
for (int i = 0; i < len; i++) {
starPath.lineTo(arr[i].dx, arr[i].dy);
}
starPath = starPath.shift(Offset(152,-20));

dundunPath.addPath(bodyPath, Offset.zero);
dundunPath.addPath(leftHandPath, Offset.zero);
dundunPath.addPath(rightHandPath, Offset.zero);
dundunPath.addPath(leftFootPath, Offset.zero);
dundunPath.addPath(erPath, Offset.zero);
dundunPath.addPath(eyePath, Offset.zero);
dundunPath.addPath(eyePath2, Offset.zero);
dundunPath.addPath(leftEyePath, Offset.zero);
dundunPath.addPath(leftEyePath2, Offset.zero);
dundunPath.addPath(leftEyePath3, Offset.zero);
dundunPath.addPath(rightEyePath, Offset.zero);
dundunPath.addPath(rightEyePath2, Offset.zero);
dundunPath.addPath(rightEyePath3, Offset.zero);
dundunPath.addPath(nosePath, Offset.zero);
dundunPath.addPath(starPath, Offset.zero);
dundunPath.addPath(colorfulPath, Offset.zero);
dundunPath.addPath(smaliPath, Offset.zero);

pathPaint
..strokeWidth = 1
..color = Colors.cyanAccent;
PathMetrics pms = dundunPath.computeMetrics();
pms.forEach((pm) {
canvas.drawPath(pm.extractPath(0, pm.length * repaint.value), pathPaint);
});
}

Path buildBodyPath() {
Path path = Path();
path.quadraticBezierTo(10, -75, 75, -75);
path.quadraticBezierTo(135, -70, 138, 0);
path.quadraticBezierTo(130, 90, 65, 98);
path.quadraticBezierTo(-5, 85, 0, 0);
return path;
}

Path buildLeftHandPath() {
Path path = Path();
path.quadraticBezierTo(
-17,
14,
-28,
40,
);
path.quadraticBezierTo(-32, 58, -15, 62);
path.quadraticBezierTo(10, 60, 0, 0);
return path;
}

Path buildRightHandPath() {
Path path = Path();
path.moveTo(135, -20);
path.quadraticBezierTo(140, -48, 165, -35);
path.quadraticBezierTo(180, -17, 135, 22);
path.quadraticBezierTo(125, 17, 135, -20);
return path;
}

Path buildFootPath() {
Path path = Path();
path.moveTo(18, 78);
path.quadraticBezierTo(18, 100, 22, 115);
path.quadraticBezierTo(60, 125, 55, 98);
path.quadraticBezierTo(35, 80, 18, 78);

Path right = path
.transform(Matrix4.diagonal3Values(-1, 1, 1).storage)
.shift(const Offset(128, 0));

return Path.combine(PathOperation.union, path, right);
}

Path buildErPath() {
Path path = Path();
path.moveTo(13, -40);
path.quadraticBezierTo(8, -95, 40, -68);
path.quadraticBezierTo(40, -55, 13, -40);

Path right = path
.transform(Matrix4.diagonal3Values(-1, 1, 1).storage)
.shift(const Offset(138, -5));

return Path.combine(PathOperation.union, path, right);
}

@override
bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
}
Loading

0 comments on commit 2ea12bc

Please sign in to comment.