Software

Flutter | Svg

March 17, 20211 min read

Öncelikle, Flutter ana sürümü svg desteklemiyor.flutter_svg kütüphanesini kullanacağız. (https://pub.dev/packages/flutter_svg)pubspec.yaml tanımlaması:flutter_svg: 0.21.0-nullsafety.0dosyaya import:import 'package:flutter_svg/flutter_svg.dart';Ana klasörümüzün içerisine assets klasörünü oluşturup içerisine svg dosyamızı ekliyoruz. Oluşturduğumuz klasörü pubspec.yaml dosyasında hedef gösteriyoruz:assets: - assets/Kullanım Şekilleri:// AssetSvgPicture.asset('assets/sample.svg',)// NetworkSvgPicture.network('https://raw.githubusercontent.com/dnfield/flutter_svg/master/example/assets/deborah_ufw/new-camera.svg',placeholderBuilder: (BuildContext context) => Container(child: const CircularProgressIndicator()),)// StringSvgPicture.string('''<svg xmlns="http://www.w3.org/2000/svg" width="16.354" height="52.332" viewBox="0 0 16.354 52.332"><path d="M17.479,44.155A8.177,8.177,0,1,1,9.3,35.978,8.186,8.186,0,0,1,17.479,44.155ZM2.071,2.576l1.39,27.8a2.453,2.453,0,0,0,2.45,2.33h6.781a2.453,2.453,0,0,0,2.45-2.33l1.39-27.8A2.453,2.453,0,0,0,14.082,0H4.521A2.453,2.453,0,0,0,2.071,2.576Z" transform="translate(-1.125)" fill="#e6493d"/></svg>''',)Notlar:• Nullsafety desteği için flutter sdk minimum 2.12.0 olmalıdır.• pubspec.yaml dosyası güncellemelerinden sonra Pub get butonuna tıklamayı unutmayın.• Svg dosyasını okumakla alakalı sorunlar olabilir. (Android Studio) File -> Invalidate Caches/Restart yaparsanız düzelecektir.