Super Profile Card Package

MIT License


Introducing a custom-designed Flutter package, this artistic masterpiece is set to redefine the elegance and aesthetics of your profile pages. Meticulously crafted to infuse a personal touch into your profile cards, this custom painting package is engineered to create an unforgettable user experience, effortlessly capturing their attention. 🌈

The journey begins with a strikingly elegant circle strategically positioned at the pinnacle of your profile card. Expertly designed shadows surrounding this circle not only introduce depth to your profile but also infuse a sense of modernity and contemporaneity. The versatility provided by parameters such as shadow color, offset value, and blur intensity in the overall card design allows for a complete and nuanced personalization of your profile's atmosphere. 🎨💖

Consider this package as the quintessential element for your profile pages; it doesn't just offer a visual spectacle but actively prompts users to engage more profoundly with your profile. If you're seeking a profile card that stands out with both elegance and intricate details, this package equips you with the precise tools you need. Tailored to make your profile experience not only unique but also leave an indelible and lasting impression, rest assured that users encountering your profile won't be able to resist exclaiming "Wow!" in sheer amazement. 🚀✨💯

In a world where first impressions matter, this package ensures that your profile becomes a captivating and memorable focal point, inviting users to explore and appreciate the artistry embedded within. 🌟👁️✨

Property and Value

Property Value
gradientColors List
iconsColor Color 🎨
bottomImageUrl String (URL) 🔗
bottomImageColor Color 🌈
bottomImageWidth double 📏
topImageUrl String (URL) 🔗
topImageColor Color 🌈
topImageWidth double 📏
logoImageUrl String (URL) 🔗
logoImageColor Color 🌈
topText String 📝
topTextStyle TextStyle ✒️
firstIcon, secondIcon, thirdIcon IconData 👤🔍📅
firstIconText, secondIconText, thirdIconText String 📝
iconsTextColor Color 🌈
dividerColor Color 🌈
shadowColor Color 🌈
shadowOffset double 📏
topCircleColor Color 🌈
bulurSigmaValue double 📏

Property and Description

Property Description
gradientColors List of gradient colors used for the background.
iconsColor Main color used for icon colors.
bottomImageUrl URL of the image used in the bottom section.
bottomImageColor Background color of the bottom image.
bottomImageWidth Width of the bottom image.
topImageUrl URL of the image used in the top section.
topImageColor Background color of the top image.
topImageWidth Width of the top image.
logoImageUrl URL of the logo image.
logoImageColor Background color of the logo image.
topText Text displayed in the top section.
topTextStyle Text style used for the top text.
firstIcon, secondIcon, thirdIcon First, second, and third icons.
firstIconText, secondIconText, thirdIconText Texts associated with the first, second, and third icons.
iconsTextColor Icon text colors.
dividerColor Color of the divider line.
shadowColor Color of the shadow.
shadowOffset Shadow offset value.
topCircleColor Color of the top circle.
bulurSigmaValue Amount of blur sigma.

Versions

Versions Version
Flutter 3.15.0
Dart 3.1.0

Support

Support Version
Android SDK 16+
iOS 11.0+
Web Any*

Constructor

final List<Color> gradientColors;
  final Color iconsColor;
  final String bottomImageUrl;
  final Color bottomImageColor;
  final double bottomImageWidth;
  final String topImageUrl;
  final Color topImageColor;
  final double topImageWidth;
  final String logoImageUrl;
  final Color logoImageColor;
  final String topText;
  final TextStyle topTextStyle;
  final IconData firstIcon;
  final IconData secondIcon;
  final IconData thirdIcon;
  final String firstIconText;
  final String secondIconText;
  final String thirdIconText;
  final Color iconsTextColor;
  final Color dividerColor;
  final Color shadowColor;
  final double shadowOffset;
  final Color topCircleColor;
  final double bulurSigmaValue;

Example

import 'package:flutter/material.dart';
import 'package:super_profile_card_package/profile_card.dart';


class HomeView extends StatelessWidget {
  const HomeView({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color.fromARGB(255, 57, 57, 57),
      appBar: AppBar(
        centerTitle: true,
        backgroundColor: const Color.fromARGB(255, 41, 204, 232),
        title: const Text(
          "Super Profile Card",
          style: TextStyle(
            color: Colors.black,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
      body: const SuperProfileCard(
        // colors for card body
        gradientColors: [
          Color.fromARGB(255, 41, 204, 232),
          Color.fromARGB(255, 41, 204, 232),
          Color.fromARGB(255, 41, 204, 232),
          Color.fromARGB(255, 0, 0, 0),
          Color.fromARGB(255, 41, 204, 232),
        ],
        //icon
        //top
        topCircleColor: Color.fromARGB(255, 1, 1, 1),
        shadowColor: Colors.black,
        shadowOffset: 38.0,
        bulurSigmaValue: 10.0,
        //topImage
        topImageUrl:
            'https://github.com/NurhayatYurtaslan/super_profile_card/blob/main/assets/image/png/nine.png?raw=true',
        topImageColor: Color.fromARGB(255, 41, 204, 232),
        topImageWidth: 1.2,
        //logo Image
        logoImageUrl:
            'https://github.com/NurhayatYurtaslan/super_profile_card/blob/main/assets/image/png/logo.png?raw=true',
        logoImageColor: Color.fromARGB(255, 41, 204, 232),
        //Top Text
        topText: 'Super Profile Card',
        topTextStyle: TextStyle(
          color: Color.fromARGB(255, 41, 204, 232),
          fontSize: 25,
          fontWeight: FontWeight.bold,
        ),
        //bottomImage
        bottomImageUrl:
            'https://github.com/NurhayatYurtaslan/super_profile_card/blob/main/assets/image/png/ten.png?raw=true',
        bottomImageColor: Colors.black,
        bottomImageWidth: 0.80,
        //Icons
        iconsColor: Colors.black,
        firstIcon: Icons.link,
        secondIcon: Icons.email,
        thirdIcon: Icons.location_on,
        iconsTextColor: Colors.black,
        firstIconText: "First Icon's Text",
        secondIconText: "Secon Icon's Text",
        thirdIconText: "Third Icon's Text",
        dividerColor: Colors.black,
      ),
    );
  }
}

Contributors

Supporting

📝 License

Copyright © 2023 Nurhayat Yurtaslan.