heyho123
heyho123

Reputation: 129

How to use SVG in Flutter

I'm currently in the process of integrating a map into my app, which should highlight individual components in color. I use this map (https://simplemaps.com/resources/svg-de), which is already available in a well-designed SVG file. I am now trying to color the individual SVG paths using Flutter Code. I am building on the svg_path_parser package (https://pub.dev/packages/svg_path_parser) and have used the corresponding example. But I am unable to replace the paths from the example with those from my SVG file. This may be due to the fact that my SVG paths are significantly longer than the ones given in the example. I would be very grateful if you would give me a little help or a suggestion for a better approach.

Upvotes: 1

Views: 7804

Answers (1)

Divyesh mehta
Divyesh mehta

Reputation: 464

step 1.add dependency in your pubspec.yaml

dependencies: flutter_svg: any

step 2.import the flutter svg package in your app

 import 'package:flutter_svg/flutter_svg.dart';

step 3. just use like below

 SvgPicture.asset(
    'assets/images/bm-icon1.svg',
     width: 18.0,
     height: 18.0,
  ),

Upvotes: 1

Related Questions