grock 0.3.1 grock: ^0.3.1 copied to clipboard
Snackbar, Toast, No Context Extension, Custom Widgets, Widget Extensions, Fast Tools, IOS Style Widget and Tools.
This is Grock #
This is an excellent Flutter package mate π―π―π―π―π―π―π―π―π―π―π―π―π―π―π―
Firstly π€« #
return MaterialApp(
debugShowCheckedModeBanner: false,
navigatorKey: Grock.navigationKey, // added line
scaffoldMessengerKey: Grock.scaffoldMessengerKey, // added line
title: 'Material App',
home: Home(),
);
NO CONTEXT NAVΔ°GATΔ°ONS π± #
Grock.to || toRemove || back() #
GrockContainer(
onTap: (){
// for Navigator.push(...)
Grock.to(Nextpage());
Grock.to(NextPage(), type: NavType.bottomToTop); // optional navigate animation
// for Navigator.pushAndRemoveUntil(context, newRoute, (route) => false)
Grock.toRemove(NextPage());
// for Navigator.of(context).pop()
Grock.back();
Grock.back(result: "Return Object") // optional return object
},
)
Widgets π π #
GrockContainer #
GrockContainer(
isKeyboardDismiss: true // default true, optional keyboard dismiss
isTapAnimation: true //default true, optional tap animation
onTap: ()=>print("tapped"),
child: Text("On Tap Container")
)
GrockButton #
GrockButton(
child: const Text("GrockButton"),
onTap: (){},
),
GrockFullScreenDialog #
InkWell(
onTap: (){
Grock.fullScreenDialog(
child: Scaffold(
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
actions: [
/// Close Grock Full Screen Dialog
IconButton(
icon: const Icon(Icons.close),
onPressed: ()=>Grock.closeGrockOverlay(),
)
],
),
body: Center(
child: const Image.network('https://picsum.photos/250?image=9'),
),
)
);
},
child: const Image.network('https://picsum.photos/250?image=9'),
),
GrockFullScreenModal #
InkWell(
onTap: (){
Navigator.of(context).push(
GrockFullScreenModalSheet(
builder: (context, animation, secondaryAnimation) => Container(
color: Colors.white,
alignment: Alignment.topRight,
width: double.infinity,
height: double.infinity,
child: Scaffold(
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
actions: [
/// Close Grock Full Screen Modal
IconButton(
icon: const Icon(Icons.close),
onPressed: ()=>Grock.back(),
)
],
),
body: Column(
children: [
TextField(
decoration: const InputDecoration(
hintText: "Search",
border: OutlineInputBorder(),
),
),
const SizedBox(height: 20),
Expanded(
child: ListView.builder(
itemCount: 20,
itemBuilder: (context, index) => ListTile(
title: Text("List Item $index"),
),
),
),
],
),
),
),
isFadeTranssition: true,
isSlideTranssition: true,
),
);
},
child: const Image.network('https://picsum.photos/250?image=9'),
),
GrockDirectSelectionMenu #
GrockDirectSelectionMenu(
width: double.infinity,
margin: const EdgeInsets.all(20),
hintText: "Selection Data",
value: listActiveIndex,
onChanged: (index) {
setState(() {
listActiveIndex = index;
});
},
items: List.generate(
list.length,
(index) => Text(list[index]),
),
/// [Customize your own widget]
// child: Row(
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
// children: [
// Text(listActiveIndex == null ? "Please selection data" : list[listActiveIndex!]),
// listActiveIndex == null ? const Icon(Icons.menu) : Text(list[listActiveIndex ?? 0])
// ],
// ),
),
GrockTimer #
/// final timerController = GrockTimerController();
GrockTimer(
controller: timerController,
startTime: const Duration(seconds: 10),
endTime: const Duration(seconds: 0),
),
GrockMenu [IOS Style] #
GrockMenu(
items: [
GrockMenuItem(
text: 'Copy',
trailing: const Icon(Icons.copy,size: 20,),
onTap: (){
// Item Tap
GrockMenu.close(); // close menu
}
),
GrockMenuItem(
text: 'Share',
trailing: const Icon(Icons.ios_share_rounded,size: 20,),
),
],
child: const Icon(CupertinoIcons.ellipsis_circle_fill,color: Colors.blue,),
onTapClose: true, // Close menu when tapping GrockMenuItem, [true by default]
onTap: (value){
switch (value) {
case 0:
print("Tap Copy");
break;
case 1:
print("Tap Share");
break;
default:
print("Tap Default");
break;
}
},
dividerBuilder: (context,index)=>index == 1 ?
const Divider(height: 0,color: Colors.red,thickness: 2,) :
const Divider(color: CupertinoColors.separator,thickness: 1,height: 0,),
)
GrockDropdownButton [IOS Style] #
GrockDropdownButton(
items: [
for (var item in items)
GrockDropdownMenuItem(
child: Text(item),
onPressed: (String? newValue) {
setState(() {
currentValue = newValue;
});
Grock.back();
},
decoration: BoxDecoration(
color: currentValue == item
? Colors.grey.shade200
: Colors.white,
),
trailingWidget: currentValue == item
? const Icon(Icons.check, color: Colors.green)
: null,
),
],
value: currentValue,
hintText: "Selection",
),
GrockFadeAnimation #
GrockFadeAnimation(
position: PositionF.bottom,
duration: Duration(seconds: 2),
curve: Curves.bounceOut,
child: child(),
)
GrockScaleAnimation #
GrockScaleAnimation(
alignment: Alignment.center,
duration: Duration(seconds: 2),
curve: Curves.fastOutSlowIn,
begin: 0.8,
end: 1.0,
addListener: (animatedController) {
if (animatedController.isCompleted) {
animatedController.reverse();
} else if (animatedController.isDismissed) {
animatedController.forward();
}
},
child: child(),
)
GrockRotateAnimation #
GrockRotateAnimation(
alignment: Alignment.center,
duration: Duration(seconds: 1),
curve: Curves.fastOutSlowIn,
begin: 0.0,
end: 1.0,
addListener: (animatedController) {
if (animatedController.isCompleted) {
animatedController.reverse();
} else if (animatedController.isDismissed) {
animatedController.forward();
}
},
child: child(),
)
GrockCrossFade #
GrockCrossFade(
firstChild: child(),
secondChild: child2(),
duration: Duration(milliseconds: 500.milliseconds),
state: isShow ? GrockCrossFadeState.first : GrockCrossFadeState.second,
type: GrockCrossFadeType.scaleRotateFade,
)
GrockShimmer #
CachedNetworkImage(
imageUrl: "https://picsum.photos/200/300",
imageBuilder: (context, imageProvider) => Container(
width: 200.0,
height: 300.0,
decoration: BoxDecoration(
image: DecorationImage(
image: imageProvider,
fit: BoxFit.cover,
),
),
),
placeholder: (context, url) => GrockShimmer(
child: Container(
width: 200.0,
height: 300.0,
decoration: BoxDecoration(
color: Colors.grey,
),
),
),
),
GrockGlassmorphism [IOS Style] #
GrockGlassMorphism(
blur: 20,
opacity: 0.2,
borderRadius: BorderRadius.circular(12),
child: Image(".../images.png") or Container(child: Icon(Icons.search)),
color: Colors.white,
),
GrockKeyboardClose #
return GrockKeyboardClose(
child: Scaffold(
// Scaffold on tap and close keyboard
body: TextField(
),
),
);
GrockScrollEffect #
return GrockScrollEffect(
child: Scaffold(
//android drag and scroll effect disable
body: ListView.builder(
....
),
),
);
GrockHList #
return GrockHList(
itemCount: 10,
itemHeight: 55,
itemWidth: 55,
listHeight: 80,
itemBuilder: (context, index) {
return Container();
},
);
GrockInfoWidget #
return GrockInfoWidget(
msg: "Grock Info Popup Tooltip"
);
GrockWidgetSize #
return GrockWidgetSize(
callback: (Size size, Offset offset){
print("Size: $size");
print("Offset: $offset");
},
child: Container(),
);
GrockCustomLoadingWidget or Grock.loadingPopup() #
Grock.loadingPopup(
backgroundColor: Colors.black.withOpacity(0.5),
color: Colors.white,
borderRadius: BorderRadius.circular(12)
);
return GrockCustomLoadingWidget(
backgroundColor: Colors.black.withOpacity(0.5),
color: Colors.white,
borderRadius: BorderRadius.circular(12)
);
Grock Internet Check Function #
//Splash Screen initState
@override
void initState() {
super.initState();
Grock.checkInternet();
}
Snackbar and Dialog and Toast (BUT NO CONTEXT π) #
Grock.snackBar [IOS Style] #
TextButton(
child: const Text('No Context Snackbar'),
Grock.snackBar(
title: "Snackbar",
description: "Snackbar content",
blur: 20,
opacity: 0.2,
leading: Icon(Icons.error),
curve: Curves.elasticInOut,
// ... vs parameters
),
),
Grock.dialog #
TextButton(
child: const Text('No Context Dialog'),
onPressed: () {
Grock.dialog(builder: (_) {
return const AlertDialog(
title: Text('Dialog'),
content: Text('Dialog content'),
);
});
},
),
Grock.toast #
GrockButton(
color: Colors.white,
child: const Text(
"Show Toast",
),
onTap: () => Grock.toast(
text: "This is a toast",
),
),
List Extension #
['data','data1'].mapIndexed((value, index){})
['data','data1'].forLoop((value, index){})
['data','data1'].mapIndexedWhere((value, index))
['data','data1'].mapFiltered((value){})
String Extension #
String.capitalize
String.capitalizeEach
String.capitalizeEachFirst
String.capitalizeEachFirstLower
String.capitalizeEachLower
String.capitalizeEachLowerFirst
String.toDate
String.filter
String.filterNumber
String.forEach
String.forEachFirst
String.forEachFirstLower
String.isPhoneNumber
String.isPhoneNumberWithCountryCode
String.isPhoneNumberWithCountryCodeAndSpace
String.isTurkeyPhoneNumber
String.isTurkeyPhoneNumberWithCountryCode
String.isTurkeyPhoneNumberWithCountryCodeAndSpace
String.isEmail
String.isUrl
String.isUrlWithSpace
String.isEmpty
String.dateTime
String.isDateTimeFormat
String.isSearch(istanbul)
String.toTextWidget()
Widget Tools π€© #
Widget Extensions #
Container().material(),
Container().visible(val),
Container().disable(disable),
Container().disableOpacity(disable and opacity: 0.2),
Container().expanded(),
Container().size(width,height),
Container().padding(all: 24),
Container().rotate(value: 0.2),
Container().alignment(alignment),
Container().tooltip(msg),
Container().onTap((){}),
Container().bgBlur(10),
Container().borderRadius(10),
Container().center(),
Container().scrollable(),
Container().decoration(BoxDecoration),
Container().forgroundGradient(),
Container().oval(),
ExpansionTile().removeDivider(),
Container().colored(Color),
Container().shadow(),
Container().animatedRotation(),
Container().upRotation,
Container().rightRotation,
Container().leftRotation,
Container().bottomRotation,
num(int, double) Extension #
50.randomNum(), // 0-50 random number
index.randomImage(),
index.randomImg()
30.lorem(), // lorem ipsum text
20.height(), // SizedBox(height: 20)
20.width(), // SizedBox(width: 20)
20.heightWidth(), // SizedBox(height: 20,width: 20)
20.borderRadius,
20.borderRadiusOnlyTopLeft,
20.borderRadiusOnlyTopRight,
20.borderRadiusOnlyBottomLeft,
20.borderRadiusOnlyBottomRight,
20.borderRadiusOnlyTop,
20.borderRadiusOnlyBottom,
20.padding,
20.paddingOnlyTop,
20.paddingOnlyBottomRight,
20.paddingOnlyLeftRight,
20.getRandomString(15), // 15 length random string
1.seconds, /// => Duration(seconds: 1)
1000.milliseconds, /// => Duration(milliseconds: 1000)
BuildContext extension #
context.bottom, // SafeArea Bottom
context.top, // SafeArea Top
context.isKeyBoardOpen, // true or false
context.mediaQuery,
context.textTheme, // TextTheme extension
context.orientation,
context.isLandscape,
context.isPortrait,
context.platformBrightness,
context.isPhone, // device size < 600
context.isSmallTablet,
context.isLargeTablet,
context.platform,
context.openDrawer,
context.openEndDrawer,
context.hideCurrentSnackBar,
context.removeCurrentSnackBar,
context.showSnackBar,
context.isTablet,
context.showBottomSheet,
context.hasFocus,
context.isFirstFocus,
context.nextFocus,
context.unfocus,
context.consumeKeyboardToken,
context.validate,
context.reset,
context.save,
context.closeKeyboard,
Grock extension [No BuildContext] #
Grock.context,
Grock.height,
Grock.width,
Grock.bottomCenter,
Grock.bottomLeft,
Grock.bottomRight,
Grock.center,
Grock.centerLeft,
Grock.centerRight,
Grock.topLeft,
Grock.topRight,
Grock.topCenter,
Grock.deviceWidth,
Grock.deviceHeight,
Grock.isIOS,
Grock.isAndroid,
Grock.isMacOS,
Grock.isWindows,
Grock.isLinux,
Grock.isFuchsia,
Grock.isDebugMode,
Grock.isReleaseMode,
Grock.isProfileMode,
Grock.hideKeyboard,
Grock.showGrockOverlay(),
Grock.isOpenGrockOverlay(),
Grock.closeGrockOverlay(),
Grock.empty(),
Grock.randomColor(),
Developer Extension #
'test data'.logger,
'test data'.printer,
Function Extension #
initState(){
super.initState();
function.widgetBinding();
}
Padding or Margin and BorderRadius #
GrockContainer(
margin: 10.verticalP,
// margin: 10.horizontalP,
// margin: 10.allP,
padding: [20,40].horizontalAndVerticalP,
// padding: [10,13,14,12].paddingLTRB
width: Grock.width * 0.3,
height: Grock.height * 0.1,
decoration: BoxDecoration(
borderRadius: 15.allBR,
),
),
Random Online Image #
GrockList(
isExpanded: true,
itemSpace: const Divider(),
itemCount: 10,
itemBuilder: (context,index)=>Image.network(
index.randomImg(), // width and height optional
),
)
GrockMixin #
class _MyHomePage
extends GrockStatefulWidget
with GrockMixin {
initState(){
super.initState();
setStateIfMounted((){
// your code
})
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
children: [
GrockContainer(
onTap: (){
showGrockSnackBar();
showGrockSnackBarWithAction();
showGrockSnackBarWithActionAndIcon();
showGrockSnackBarWithIcon();
showGrockMaterialBanner();
showGrockMaterialBannerWithIcon();
showGrockMaterialBannerWithIconAndColor();
/// Adaptive Dialog
showGrockAdaptiveDialog();
showGrockAdaptiveDialogWithIcon();
/// Adaptive DatePicker and TimePicker
showGrockAdaptiveDatePicker();
showGrockAdaptiveTimePicker();
/// Adaptive BottomSheet
showGrockAdaptiveBottomSheet();
/// Adaptive Button
GrockAdaptiveButton(); // => Widget
/// Validations
emailValidation(email);
passwordValidation(password);
phoneValidation();
phoneValidationWithCountryCode();
/// Tools
hideKeyboard();
isKeyboardOpen();
isKeyboardClose();
/// SafeArea
safeAreaTop();
safeAreaBottom();
safeAreaLeft();
safeAreaRight();
safeArea();
safeAreaWithPadding();
safeAreaWithPaddingAndBottom();
},
width: dW(0.5),
height: dH(0.5),
),
],
),
);
}
}