avatar_better 0.0.7 avatar_better: ^0.0.7 copied to clipboard
This is a complete avatar package that you can use for your profile and avatar.
This is a complete avatar package that you can use for your profile and avatar
Features #
Features:
✔️ Initial Text: Displaying initial text for avatars or placeholders.
✔️ Random Colors: Generating random colors for various elements.
✔️ Random Linear Gradient: Generating random linear gradient colors.
✔️ Avatar Profile: Creating avatars for profiles or user representation.
✔️ Border Avatar: create a border around the avatar .
✔️ gradient Width Border: Create a gradient color for the borders .
✔️ Use ImageAssets .
✔️ Use ImageNetwork .
Getting started #
dependencies:
avatar_better: ^0.0.7
How to use #
import 'package:avatar_better/avatar_better.dart';
How to install #
Android #
- To request permissions from the user, you can use the following code: AndroidManifest.xml.
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
- Add this line code to application AndroidManifest.xml
android:requestLegacyExternalStorage="true"
<application
android:label="avaterbetter"
android:name="${applicationName}"
android:icon="@mipmap/ic_launcher"
android:requestLegacyExternalStorage="true">
- Add UCropActivity into your AndroidManifest.xml
<activity
android:name="com.yalantis.ucrop.UCropActivity"
android:screenOrientation="portrait"
android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>
iOS #
<key>NSPhotoLibraryUsageDescription</key>
<string>We need access to your photo library to select images for editing.</string>
<key>NSCameraUsageDescription</key>
<string>We need access to your camera to take photos for editing.</string>
macOS installation
Since the macOS implementation uses file_selector
, you will need to
add a filesystem access
entitlement:
<key>com.apple.security.files.user-selected.read-only</key>
<true/>
Web #
- Add following codes inside
<head>
tag in fileweb/index.html
:
<head>
....
<!-- cropperjs -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.6.2/cropper.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.6.2/cropper.min.js"></script>
....
</head>
example #
Avatar(
/// With this function, you can display page shift or page view in a personalized way.
onTapAvatar: () {},
radius: 35,
text: avatar[index],
randomGradient: true,
randomColor: false,
imageNetwork:
"https://images.unsplash.com/photo-1616731948638-b0d0befef759?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
/// By activating this option, the user can see the avatar images in the page view
showPageViewOnTap: true,
),
Avatar.profile(
radius: 35,
text: avatar[index],
randomGradient: true,
randomColor: false,
),
Buy me a cup of coffee for 5$.
Additional information #
If you have any issues, questions, or suggestions related to this package, please feel free to contact us at swan.dev1993@gmail.com. We welcome your feedback and will do our best to address any problems or provide assistance. For more information about this package, you can also visit our GitHub repository where you can find additional resources, contribute to the package's development, and file issues or bug reports. We appreciate your contributions and feedback, and we aim to make this package as useful as possible for our users. Thank you for using our package, and we look forward to hearing from you!