LMFeedProfilePicture

LMFeedProfilePicture is a customizable widget designed for displaying profile pictures within the Flutter UI library. It supports displaying images from a URL or displaying initials as a fallback when an image is not available. Additionally, it provides various styling options and tap functionality.

The LMFeedProfilePicture widget offers a flexible way to display profile pictures or initials in a consistent and visually appealing manner throughout your application. It allows you to customize the appearance of the profile picture, including size, border radius, border width, background color, and text style for initials.

Properties

• imageUrl (String)

An optional URL string representing the image to be displayed as the profile picture.

• fallbackText (String)

A required string that will be used to display initials as a fallback when an image is not available.

• onTap (Function())

An optional callback function that is invoked when the profile picture is tapped.

• style (LMFeedProfilePictureStyle)

An optional style class that allows customization of the profile picture's appearance, such as size, border radius, border width, background color, and text style for initials.

Styling

The LMFeedProfilePictureStyle class provides a way to define the visual style of the profile picture. It includes properties for size, border radius, border width, background color, box shape, and text style for initials.

Customization variables

Property	Type	Description	Required	Default
size	double	Size of the profile picture (height and width)		48.0
fallbackTextStyle	LMFeedTextStyle	Text style for initials when an image is not available
borderRadius	double	Border radius of the profile picture		24.0
border	double	Border width of the profile picture
backgroundColor	Color	Background color of the profile picture
boxShape	BoxShape	Shape of the profile picture container		BoxShape.circle

Usage Example

LMFeedProfilePicture(
  imageUrl: 'https://example.com/profile.jpg',
  fallbackText: 'John Doe',
  onTap: () {
    // Handle profile picture tap
  },
  style: LMFeedProfilePictureStyle(
    size: 64,
    borderRadius: 32,
    border: 2,
    backgroundColor: Colors.grey.shade300,
    fallbackTextStyle: LMFeedTextStyle(
      textStyle: TextStyle(
        color: Colors.black,
        fontSize: 32,
        fontWeight: FontWeight.bold,
      ),
    ),
  ),
),

This example creates an LMFeedProfilePicture widget that displays an image from the provided URL. If the image is not available, it will display the initials "JD" (for "John Doe") as a fallback. The profile picture is styled with a size of 64 pixels, a border radius of 32 pixels, a border width of 2 pixels, and a light grey background color. The initials are displayed with a black color, a font size of 32 pixels, and bold font weight. When tapped, it triggers the onTap callback function, allowing you to handle the profile picture's action.