Flutter笔记 完全基于Flutter绘图技术绘制一个精美的Dart语言吉祥物Dash（上）
作者 ：李俊才 （jcLee95）：blog.csdn.net/qq_28550263
邮箱 ： 291148484@163.com
本文地址 ：blog.csdn.net/qq_28550263...
【介绍】：本文完全基于Flutter绘图技术绘制一个精美的Dash图标（上）。
目 录* * *
什么也不用多说了，今天我是来炫技的。完全基于Flutter绘图技术绘制一个精美的Dart吉祥物Dash
另见下一篇文章：《Flutter笔记：完全基于Flutter绘图技术绘制一个精美的Dash图标（中）》 后续说明。
另见下下一篇文章：《Flutter笔记：完全基于Flutter绘图技术绘制一个精美的Dash图标（下）》 后续说明。
由于字数限制，分两篇文章，完全基于 Flutter 绘图技术，绘制以下图片，最后进行说明：
1. 上代码
第一部分：基本页面框架
dart
class DashDraw extends StatelessWidget {
final double width;
final double height;
const DashDraw({
super.key,
this.width = 200,
this.height = 200,
});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: CustomPaint(
size: Size(width, height),
painter: DashDrawPainter(),
),
);
}
}第二部分：Dash 绘制器
dart
class DashDrawPainter extends CustomPainter {
@override
void paint(Canvas canvas, Size size) {
final paint0 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path0 = Path();
path0.moveTo(513.89, 38.25);
path0.lineTo(508.03, 32.81);
canvas.drawPath(path0, paint0);
final paint1 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path1 = Path();
path1.moveTo(499.06, 41.23);
path1.lineTo(501.60, 49.15);
path1.arcTo(Rect.fromLTRB(501.63000000000005, 49.11, 501.69, 49.17), 0.0, -180.0, false);
path1.quadraticBezierTo(501.44, 43.74, 500.31, 38.16);
path1.quadraticBezierTo(500.14, 37.32, 500.49, 36.92);
path1.quadraticBezierTo(500.90, 36.46, 501.74, 36.22);
canvas.drawPath(path1, paint1);
final paint2 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path2 = Path();
path2.moveTo(508.36, 51.87);
path2.quadraticBezierTo(507.23, 53.00, 507.96, 55.34);
path2.quadraticBezierTo(508.14, 55.91, 508.58, 55.51);
path2.quadraticBezierTo(509.14, 55.01, 509.03, 52.98);
canvas.drawPath(path2, paint2);
final paint3 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path3 = Path();
path3.moveTo(510.10, 52.90);
path3.quadraticBezierTo(511.21, 49.78, 509.80, 46.83);
canvas.drawPath(path3, paint3);
final paint4 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path4 = Path();
path4.moveTo(516.11, 47.98);
path4.quadraticBezierTo(516.48, 55.01, 517.73, 43.82);
canvas.drawPath(path4, paint4);
final paint5 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path5 = Path();
path5.moveTo(525.59, 88.42);
path5.quadraticBezierTo(522.72, 91.20, 523.62, 94.11);
canvas.drawPath(path5, paint5);
final paint6 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path6 = Path();
path6.moveTo(523.62, 94.11);
path6.lineTo(513.32, 104.92);
path6.arcTo(Rect.fromLTRB(511.28999999999996, 104.08, 513.73, 106.52), 0.0, 180.0, false);
path6.lineTo(502.53, 106.05);
path6.arcTo(Rect.fromLTRB(500.37, 104.0, 502.45000000000005, 106.06), -2.6, 180.0, false);
path6.lineTo(501.35, 100.48);
path6.arcTo(Rect.fromLTRB(499.85999999999996, 98.67, 501.82, 100.61), -76.4, -180.0, false);
path6.cubicTo(496.11, 97.07, 496.50, 105.96, 491.82, 103.63);
path6.quadraticBezierTo(489.01, 102.23, 486.80, 99.94);
path6.quadraticBezierTo(485.02, 98.09, 480.93, 92.62);
canvas.drawPath(path6, paint6);
final paint7 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path7 = Path();
path7.moveTo(480.93, 92.62);
path7.quadraticBezierTo(480.20, 90.49, 477.31, 88.14);
canvas.drawPath(path7, paint7);
final paint8 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path8 = Path();
path8.moveTo(477.31, 88.14);
path8.quadraticBezierTo(478.00, 85.44, 474.79, 84.64);
canvas.drawPath(path8, paint8);
final paint9 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path9 = Path();
path9.moveTo(470.67, 58.41);
path9.quadraticBezierTo(470.66, 61.37, 473.97, 61.66);
path9.arcTo(Rect.fromLTRB(473.66, 60.65, 475.44, 62.37), 29.8, -180.0, false);
path9.quadraticBezierTo(475.17, 61.07, 474.74, 60.71);
canvas.drawPath(path9, paint9);
final paint10 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path10 = Path();
path10.moveTo(473.57, 51.90);
path10.quadraticBezierTo(474.02, 46.58, 472.73, 41.75);
canvas.drawPath(path10, paint10);
final paint11 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path11 = Path();
path11.moveTo(473.09, 34.16);
path11.lineTo(477.77, 41.97);
canvas.drawPath(path11, paint11);
final paint12 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path12 = Path();
path12.moveTo(479.80, 37.78);
path12.quadraticBezierTo(480.61, 38.16, 481.84, 38.13);
canvas.drawPath(path12, paint12);
final paint13 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path13 = Path();
path13.moveTo(482.87, 41.96);
path13.quadraticBezierTo(482.13, 41.39, 482.32, 43.02);
path13.arcTo(Rect.fromLTRB(483.05, 42.47, 484.67, 44.09), 0.0, -180.0, false);
path13.quadraticBezierTo(485.24, 40.45, 489.08, 41.92);
canvas.drawPath(path13, paint13);
final paint14 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path14 = Path();
path14.moveTo(771.11, 206.95);
path14.quadraticBezierTo(766.11, 204.00, 762.18, 199.44);
path14.quadraticBezierTo(759.28, 196.07, 757.29, 194.64);
path14.quadraticBezierTo(747.64, 187.69, 736.06, 184.52);
path14.quadraticBezierTo(700.95, 174.90, 667.65, 186.88);
path14.cubicTo(644.51, 195.21, 630.31, 213.89, 619.56, 235.05);
path14.cubicTo(614.32, 245.38, 610.04, 253.02, 608.00, 263.21);
path14.quadraticBezierTo(607.96, 263.42, 607.84, 263.57);
path14.quadraticBezierTo(607.63, 263.82, 607.51, 263.84);
path14.arcTo(Rect.fromLTRB(605.45, 262.28999999999996, 607.45, 264.27), 72.8, 180.0, false);
path14.cubicTo(602.29, 254.33, 597.16, 245.41, 589.49, 239.23);
path14.quadraticBezierTo(561.47, 216.70, 526.29, 205.31);
path14.cubicTo(511.10, 200.40, 492.27, 201.38, 476.56, 202.73);
path14.quadraticBezierTo(469.03, 203.38, 462.09, 205.17);
path14.cubicTo(454.65, 207.10, 445.00, 209.42, 439.06, 214.32);
path14.cubicTo(430.05, 221.74, 417.44, 232.00, 411.02, 242.53);
path14.quadraticBezierTo(405.15, 252.14, 396.40, 268.64);
path14.cubicTo(392.66, 275.70, 390.17, 281.99, 388.17, 289.24);
path14.cubicTo(383.70, 305.53, 379.05, 322.02, 379.97, 339.01);
path14.quadraticBezierTo(381.16, 360.83, 386.36, 384.50);
path14.quadraticBezierTo(388.12, 392.50, 391.11, 400.72);
path14.quadraticBezierTo(394.01, 408.67, 397.16, 416.53);
path14.quadraticBezierTo(401.19, 426.59, 405.81, 434.00);
path14.quadraticBezierTo(416.06, 450.45, 429.91, 464.48);
canvas.drawPath(path14, paint14);
final paint15 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path15 = Path();
path15.moveTo(366.86, 641.18);
path15.quadraticBezierTo(363.07, 645.29, 364.18, 650.25);
path15.quadraticBezierTo(365.20, 654.77, 365.72, 657.89);
path15.quadraticBezierTo(366.65, 663.39, 367.19, 665.53);
path15.quadraticBezierTo(369.51, 674.64, 371.84, 683.76);
path15.cubicTo(373.24, 689.25, 375.98, 694.65, 377.75, 700.31);
path15.quadraticBezierTo(378.82, 703.71, 380.64, 707.31);
path15.quadraticBezierTo(382.43, 710.88, 383.83, 714.65);
path15.quadraticBezierTo(384.17, 715.55, 383.43, 714.94);
path15.cubicTo(382.37, 714.06, 381.93, 713.69, 380.55, 713.27);
path15.quadraticBezierTo(375.40, 711.71, 373.18, 707.06);
path15.quadraticBezierTo(368.75, 697.75, 365.91, 692.51);
path15.cubicTo(364.48, 689.87, 362.56, 688.11, 360.53, 685.94);
path15.cubicTo(356.68, 681.84, 354.59, 677.30, 349.24, 674.04);
path15.cubicTo(344.77, 671.31, 342.29, 665.05, 340.84, 660.28);
path15.cubicTo(338.62, 652.99, 334.75, 648.14, 327.89, 644.60);
path15.arcTo(Rect.fromLTRB(325.37, 642.97, 328.49, 645.95), -35.5, -180.0, false);
path15.quadraticBezierTo(322.73, 645.20, 317.82, 643.63);
path15.cubicTo(312.29, 641.86, 312.08, 638.49, 313.98, 633.62);
path15.cubicTo(316.30, 627.67, 316.78, 624.46, 314.93, 618.23);
path15.quadraticBezierTo(312.33, 609.47, 312.56, 600.43);
canvas.drawPath(path15, paint15);
final paint16 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path16 = Path();
path16.moveTo(312.56, 600.43);
path16.cubicTo(321.68, 576.73, 322.81, 550.79, 314.65, 526.65);
path16.quadraticBezierTo(306.78, 503.32, 293.11, 482.85);
path16.cubicTo(279.36, 462.25, 261.01, 445.30, 250.55, 422.95);
path16.quadraticBezierTo(244.62, 410.30, 230.02, 375.37);
path16.quadraticBezierTo(223.21, 359.08, 219.97, 353.55);
path16.cubicTo(214.41, 344.05, 196.27, 326.09, 183.69, 333.97);
path16.quadraticBezierTo(180.05, 336.25, 176.49, 342.46);
path16.quadraticBezierTo(170.23, 353.40, 166.51, 365.52);
path16.quadraticBezierTo(165.97, 367.30, 165.97, 368.52);
path16.quadraticBezierTo(166.02, 381.85, 166.16, 395.36);
path16.quadraticBezierTo(166.17, 395.97, 165.58, 395.80);
path16.quadraticBezierTo(152.46, 392.04, 146.10, 403.87);
path16.quadraticBezierTo(138.16, 418.63, 139.19, 435.51);
path16.quadraticBezierTo(140.90, 463.58, 148.33, 490.15);
canvas.drawPath(path16, paint16);
final paint17 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path17 = Path();
path17.moveTo(148.33, 490.15);
path17.quadraticBezierTo(146.81, 491.45, 146.31, 490.88);
path17.quadraticBezierTo(145.42, 489.82, 144.24, 489.07);
path17.quadraticBezierTo(143.81, 488.80, 143.36, 489.03);
path17.quadraticBezierTo(141.24, 490.09, 139.68, 488.38);
path17.quadraticBezierTo(139.34, 488.01, 139.00, 488.37);
path17.quadraticBezierTo(134.42, 493.13, 130.45, 498.42);
path17.quadraticBezierTo(129.21, 500.07, 126.49, 502.59);
path17.quadraticBezierTo(122.77, 506.04, 121.07, 510.86);
path17.cubicTo(119.88, 514.27, 118.54, 516.10, 116.37, 518.58);
path17.arcTo(Rect.fromLTRB(114.95, 518.34, 117.23, 520.6), 62.7, -180.0, false);
path17.quadraticBezierTo(116.29, 521.22, 118.09, 521.43);
path17.quadraticBezierTo(118.56, 521.48, 118.59, 521.95);
path17.quadraticBezierTo(118.72, 524.19, 117.22, 525.72);
path17.quadraticBezierTo(116.87, 526.07, 116.70, 526.54);
path17.lineTo(114.38, 533.14);
canvas.drawPath(path17, paint17);
final paint18 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path18 = Path();
path18.moveTo(480.93, 92.62);
path18.quadraticBezierTo(449.59, 94.00, 418.49, 98.34);
path18.quadraticBezierTo(407.71, 99.85, 398.74, 102.76);
path18.cubicTo(366.38, 113.27, 334.35, 124.40, 306.30, 143.92);
path18.quadraticBezierTo(297.41, 150.11, 293.14, 153.62);
path18.quadraticBezierTo(251.13, 188.15, 215.53, 229.19);
path18.quadraticBezierTo(209.39, 236.26, 203.01, 244.77);
path18.quadraticBezierTo(184.82, 269.01, 167.58, 293.93);
path18.cubicTo(159.85, 305.11, 154.63, 314.31, 148.95, 326.00);
path18.quadraticBezierTo(137.41, 349.72, 125.85, 373.43);
path18.cubicTo(122.53, 380.23, 119.86, 386.90, 118.25, 393.49);
path18.quadraticBezierTo(113.22, 414.01, 108.37, 441.51);
path18.quadraticBezierTo(106.88, 449.95, 106.80, 458.49);
path18.quadraticBezierTo(106.45, 496.11, 114.38, 533.14);
canvas.drawPath(path18, paint18);
final paint19 = Paint()
..color = const Color(0xFF000000)
..style = PaintingStyle.fill
..strokeWidth = 1;
var path19 = Path();
path19.moveTo(114.38, 533.14);
path19.quadraticBezierTo(116.87, 542.54, 120.84, 554.23);
path19.cubicTo(128.69, 577.33, 137.24, 599.51, 146.42, 621.59);
path19.cubicTo(169.12, 676.22, 209.87, 720.27, 254.37, 758.55);
path19.quadraticBezierTo(260.82, 764.10, 270.16, 770.79);
path19.quadraticBezierTo(282.08, 779.33, 293.64, 788.34);
path19.cubicTo(304.27, 796.62, 315.31, 801.84, 327.69, 807.74);
path19.quadraticBezierTo(336.29, 811.83, 346.14, 815.36);
path19.cubicTo(362.84, 821.34, 379.56, 827.63, 396.58, 832.52);
path19.quadraticBezierTo(431.30, 842.50, 445.76, 845.44);
path19.quadraticBezierTo(452.72, 846.85, 457.32, 847.93);
path19.cubicTo(467.51, 850.33, 473.51, 851.54, 482.43, 850.86);
path19.arcTo(Rect.fromLTRB(482.3, 849.9599999999999, 482.96, 850.62), 0.0, -180.0, false);
path19.cubicTo(461.28, 829.92, 445.05, 808.21, 435.85, 779.84);
path19.quadraticBezierTo(435.69, 779.35, 435.26, 779.07);
path19.quadraticBezierTo(419.96, 769.27, 409.60, 754.71);
path19.cubicTo(401.10, 742.79, 393.34, 727.52, 386.17, 712.87);
path19.cubicTo(374.86, 689.78, 369.53, 665.62, 366.86, 641.18);
canvas.drawPath(path19, paint19);