fp_util

Description:

fp util

FPUtil #



Utilities and Extensions for num, BuildContext, EdgeInsets, File, String. Constants for horizontal and vertical spacing.
Social Buttons - Facebook, Google, Apple
Gradient Button
ImagePickerHelper for picking images and files


View full documentation

Constants #
Vertical Spacing

import 'package:flutter/material.dart';

class SpacingTest extends StatelessWidget {
const SpacingTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: const [

/// 4px vertical space
Sizes.gap4,

/// 8px vertical space
Sizes.gap8,

/// 12px vertical space
Sizes.gap12,

/// 16px vertical space
Sizes.gap16,

/// 24px vertical space
Sizes.gap24,

/// 32px vertical space
Sizes.gap32,

/// 48px vertical space
Sizes.gap48,

/// 54px vertical space
Sizes.gap54,

/// 64px vertical space
Sizes.gap64,
],
);
}
}
copied to clipboard
Horizontal Spacing

import 'package:flutter/material.dart';

class SpacingTest extends StatelessWidget {
const SpacingTest({super.key});

@override
Widget build(BuildContext context) {
return Row(
children: const [

/// 4px horizontal space
Sizes.gap4,

/// 8px horizontal space
Sizes.gap8,

/// 12px horizontal space
Sizes.gap12,

/// 16px horizontal space
Sizes.gap16,

/// 24px horizontal space
Sizes.gap24,

/// 32px horizontal space
Sizes.gap32,

/// 48px horizontal space
Sizes.gap48,

/// 54px horizontal space
Sizes.gap54,

/// 64px horizontal space
Sizes.gap64,
],
);
}
}
copied to clipboard
Extensions #
String Extensions

String text = 'hello world';

/// capitalize first letter of string
final capitalize = text.capitalize;

/// checks given string is null or empty
bool isNullOrEmpty = text.isNullOrEmpty;

/// checks given text is not null and not empty
bool isNotNullNotEmpty = text.isNotNullNotEmpty;

/// checks given string is blank
bool isBlank = text.isBlank;

/// checks given string os not blank
bool isNotBlank = text.isNotBlank;

/// checks string is email
bool isEmail = text.isEmail;


/// recase extensions

/// snakeCase
String snakeCase = text.snakeCase;

/// capitalize
String capitalize = text.capitalize;

/// camelCase
String camelCase = text.camelCase;


/// constantCase
String constantCase = text.constantCase;

/// sentenceCase
String sentenceCase = text.sentenceCase;

/// snakeCase
String snakeCase = text.snakeCase;

/// dotCase
String dotCase = text.dotCase;

/// paramCase
String paramCase = text.paramCase;

/// pathCase
String pathCase = text.pathCase;

/// pascalCase
String pascalCase = text.pascalCase;

/// headerCase
String headerCase = text.headerCase;

/// titleCase
String titleCase = text.titleCase;

/// lowercase
String lowercase = text.lowercase;

/// uppercase
String uppercase = text.uppercase;



/// returns default value is given string is blank
String withDefault = text.getOrDefault('default value');

/// return null if given string is nullOrEmpty
String? withNull = text.getOrNull();

/// checks string is valid phone number
bool isPhoneNumber = text.isValidPhoneNumber;

/// checks string is number
bool isNumeric = text.isNumeric;

/// removes whitespace from string
String removeWhiteSpace = text.removeWhiteSpace;

/// removes \n from string
String removeNextLine = text.removeNextLine;

/// converts to bool
bool? isBool = text.toBool;

/// converts to int
int? isInt = text.isInt;

/// converts to double
double? isDouble = text.toDouble;

/// check string is valid url
bool isUrl = text.isUrl;

/// check string is image path
bool isImage = text.isImage;

/// checks string is video path
bool isVideo = text.isVideo;

/// checks string is audio path
bool isAudio = text.isAudio;

/// checks string is pdf path
bool isPdf = text.isPdf;

/// checks string is text path
bool isText = text.isTxt;

/// checks string is office word file
bool isDocx = text.isDocx;

/// checks string is office excel
bool isXls = text.isXls;

/// checks string is office presentation file
bool isPpt = text.isPpt;

/// checks string is svg path
bool isSvg = text.isSvg;

/// checks string is xml file path
bool isXml = text.isXml;

/// checks string is file path
bool isFile = text.isFile;

copied to clipboard
Num Extensions #


gap()


Creates Gap with height or width according to its parent

###### Usage:

```dart
import 'package:flutter/material.dart';

class SpacingYTest extends StatelessWidget {
const SpacingYTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [
const Text('Text 1'),
10.gap(/*true if you want to use responsiveness*/),
const Text('Text 2'),
],
);
}
}

class SpacingXTest extends StatelessWidget {
const SpacingXTest({super.key});

@override
Widget build(BuildContext context) {
return Row(
children: [
const Text('Text 1'),
10.gap(/*true if you want to use responsiveness*/),
const Text('Text 2'),
],
);
}
}
copied to clipboard


Duration

microseconds
milliseconds
seconds
minutes
hours
days




/// Creates Duration on microseconds
final duration = 10.microseconds;

/// Creates Duration on milliseconds
final duration = 10.milliseconds;

/// Creates Duration on seconds
final duration = 10.seconds;

/// Creates Duration on minutes
final duration = 10.minutes;

/// Creates Duration on hours
final duration = 10.hours;

/// Creates Duration on days
final duration = 10.days;

copied to clipboard


Delayed Duration

delayedMicroSeconds()
delayedMilliSeconds()
delayedSeconds()
delayedMinutes()
delayedHours()




/// Creates Future of Duration on microseconds
final duration = 10.delayedMicroSeconds(()async{
// optional callback
});

/// Creates Future of Duration on milliseconds
final duration = 10.delayedMilliseconds(()async{
// optional callback
});

/// Creates Future of Duration on seconds
final duration = 10.delayedSeconds(()async{
// optional callback
});

/// Creates Future of Duration on minutes
final duration = 10.delayedMinutes(()async{
// optional callback
});

/// Creates Future of Duration on hours
final duration = 10.delayedHours(()async{
// optional callback
});


copied to clipboard


circularBorderRadius()


Created Circular Border Radius
import 'package:flutter/material.dart';

class RadiusTest extends StatelessWidget {
const RadiusTest({super.key});

@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
/// creates 10px rounded corner
borderRadius: 10.circularBorderRadius(/*true if you want to use responsiveness*/),
),
);
}
}
copied to clipboard


circularRadius()


Created Circular Radius
import 'package:flutter/material.dart';

class RadiusTest extends StatelessWidget {
const RadiusTest({super.key});

@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(

/// creates 10px rounded corner for topLeft and topRight
borderRadius: BorderRadius.only(topLeft: 10.circularRadius(/*true if you want to use responsiveness*/),
topRight: 10.circularRadius(/*true if you want to use responsiveness*/),),),
);
}
}
copied to clipboard


EdgeInsets

all()
padLeft()
padRight()
padTop()
padBottom()
padX()
padY()



import 'package:flutter/material.dart';

class EdgeInsetsTest extends StatelessWidget {
const EdgeInsetsTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [

/// creates padding with 10px all
Padding(padding: 10.all(/*true if you want to use responsiveness*/)),

/// creates padding with 10px top only
Padding(padding: 10.padTop(/*true if you want to use responsiveness*/)),

/// creates padding with 10px right only
Padding(padding: 10.padRight(/*true if you want to use responsiveness*/)),

/// creates padding with 10px bottom only
Padding(padding: 10.padBottom(/*true if you want to use responsiveness*/)),

/// creates padding with 10px left only
Padding(padding: 10.padLeft(/*true if you want to use responsiveness*/)),

/// creates padding with 10px horizontal
Padding(padding: 10.padX(/*true if you want to use responsiveness*/)),

/// creates padding with 10px vertical
Padding(padding: 10.padY(/*true if you want to use responsiveness*/)),
],
);
}
}

copied to clipboard


sliverVerticalSpace


Creates SizedBox with height converted to sliver
import 'package:flutter/material.dart';

class SliverSpaceY extends StatelessWidget {
const SliverSpaceY({super.key});

@override
Widget build(BuildContext context) {
return CustomScrollView(
slivers: [
SliverList(/*children*/),
10.sliverVerticalSpace(/*true if you want to use responsiveness*/),
SliverList(/*children*/)
],
);
}
}

copied to clipboard


sliverHorizontalSpace


Creates SizedBox with width converted to sliver

import 'package:flutter/material.dart';

class SliverSpaceX extends StatelessWidget {
const SliverSpaceX({super.key});

@override
Widget build(BuildContext context) {
return CustomScrollView(
scrollDirection: Axis.horizontal,
slivers: [
SliverPadding(padding: 10.all),
10.sliverHorizontalSpace(/*true if you want to use responsiveness*/),
SliverPadding(padding: 10.all),
],
);
}
}
copied to clipboard
Widget Extensions #


scrollable()


Make widgets scrollable
import 'package:flutter/material.dart';

class ScrollableTest extends StatelessWidget {
const ScrollableTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [
Text('Text 1'),
Text('Text 2'),
Text('Text 3'),
],
).scrollable();
}
}
copied to clipboard


clickable()


Make widgets clickable
import 'package:flutter/material.dart';

class ClickableTest extends StatelessWidget {
const ClickableTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [
Text('Text 1'),
Text('Text 2'),
Text('Text 3'),
],
).clickable(onTap: () {
/*
* onTap Callback
* */
},);
}
}
copied to clipboard


center()


Align widgets to center
import 'package:flutter/material.dart';

class CenterTest extends StatelessWidget {
const CenterTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [
Text('Text 1').center(),
Text('Text 2').center(),
Text('Text 3').center(),
],
);
}
}
copied to clipboard


Align

alignTopLeft()
alignTopCenter()
alignTopRight()
alignCenterLeft()
alignCenterRight()
alignBottomLeft()
alignBottomCenter()
alignBottomRight()



Create Align widgets

import 'package:flutter/material.dart';

class AlignTest extends StatelessWidget {
const AlignTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [

/// align top left
const Text('Text 1').alignTopLeft(),

/// align top center
const Text('Text 1').alignTopCenter(),

/// align top right
const Text('Text 1').alignTopRight(),

/// align center left
const Text('Text 1').alignCenterLeft(),

/// align center
const Text('Text 1').center(),

/// align center right
const Text('Text 1').alignCenterRight(),

/// align bottom left
const Text('Text 1').alignBottomLeft(),

/// align bottom center
const Text('Text 1').alignBottomCenter(),

/// align bottom right
const Text('Text 1').alignBottomRight(),
],
);
}
}
copied to clipboard


Padding

pad()
padX()
padY()
padLeft()
padTop()
padRight()
padBottom()
padLTRB()



Wraps with padding widget

import 'package:flutter/material.dart';

class PaddingTest extends StatelessWidget {
const PaddingTest({super.key});

@override
Widget build(BuildContext context) {
return Column(
children: [

/// wraps with all padding
const Text('Text 1').pad(10,responsive:true /* if you want to use responsiveness */),

/// wraps with left only padding
const Text('Text 1').padLeft(10,responsive:true /* if you want to use responsiveness */),

/// wraps with right only padding
const Text('Text 1').padRight(10,responsive:true /* if you want to use responsiveness */),

/// wraps with bottom only padding
const Text('Text 1').padBottom(10,responsive:true /* if you want to use responsiveness */),

/// wraps with top only padding
const Text('Text 1').padTop(10,responsive:true /* if you want to use responsiveness */),

/// wraps with horizontal padding
const Text('Text 1').padX(10,responsive:true /* if you want to use responsiveness */),

/// wraps width vertical padding
const Text('Text 1').padY(10,responsive:true /* if you want to use responsiveness */),

/// wraps widget with padding of left top right bottom
const Text('Text 1').padLTRB(left: 10,
top: 5, right: 10, bottom: 10,
responsive:true /* if you want to use responsiveness */
),

],
);
}
}
copied to clipboard
Context Extensions #


theme


colorScheme

primaryColor
onPrimaryColor
primaryContainerColor
onPrimaryContainerColor

/// secondary colors

secondaryColor
onSecondaryColor
secondaryContainerColor
onSecondaryContainerColor

/// tertiary color

tertiaryColor
onTertiaryColor
tertiaryContainerColor
onTertiaryContainerColor

/// surface color

surfaceColor
onSurfaceColor

/// surface variant color

surfaceVariantColor
onSurfaceVariantColor

/// inverse colors

inverseSurfaceColor
onInverseSurfaceColor

/// background color

backgroundColor
onBackgroundContainerColor

/// outline color

outlineColor
outlineVariantColor

/// error colors

errorColor
onErrorColor
errorContainerColor
onErrorContainerColor



textTheme

displayLarge
displayMedium
displaySmall
headlineLarge
headlineMedium
headlineSmall
titleLarge
titleMedium
titleSmall
labelLarge
labelMedium
labelSmall
bodyLarge
bodyMedium
bodySmall



size

width
height
percentWidth
percentHeight



Focus

removeFocus
hasFocus



EdgeInsets

padding
viewInsets
viewPadding



MediaQuery

mq



Responsive Value

responsiveValue



Platform Brightness

platformBrightness



Keyboard Height

keyboardHeight



final theme = context.theme;
final colorScheme = context.colorScheme;

/// display text styles
final displayLarge = context.displayLarge;
final displayMedium = context.displayMedium;
final displaySmall = context.displaySmall;

/// headline style
final headlineLarge = context.headlineLarge;
final headlineMedium = context.headlineMedium;
final headlineSmall = context.headlineSmall;

/// title style
final titleLarge = context.titleLarge;
final titleMedium = context.titleMedium;
final titleSmall = context.titleSmall;

/// label style
final labelLarge = context.labelLarge;
final labelMedium = context.labelMedium;
final labelSmall = context.labelSmall;

/// body style
final bodyLarge = context.bodyLarge;
final bodyMedium = context.bodyMedium;
final bodySmall = context.bodySmall;


/// colors
final Color primaryColor = context.primaryColor;
final Color onPrimaryColor = context.onPrimaryColor;
final Color primaryContainerColor = context.primaryContainerColor;
final Color onPrimaryContainerColor = context.onPrimaryContainerColor;

/// secondary colors
final Color secondaryColor = context.secondaryColor;
final Color onSecondaryColor = context.onSecondaryColor;
final Color secondaryContainerColor = context.secondaryContainerColor;
final Color onSecondaryContainerColor => colorScheme.onSecondaryContainer;

/// tertiary color
final Color tertiaryColor = context.tertiaryColor;
final Color onTertiaryColor = context.onTertiaryColor;
final Color tertiaryContainerColor = context.tertiaryContainerColor;
final Color onTertiaryContainerColor = context.onTertiaryContainerColor;

/// surface color
final Color surfaceColor = context.surfaceColor;
final Color onSurfaceColor = context.onSurfaceColor;

/// surface variant color
final Color surfaceVariantColor = context.surfaceVariantColor;
final Color onSurfaceVariantColor = context.onSurfaceVariantColor;

/// inverse colors
final Color inverseSurfaceColor = context.inverseSurfaceColor;
final Color onInverseSurfaceColor = context.onInverseSurfaceColor;

/// background color
final Color backgroundColor = context.backgroundColor;
final Color onBackgroundContainerColor = context.onBackgroundContainerColor;

/// outline color
final Color outlineColor = context.outlineColor;
final Color outlineVariantColor = context.outlineVariantColor;

/// error colors
final Color errorColor = context.errorColor;
final Color onErrorColor = context.onErrorColor;
final Color errorContainerColor = context.errorContainerColor;
final Color onErrorContainerColor = context.onErrorContainerColor;


/// sizes
final width = context.width;
final height = context.height;

/// 1% of screen width
final widthPercentage = context.pw(.1);

/// 1% of screen height
final heightPercentage = context.ph(.4);

/// remove focus / hide keyboard
context.removeFocus();

/// check is keyboard is open
context.hasFocus;

/// padding
/// The parts of the display that are partially obscured by system UI,
/// typically by the hardware display "notches" or the system status bar.
/// for more check [MediaQuery.paddingOf(context)]
context.padding;

/// view insets
/// The parts of the display that are completely obscured by system UI,
/// typically by the device's keyboard.
/// for more check [MediaQuery.viewInsetsOf(context)]
context.viewInsets;

/// view padding
/// The parts of the display that are partially obscured by system UI,
/// typically by the hardware display "notches" or the system status bar.
/// for more check [MediaQuery.viewPaddingOf(context)]
context.viewPadding;

/// media query
context.mq;

/// platform brightness
/// returns platform brightness using [MediaQuery.platformBrightnessOf(context)]
context.platformBrightness


/// keyboard height
/// returns the space occupied by keyboard i.e. [MediaQuery.viewInsetsOf(context).bottom]
context.keyboardHeight


/// responsive value according to device type
final rValue = context.responsiveValue<double>(10,desktop:30,tablet:20);

copied to clipboard
FPSnackbar #
Singleton class for showing Snackbar


Global Properties #

defaultStyle
successStyle
errorStyle
warningStyle
infoStyle
duration (defaults 3 seconds)
floating (defaults true)
centerText (defaults false)
contextMaxLines (defaults 2)



you can change global properties using FPSnackbar.instance.propertyName = value


Variants #


Success
Snackbar for success messages
FPSnackbar.success(
context,
title: 'Title',
message: 'User created successfully',
);
copied to clipboard


Error
Snackbar for error messages
FPSnackbar.error(
context,
title: 'Title',
message: 'Something went wrong!',
);
copied to clipboard




Info
Snackbar for info messages
FPSnackbar.info(
context,
title: 'Title',
message: 'Some informative message',
);
copied to clipboard


Warning
Snackbar for warning messages
FPSnackbar.warning(
context,
title: 'Title',
message: 'Warning message',
);
copied to clipboard


Default
Default Snackbar
FPSnackbar.show(
context,
title: 'Create User',
message: 'message',
);
copied to clipboard