How to use custom icons inĀ Flutter
It's easy, thanks to the creators of FlutterIcon and Fontelloš
Read the Medium article here
How it works
The custom icons will be converted into a ttf font file, which will be added into the project. An automatically generated Dart file will be added, allowing icons to be used like Icon(CustomCons.upvote).
- Go to FlutterIcon.com
- Click on the icons that you want, upload custom SVG files, font-files, or JSON files
- Insert your own name like 'Custom', 'Icecons' etc.
- Click 'Download' and extract files
- The config.json is absolute genius, it saves all your selections and custom icons, so when you revisit the website just drag and drop it in and it's all there again.
- Move the ttf file into your desired directory (e.g. fonts/CustomIcons.ttf)
- Move the dart file into your desired directory in lib (I did lib/presentation/custom_icons_icons.dart )
- Follow the instructions at the top of your dart file and copy the fonts code into pubspec.yml (I put mine underneath flutter: uses-material-design)
flutter run to ensure project compiles and app starts expectedly - Use your icon!
- Party š
Tabs Example:
import CustomIcons from '../lib/presentation/custom_icons_icons.dart'
Tab(icon: Icon(CustomIcons.heart)
Here I've imported my dart class as CustomIcons and used the heart in a tab. In IntelliJ, you can write the code first, then Alt-Enter on CustomIcons and it will add the correct relative path for the import for you.
For more information like, how to create your own icons using Illustrator, import/export fonts visit the full wiki: https://github.com/ilikerobots/polyicon/wiki/Help
Coding is not just about features, it's also about Collaboration.
Happy Coding!
Hi! I am a robot. I just upvoted you! I found similar content that readers might be interested in:
https://medium.com/flutterpub/how-to-use-custom-icons-in-flutter-834a079d977
Congratulations @psyanite! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :
Click here to view your Board
If you no longer want to receive notifications, reply to this comment with the word
STOP
Hello @psyanite! This is a friendly reminder that you have 3000 Partiko Points unclaimed in your Partiko account!
Partiko is a fast and beautiful mobile app for Steem, and itās the most popular Steem mobile app out there! Download Partiko using the link below and login using SteemConnect to claim your 3000 Partiko points! You can easily convert them into Steem token!
https://partiko.app/referral/partiko
Congratulations @psyanite! You received a personal award!
You can view your badges on your Steem Board and compare to others on the Steem Ranking
Vote for @Steemitboard as a witness to get one more award and increased upvotes!