网站的开发方法有哪些,重庆的网站建设公司,网页技术开发设计,东莞企业展厅设计公司功能#xff1a;CustomPaint 相当于在一个画布上面画画#xff0c;可以自己绘制不同的颜色形状等 在各种widget 或者是插件不能满足到需求的时候#xff0c;可以自己定义一些形状 使用实例和代码#xff1a;
CustomPaint#xff1a; 能使你绘制的东西显示在你的ui 上面CustomPaint 相当于在一个画布上面画画可以自己绘制不同的颜色形状等 在各种widget 或者是插件不能满足到需求的时候可以自己定义一些形状 使用实例和代码
CustomPaint 能使你绘制的东西显示在你的ui 上面 painter》child》oregroundPainterforegroundPainter最外面的一层会覆盖painterchild 层里面的widget. return Container(//painter 绘制完成之后需要再CustomPaint 里面构建称为widgetchild: Center(child: CustomPaint(child: Icon(Icons.abc,size: 40,color: Colors.red,),painter: MybackGroudnPaiter(), //最内一层// child: ,//子组件在中间foregroundPainter: ForegroundPainter(), //最外面一层也是 CustomPainter),),);CustomPainter 绘制
class MybackGroudnPaiter extends CustomPainter {overridevoid paint(Canvas canvas, Size size) {//canvas 画布size 画布的尺寸//在这边绘制// canvas.drawColor(Colors.red, BlendMode.color);var centerp size / 2;//定义画笔是什么颜色,样式画笔的宽度var paint Paint()..color Colors.teal..style PaintingStyle.fill..strokeWidth 2.0;canvas.drawRect(Rect.fromLTWH(centerp.width - 100, centerp.height - 100, 200, 200),paint);}overridebool shouldRepaint(covariant CustomPainter oldDelegate) {return true;}
}class ForegroundPainter extends CustomPainter {overridevoid paint(Canvas canvas, Size size) {var centerp size / 2;//定义画笔是什么颜色,样式画笔的宽度var paint Paint()..color Colors.pink..style PaintingStyle.fill..strokeWidth 2.0;canvas.drawRect(Rect.fromLTWH(centerp.width - 130, centerp.height - 130, 200, 200),paint);}overridebool shouldRepaint(covariant CustomPainter oldDelegate) {// TODO: implement shouldRepaintreturn true;}
} 绘画的能力
我们绘制1000个彩色点点从上往下掉落看看性能没有任何的卡顿真给力
import dart:math;
import package:flutter/material.dart;void main() runApp(const MyApp());class MyApp extends StatelessWidget {const MyApp({Key? key}) : super(key: key);overrideWidget build(BuildContext context) {return const MaterialApp(home: Scaffold(backgroundColor: Colors.white,body: MyHomePage(title: jack ma,),),);}
}class MyHomePage extends StatefulWidget {const MyHomePage({Key? key, required this.title}) : super(key: key);final String title;overrideStateMyHomePage createState() _MyHomePageState();
}class _MyHomePageState extends StateMyHomePagewith SingleTickerProviderStateMixin {late AnimationController _controller;final ListSnowflake _snowflakes List.generate(1000, (index) Snowflake());overridevoid initState() {;_controller AnimationController(vsync: this, duration: const Duration(seconds: 5))..repeat();super.initState();}overrideWidget build(BuildContext context) {return Scaffold(body: Center(child: SizedBox(width: double.infinity,height: double.infinity,child: AnimatedBuilder(animation: _controller,builder: (BuildContext context, Widget? child) {//一直在这边build5s 动画运行时间for (var snow in _snowflakes) {snow.fall();}return CustomPaint(painter: MyPainter(_snowflakes),);},),),));}
}class MyPainter extends CustomPainter {final ListSnowflake _snowflakes;MyPainter(this._snowflakes);overridevoid paint(Canvas canvas, Size size) {final whitePaint Paint()..color Colors.grey;for (int i 0; i 1000; i) {whitePaint.color Colors.primaries[i % Colors.primaries.length];canvas.drawCircle(Offset(_snowflakes[i].x, _snowflakes[i].y),_snowflakes[i].radius, whitePaint);}}overridebool shouldRepaint(covariant CustomPainter oldDelegate) true;
}class Snowflake {double x Random().nextDouble() * 400;double y Random().nextDouble() * 800;double radius Random().nextDouble() * 2 2;double velocity Random().nextDouble() * 4 2;void fall() {y velocity;if (y 800) {y 0;x Random().nextDouble() * 400;radius Random().nextDouble() * 2 2;velocity Random().nextDouble() * 4 2;}}
}
