Чтобы отобразить изображение SVG в приложении Flutter, вы можете использовать несколько методов. Вот несколько примеров с фрагментами кода:
Метод 1: использование пакета flutter_svg
Пакет flutter_svg— популярный выбор для рендеринга SVG-изображений во Flutter. Вы можете установить его, добавив flutter_svgв файл pubspec.yamlв разделе зависимостей. Вот пример того, как его использовать:
import 'package:flutter_svg/flutter_svg.dart';
class MySvgImage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('SVG Image Example'),
),
body: Center(
child: SvgPicture.asset(
'assets/images/example.svg',
width: 200,
height: 200,
),
),
);
}
}
Обязательно замените 'assets/images/example.svg'фактическим путем к вашему SVG-файлу.
Метод 2: использование Image.assetс пакетом SVG.
Другой подход заключается в использовании пакета SVG, который преобразует изображения SVG в объекты ui.Picture, которые затем можно отобразить с помощью виджета Image.asset. Одним из таких пакетов является flutter_svg_parser. Вот пример:
import 'package:flutter_svg_parser/flutter_svg_parser.dart';
class MySvgImage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('SVG Image Example'),
),
body: FutureBuilder<ui.Picture>(
future: SvgParser().parse('assets/images/example.svg'),
builder: (BuildContext context, AsyncSnapshot<ui.Picture> snapshot) {
if (snapshot.hasData) {
return Center(
child: Image(
image: RawPicture(
picture: snapshot.data,
),
width: 200,
height: 200,
),
);
} else if (snapshot.hasError) {
return Text('Error loading SVG');
} else {
return CircularProgressIndicator();
}
},
),
);
}
}
И снова замените 'assets/images/example.svg'фактическим путем к вашему SVG-файлу.