How to use svg image as background image in Circle Avatar in flutter

Viewed 395

I've tried these line of code but did'nt work for me,

CircleAvatar(
                backgroundImage: Image(image: SvgPicture.asset("assetName")) as ImageProvider,
                backgroundColor: Colors.red,
                radius: 4,
              ),

And also tried this

backgroundImage: SvgPicture.asset("assetName"),

the error I'm facing is "The argument type 'SvgPicture' can't be assigned to the parameter type 'ImageProvider?'."

1 Answers

There are two options:

First:

backgroundImage: SvgPicture.asset("assetName") as ImageProvider,

Second: use another packacge on top of svg_flutter package:

import 'package:flutter_svg_provider/flutter_svg_provider.dart';

Image(
  width: 32,
  height: 32,
  image: Svg('assets/my_icon.svg'),
)
Related