import 'package:flutter/material.dart';
class RectangularPainter extends CustomPainter {
@override
void paint(Canvas canvas, Size size) {
final paint = Paint()
..color = const Color(0xFF25C700)
..style = PaintingStyle.stroke
..strokeWidth = 4;
final rect = Rect.fromLTWH(0, 0, size.width, size.height);
// canvas.drawRect(rect, paint);
// 定义矩形的边框和填充区域
RRect rRect = RRect.fromRectAndRadius(rect, Radius.circular(0)); // 设置矩形的圆角
const gradient = LinearGradient(
colors: [Colors.blue, Colors.green], // 渐变色的起始和结束颜色
begin: Alignment.topLeft,
end: Alignment.bottomRight,
);
// 绘制渐变色填充
paint.shader = gradient.createShader(rect);
canvas.drawRRect(rRect, paint); // 使用绘制的渐变色填充矩形
// 绘制矩形边框
paint.color = Colors.black; // 设置边框颜色
paint.style = PaintingStyle.stroke; // 只绘制边框
paint.strokeWidth = 4; // 设置边框宽度
canvas.drawRRect(rRect, paint); // 绘制边框
}
@override
bool shouldRepaint(CustomPainter oldDelegate) {
return false;
}
}
边框上绘制渐变色
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 使用CustomClipper绘制一个不规则的形状,然后使用CustomPainter给这个形状添加边框和背景色 ...
- 之前写过一篇文章,怎样做一个渐变色的NavBar:iOS Navbar设置渐变色,可是在使用中会拦截NavBar上...