ready_widgets

Platform

A Flutter package offering a collection of reusable, customizable widgets to streamline UI development with minimal setup and no third-party dependencies. This package includes buttons, inputs, avatars, network images, shimmer effects, and more.

🚀 Installation

Add ready_widgets to your pubspec.yaml dependencies:

dependencies:
  ready_widgets: ^latest_version

Then run:

flutter pub get

Import the package in your Dart file:

import 'package:ready_widgets/ready_widgets.dart';

📚 Widgets and Usage

🔘 Buttons

1. ReadyTextButton

A flexible text button with solid, outlined, or transparent styles, supporting icons and customizable sizes.

Example: Basic Transparent Button

ReadyTextButton(
  text: 'Click Me',
  onPress: () => print('Pressed!'),
),

Example: Solid Button with Icon

ReadyTextButton.solid(
  text: 'Submit',
  icon: Icons.check,
  iconPosition: IconPosition.leading,
  backgroundColor: Colors.blue,
  textColor: Colors.white,
  size: ReadyButtonSize.large,
),

Example: Outlined Button

ReadyTextButton.outlined(
  text: 'Cancel',
  borderColor: Colors.red,
  onPress: () => print('Cancelled!'),
),

2. ReadyLikeButton

A toggleable like button with animation, supporting solid, outlined, or transparent styles.

Example: Default Like Button

ReadyLikeButton(
  onPress: (isLiked) async {
    await Future.delayed(Duration(milliseconds: 500));
    return !isLiked;
  },
),

Example: Solid Like Button

ReadyLikeButton.solid(
  color: Colors.red,
  iconColor: Colors.white,
  size: ReadyButtonSize.large,
  isLiked: true,
),

3. ReadyIconButton

An icon-only button with support for badges, tooltips, and rounded or rectangular shapes.

Example: Basic Icon Button

ReadyIconButton(
  iconData: Icons.favorite_border,
  onPress: () => print('Icon pressed!'),
  tooltip: 'Favorite',
),

Example: Solid Icon Button with Badge

ReadyIconButton.solid(
  iconData: Icons.notifications,
  backgroundColor: Colors.blue,
  badge: 5,
  size: ReadyButtonSize.large,
),

4. ReadyElevatedButton

A customizable elevated button with optional icons and predefined size variants.

Example: Default Elevated Button

ReadyElevatedButton(
  text: 'Submit',
  onPress: () => print('Submitted!'),
),

Example: Small Button with Icon

ReadyElevatedButton.small(
  text: 'Save',
  icon: Icons.save,
  backgroundColor: Colors.green,
  textColor: Colors.white,
),

⌨️ Inputs

5. ReadyInput

A customizable text input field with support for prefix/suffix icons, validation, and decoration styles.

Example: Basic Input

ReadyInput(
  label: 'Name',
  hint: 'Enter your name',
  controller: TextEditingController(),
),

Example: Password Input

ReadyInput(
  label: 'Password',
  hint: 'Enter your password',
  isObscure: true,
  prefixIcon: Icon(Icons.lock),
),

6. ReadyPhoneInput

A phone number input with a country code picker and localized country names.

Example: Basic Phone Input

ReadyPhoneInput(
  controller: TextEditingController(),
  onCountryChange: (country) => print('Selected: ${country.name}'),
  initialDialCode: '+1',
),

Example: Phone Input with Validation

ReadyPhoneInput(
  controller: TextEditingController(),
  onCountryChange: (country) => print('Country: ${country.dialCode}'),
  validator: (value) =>
      value!.length < 10 ? 'Phone number too short' : null,
),

7. ReadyEmptyWidget

A widget for empty states with an animated icon, title, subtitle, and optional additional widget.

Example: Basic Empty State

ReadyEmptyWidget(
  title: 'No Data Found',
  subtitle: 'Try adding some items.',
  icon: Icons.info_outline,
),

Example: Custom Empty State with Button

ReadyEmptyWidget(
  title: 'Empty List',
  subtitle: 'Start by adding a new item.',
  customIcon: Icon(Icons.error, size: 40, color: Colors.red),
  additionalWidget: ReadyElevatedButton(
    text: 'Add Item',
    onPress: () => print('Add item pressed!'),
  ),
),

🖼️ Network Image

8. ReadyNetworkImage

A network image widget with shimmer loading and error handling.

Example: Basic Network Image

ReadyNetworkImage(
  imageUrl: 'https://example.com/image.jpg',
  width: 100,
  height: 100,
),

Example: Rounded Image with Custom Error

ReadyNetworkImage(
  imageUrl: 'https://example.com/invalid.jpg',
  width: 120,
  height: 120,
  isRounded: true,
  borderColor: Colors.blue,
  borderWidth: 2,
  errorWidget: Icon(Icons.error, size: 40),
),

✨ Shimmer

9. ReadyShimmer

A dependency-free shimmer effect for loading placeholders.

Example: Basic Shimmer

ReadyShimmer(
  width: 200,
  height: 100,
),

Example: Custom Shimmer Colors

ReadyShimmer(
  width: 150,
  height: 150,
  borderRadius: BorderRadius.circular(16),
  shimmerColors: [Colors.blue.shade200, Colors.blue.shade50, Colors.blue.shade200],
),

👤 Avatar

10. ReadyAvatar

An avatar widget displaying a network image or initials, with an optional online status indicator.

Example: Basic Avatar

ReadyAvatar(
  imageUrl: 'https://example.com/avatar.jpg',
  size: 60,
),

Example: Initials Avatar with Online Indicator

ReadyAvatar(
  name: 'John Doe',
  isOnline: true,
  size: 80,
  backgroundColor: Colors.blue,
  textColor: Colors.white,
),

📖 Read More

11. ReadyReadMoreText

A widget for trimming long text with "Read more" and "Read less" toggle links.

Example: Basic Read More

ReadyReadMoreText(
  text: 'This is a very long text that needs to be truncated because it exceeds the maximum number of lines allowed.',
  maxLines: 2,
),

Example: Length-Based Trimming

ReadyReadMoreText(
  text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
  trimMode: TrimMode.length,
  trimLength: 50,
  moreLessStyle: TextStyle(color: Colors.red, fontWeight: FontWeight.bold),
),

🛠️ Features

No Third-Party Dependencies: Lightweight and built with Flutter's core libraries.
Customizable: Extensive styling options for colors, sizes, icons, and more.
Responsive: Adapts to different screen sizes and orientations.
Platform Support: Works on all Flutter-supported platforms (iOS, Android, web, etc.).
Interactive: Includes animations (e.g., shimmer, like button scale) and interactive elements (e.g., country picker, read more links).

☕ Support the Developer

If you find ready_widgets helpful, consider supporting the developer:

📝 Notes

Documentation: Check the ready_widgets page on pub.dev for the latest version and additional details.
Versioning: Always use the latest version in pubspec.yaml to access new features and fixes.
Contributions: Contributions, issues, and feature requests are welcome on the package's GitHub repository.