hasnain_ui_button 0.0.5

A customizable button widget package for Flutter applications

About Me

I am shamim hasnain (shadid), a Flutter & React developer with a passion for creating reusable UI components. I have created this package to help you create beautiful and customizable buttons for your Flutter applications.

Hasnain UI Button

A customizable Flutter button package that provides various button styles and variants with extensive customization options.

Features

• Multiple button variants (Solid, Outline, Destructive)
• Customizable width and height
• Custom background colors
• Border customization for outline variant
• Border radius customization
• Text style customization
• Disabled state support

Installation

Add this to your package's pubspec.yaml file:

dependencies:
  hasnain_ui_button: ^0.0.5

Then run:

flutter pub get

Usage

First, import the package:

import 'package:hasnain_ui_button/hasnain_ui_button.dart';

Example

Basic Usage

Button(
  text: 'Click me',
  onPressed: () {
    print('Button pressed');
  },
)

Button Variants

Outline Button

Button(
  variant: ButtonVariant.outline,
  text: 'Outline Button',
  onPressed: () {},
)

Solid Button

Button(
  variant: ButtonVariant.solid,
  text: 'Solid Button',
  onPressed: () {},
)

Destructive Button

Button(
  variant: ButtonVariant.destructive,
  text: 'Destructive Button',
  onPressed: () {},
)

Customization Examples

Custom Colors and Size

Button(
  text: 'Custom Button',
  backgroundColor: Colors.teal,
  width: 150,
  height: 50,
  onPressed: () {},
)

Custom Border

Button(
  variant: ButtonVariant.outline,
  text: 'Custom Border',
  borderSide: BorderSide(color: Colors.red, width: 2),
  onPressed: () {},
)

Custom Text Style

Button(
  text: 'Styled Text',
  textStyle: TextStyle(
    color: Colors.redAccent,
    fontWeight: FontWeight.bold,
    fontSize: 18,
  ),
  onPressed: () {},
)

Disabled Button

Button(
  text: 'Disabled',
  isDisabled: true,
  onPressed: () {},
)

Primary Color

 Button(
  text: 'primary',
  onPressed: () {},
  backgroundColor: colorScheme.primary,
  height: 40,
  width: 100,
  ),

Secondary Color

 Button(
  text: 'secondary',
  onPressed: () {},
  backgroundColor: colorScheme.secondary,
  height: 40,
  width: 100,
  ),

Properties

Property	Type	Description
text	String	The button's label text
onPressed	VoidCallback	Function called when button is pressed
variant	ButtonVariant	Button style variant (solid, outline, destructive)
width	double?	Custom button width
height	double?	Custom button height
backgroundColor	Color?	Custom background color
borderSide	BorderSide?	Custom border properties for outline variant
borderRadius	BorderRadius?	Custom border radius
isDisabled	bool?	Whether the button is disabled
textStyle	TextStyle?	Custom text style

Additional Information

• Requires Flutter SDK: >=3.0.0
• Supports both Material 2 and Material 3
• Platform Support: Android, iOS, Web, Windows, macOS, Linux

License

This project is licensed under the MIT License - see the LICENSE file for details.