super_profile_picture 1.0.0 copy "super_profile_picture: ^1.0.0" to clipboard
super_profile_picture: ^1.0.0 copied to clipboard

A customizable Flutter widget for displaying profile pictures, supporting both image and text options.

logo

License: MIT pub package GitHub popularity version

A customizable Flutter widget for displaying profile pictures, supporting both image and text options. It will show label text in case the image is not provided or fails to load. You can use any image provider, such as NetworkImage, AssetImage, and more, to display the image.

Live Demo & Experiment Page #

Live demo: Demo & Experiment site

Installation #

i. Add the latest version of this package to your pubspec.yaml file, and run: 'dart pub get':

dependancies:
  super_profile_picture: ^1.0.0

ii. Import the package in your Flutter App and use it.

import 'package:super_profile_picture/super_profile_picture.dart';

Note #

The background color will be set according to the first letter of the label. Customization of the background color is not currently supported but may be added in the future.

Code Sample #

Default #

Screenshot_161 Screenshot_160

SuperProfilePicture(
    label: "Super Profile Picture",
    radius: 30,
);
SuperProfilePicture(
    label: "Super Profile Picture",
    radius: 30,
    image: NetworkImage("https://picsum.photos/200/300.jpg"),

);

Max Label Length #

Screenshot_162


SuperProfilePicture(
    label: "Super Profile Picture",
    radius: 30,
    textDecorationProperties: TextDecorationProperties(
         maxLabelLength: 3,  
    ),
);

Empty Name / Blank #

Screenshot_163

SuperProfilePicture(
    label: "",
    radius: 30,
);

With Border #

Screenshot_164 Screenshot_165

SuperProfilePicture(
    label: "Super Profile Picture",
    radius: 30,
    border: Border.all(width: 6, color: Colors.blue),
);
SuperProfilePicture(
    label: "Super Profile Picture",
    radius: 30,
    image: NetworkImage("https://picsum.photos/200/300.jpg"),
    border: Border.all(width: 6, color: Colors.blue),

);

Properties #

  • label
  • radius
  • textDecorationProperties
    • fontSize;
    • maxLabelLength;
    • useFittedBox;
    • fontColor;
    • fontWeight;
    • letterSpacing;
    • padding;
    • fontStyle;
  • imageDecorationProperties
    • frameBuilder;
    • loadingBuilder;
    • errorBuilder;
    • semanticLabel;
    • excludeFromSemantics;
    • width;
    • height;
    • color;
    • opacity;
    • colorBlendMode;
    • fit;
    • alignment;
    • repeat;
    • centerSlice;
    • matchTextDirection;
    • gaplessPlayback;
    • isAntiAlias;
    • filterQuality;
  • border
  • borderRadius
  • image
  • clipBehavior

Future Tasks #

  • Add customizable background color function.
11
likes
160
points
58
downloads

Publisher

unverified uploader

Weekly Downloads

A customizable Flutter widget for displaying profile pictures, supporting both image and text options.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on super_profile_picture