[flutter] flutter_svg에서 백터 이미지를 사용하는 방법은?
Flutter에서 flutter_svg
패키지는 벡터 이미지를 사용할 수 있는 매우 유용한 도구입니다. 여기에서는 flutter_svg
를 사용하여 어떻게 벡터 이미지를 표시하는지에 대해 알아보겠습니다.
1. flutter_svg
패키지 추가
먼저, pubspec.yaml
파일에 flutter_svg
패키지를 추가합니다.
dependencies:
flutter_svg: ^0.22.0
이후, 터미널에서 flutter pub get
명령어를 실행하여 패키지를 다운로드합니다.
2. 벡터 이미지 표시
다음으로, flutter_svg
를 사용하여 벡터 이미지를 화면에 표시할 수 있습니다.
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
class MyWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
child: SvgPicture.asset(
'assets/images/example.svg',
width: 200,
height:200,
),
);
}
}
위 코드에서 SvgPicture.asset
위젯을 사용하여 example.svg
파일을 로드하고 크기를 지정하여 화면에 나타냅니다.
3. 기타 설정
SvgPicture.asset
위젯을 통해 다양한 속성을 설정하여 벡터 이미지를 원하는 대로 표시할 수 있습니다. 자세한 내용은 flutter_svg 공식 문서를 참고하시기 바랍니다.
이제 flutter_svg
를 사용하여 Flutter 앱에서 간단하게 벡터 이미지를 표시할 수 있는 방법을 알아보았습니다.