如何在Flutter中更改SVG图像的颜色填充



大家好,需要您的帮助,我正在用svg_path_parser库将svg图像加载到flutter中,但我想在触摸时更改每个路径的颜色,现在我可以更改所有路径的颜色。但我需要知道选择了哪条路径并更改此路径的颜色;有人可以帮助我或告诉我如何做到这一点。。感谢

我有这个(飘动标志(。。


final paths = [
['m48.75 95.97-25.91-25.74 14.32-14.57 40.39 40.31z', Color(0xff02539a)],
['m22.52 70.25 25.68-25.68h28.87l-39.95 39.95z', Color(0xd745d1fd)],
['m.29 47.85 14.58 14.57 62.2-62.2h-29.02z', Color(0xff45d1fd)]
];
class _MyHomePageState extends State<MyHomePage> {
Color colorSelect = Colors.teal;
bool showBorder = false;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Transform.scale(
scale: 2.0,
child: GestureDetector(
child: Center(
child: Container(
width: 100,
height: 100,
child: Stack(
children: widget.paths.map((e) {
return CustomPaint(
painter: MyPainter(
parseSvgPath(e[0] as String), colorSelect,
showPath: showBorder));
}).toList(),
),
),
),
behavior: HitTestBehavior.translucent,
onTap: () {
setState(() {
// hide/show border
showBorder = !showBorder;
colorSelect = Colors.redAccent;
});
},
),
),
);
}
} 
class MyPainter extends CustomPainter {
final Path path;
final Color color;
final bool showPath;
MyPainter(this.path, this.color, {this.showPath = true});
@override
void paint(Canvas canvas, Size size) {
var paint = Paint()
..color = color
..strokeWidth = 4.0;
canvas.drawPath(path, paint);
if (showPath) {
var border = Paint()
..color = Colors.black
..strokeWidth = 1.0
..style = PaintingStyle.stroke;
canvas.drawPath(path, border);
}
}
SvgPicture.asset("asset/icon_name.jpg",color: Colors.black),

这里使用color属性更改了我的svg填充颜色。

最新更新