fluttermoji 0.2.0 copy "fluttermoji: ^0.2.0" to clipboard
fluttermoji: ^0.2.0 copied to clipboard

outdated

A light-weight and highly customizable SVG graphic set for Flutter which generates avatars and provides a Customizer Widget, personalized CircleAvatar and other utility functions.

fluttermoji #

Pub Version Generic badge GitHub stars GitHub stars

A light-weight and highly customizable SVG graphic set for Flutter, which provides a Customizer Widget, CircleAvatar and other utility functions.

This package provides you two easy-to-use widgets -

Name Description Screenshot
FluttermojiCircleAvatar Use your fluttermoji anywhere in your Flutter app with a simple customizable widget. Supports material dark theme too. 1608830483994
FluttermojiCustomizer A complete personalization suit that offers previews of each individual component and a modern UI with material light and dark theme support. 1608827561239

Use the given utility functions to send and receive Fluttermoji data from your server/DB efficiently.

Function Prototype Description
String decodeFluttermojifromString(String encodedData) Decode your string containing the attributes to a SVG and render it by enclosing this string with a SvgPicture.string()
Future<Map> encodeMySVGtoMap() Retrieve the local user's fluttermoji attributes from local storage and encodes them to a Map of attributes and returns a Future, you have to await on function call.
Future<String> encodeMySVGtoString() Retrieve the local user's fluttermoji attributes from local storage and encodes them to a String containing a map of attributes and returns a Future, you have to await on function call.

SVG Assets used are derived from getavataaars.com .

Screenshots #

Example app #

Try out the demo on your Desktop Browser now

Use them in your games or social media apps

Usage Instructions #

  1. Depend on it by importing your package in the pubspec.yaml file.
    dependencies:
    	fluttermoji: any
    
  2. Add the following import to your .dart file
    import 'package:fluttermoji/fluttermoji.dart';
    
  3. Add the FluttermojiCircleAvatar widget to display your Fluttermoji where needed.
    FluttermojiCircleAvatar();
    
  4. To allow your users to personalize their Fluttermoji, add the following widget and pair it with the above one in your page.
    FluttermojiCustomizer();
    

That's all it takes, simple right ? The two widgets communicate with each other and update in real-time throughout your widget tree.

Usage Guidelines #

The package offers a ton of features in the simplest way possible, however there are some points worth noting.

  • FluttermojiCircleAvatar would render an avatar with the default set of options until customized and saved by the user.
  • FluttermojiCustomizer updates the preview in real-time however changes must be saved by tapping the Save icon built into the widget itself.
  • FluttermojiCustomizer uses a Scaffold whose height is set to 0.4*screen height by default, if you do not pass a value to the scaffoldHeight property make sure to place the widget properly.
  • If you plan on using FluttermojiCustomizer in Landscape mode, manually pass in the desired width for the widget in the scaffoldWidth property.
  • The Fluttermoji's attributes are saved to local app storage. Clearing app data would mean clearing these attributes as well.

Attributions #

Community #

If you find any issues or have some feedback, please raise the same on the GitHub repo or contact me directly. Share your creative implementation of Fluttermoji with me and I might feature them on this page. Do leave a thumbs up if you liked it.

Happy Fluttering ; )

258
likes
0
pub points
89%
popularity

Publisher

unverified uploader

A light-weight and highly customizable SVG graphic set for Flutter which generates avatars and provides a Customizer Widget, personalized CircleAvatar and other utility functions.

Repository (GitHub)
View/report issues

License

unknown (LICENSE)

Dependencies

flutter, flutter_svg, get, shared_preferences

More

Packages that depend on fluttermoji